{"id":17356050,"date":"2024-01-19T07:26:58","date_gmt":"2024-01-19T07:26:58","guid":{"rendered":"https:\/\/wordpress.org\/support\/topic\/hyperlinks-inside-code-tags\/"},"modified":"2024-01-19T07:26:58","modified_gmt":"2024-01-19T07:26:58","slug":"hyperlinks-inside-code-tags","status":"publish","type":"topic","link":"https:\/\/wordpress.org\/support\/topic\/hyperlinks-inside-code-tags\/","title":{"rendered":"hyperlinks inside code tags"},"content":{"rendered":"\n

I’ve noticed an interesting discrepancy between Prismatic vs vanilla WordPress behavior: if I add a new page, Option (kebab menu) > Code editor and paste the following raw HTML:<\/p>\n\n\n\n

I use\u00a0<code><a href=\"https:\/\/perldoc.perl.org\/perlrun\">perl -ne<\/a><\/code> one-liners every day.<\/code><\/pre>\n\n\n\n
and view the page with Prismatic deactivated<\/strong>, it renders as a hyperlink with monospaced link text, like this:<\/p>\n\n\n\n
I use\u00a0perl -ne<\/a><\/code> one-liners every day.<\/p>\n\n\n\n
However, when I activate Prismatic (even with Settings > Prismatic > General : Library = None) and view the same page again, it instead renders the HTML markup for the hyperlink, like this:<\/p>\n\n\n\n
I use\u00a0<a href=\"https:\/\/perldoc.perl.org\/perlrun\">perl -ne<\/a><\/code> one-liners every day.<\/p>\n\n\n\n
(which is not what I want — if I did want that, I would paste my markup into the Visual editor, which would take care of HTML-escaping it with e.g. &lt;<\/code> behind the scenes so it’s syntactically just text content for the code element)<\/p>\n\n\n\n
The test case above implicitly involves a Classic block, and one might argue that when dealing with Classic blocks it’s my responsibility to invert those tags (placing code<\/code> inside of a<\/code> instead of outside) and then everything would be fine.  However, it’s also pretty easy to fall into this same trap writing new content using the WP block editor: if I type<\/p>\n\n\n\n
I use perl -ne one-liners every day.<\/code><\/p>\n\n\n\n
into a paragraph block, then put backticks around the perl -ne<\/code> bit to make it inline code, then select just that bit with my mouse and click the Link button (and supply a URL) to make it a hyperlink, I end up with the same constellation of underlying tags — a<\/code> inside of code<\/code> — which looks fine in the block editor but not when viewing the page with Prismatic activated.  The raw HTML in this case ends up as:<\/p>\n\n\n\n
<!-- wp:paragraph -->\n<p>I use <code><a href=\"https:\/\/perldoc.perl.org\/perlrun\" data-type=\"link\" data-id=\"https:\/\/perldoc.perl.org\/perlrun\">perl -ne<\/a><\/code> one-liners every day.<\/p>\n<!-- \/wp:paragraph --><\/code><\/pre>\n\n\n\n
As a sort of cherry on top, I note that the WP block editor is also perfectly happy to let me select and hyperlink only part<\/em> of the contents of the code tag (e.g. just the rl<\/code>) in which case there’s no question of being able to solve it by inverting the tags.<\/p>\n\n\n\n
Thanks in advance for considering what I suspect may be a rather thorny issue…<\/p>\n","protected":false},"template":"","class_list":["post-17356050","topic","type-topic","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/support\/wp-json\/wp\/v2\/topic\/17356050","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/support\/wp-json\/wp\/v2\/topic"}],"about":[{"href":"https:\/\/wordpress.org\/support\/wp-json\/wp\/v2\/types\/topic"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.org\/support\/wp-json\/wp\/v2\/topic\/17356050\/revisions"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/support\/wp-json\/wp\/v2\/media?parent=17356050"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}