Curlies in code examples: the eternal curse of WordPress

  • I don’t know why it took me so long to raise this issue, or why it isn’t a hot topic. I’m sure you have all encountered this problem over the years. You’re following a tutorial on how to do something either with code, shortcodes, or something similar. You get to a code-formatted block, like so:

    [formassembly formid=12345 server=”https://Yourserver.tld”]

    You copy the shortcode into your project, and change the values. It doesn’t work. You bank your head into the wall, trying to figure it out. Finally, you realize that the quotes in the example have been converted to smart quotes!

    In this example, the shortcodes were not in a code block. However, I have seen this problem every since the beginning of WordPress, all over the internet. There are countless tutorials on the web that have likely frustrated many a developer because there were converted characters in the code.

    One solution is to make sure no quotes inside any code-related tags, like the <pre> tag, are ever converted to curlies. We can also make sure this is never triggered inside Gutenberg code blocks. Finally, we can update the curly quote logic so that it doesn’t trigger when surrounded by other characters that indicate it is part of code syntax, and not grammatical syntax.

    • This topic was modified 1 year, 6 months ago by publicradio.
Viewing 3 replies - 1 through 3 (of 3 total)

  • If there’s a Code block made specifically to accept your code and display AS-IS, use it. And if there’s a Custom HTML block to accept and execute allowable code AS-IS, use that as well. There’s also a Shortcode block for… shortcodes.

    Just use the best tool for the job at hand.

    Problem solved.

    Thread Starter publicradio

    (@publicradio)

    That doesn’t solve the problem, though. For me, personally, I am aware of this problem and can make sure smart quotes don’t show in my code snippets. This doesn’t fix the thousands of tutorials already on the web with converted characters in the code examples.

    Thread Starter publicradio

    (@publicradio)

    I’m surprised this isn’t getting more traction. It’s a chronic, very pervasive problem. WordPress’ own developer reference has this problem! Yeah, there’s a code block further down the page, like @gappiah said, but the H1 at the top of the page includes single quotes that have auto-converted to prime symbols.

    Can you imagine how many developers have copied this into their code and spun their wheels until they realized their single quotes were just lookalike characters?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Curlies in code examples: the eternal curse of WordPress’ is closed to new replies.