Can't get code to format

  • Unknown's avatar

    Wordpress comes with a code shortcode that is supposed to format code. It is explained here:

    SyntaxHighlighter Code Block


    except that it does not work. I have tried it many many times without luck. E.g., I wrote following post as test
    [code lang="java"]
    import java.util.Map;

    import java.util.Properties;

    /**

    * Created by moksha on 07/02/16.

    */

    public class JavaEnvironmentVariables {

    public static void main(String args[]){

    System.out.println("******************************Environment Vars*****************************");

    Map<String, String> enviorntmentVars = System.getenv();

    enviorntmentVars.entrySet().forEach(System.out::println);

    }

    }

    [/code]
    but it does not format the code. Can anyone in WP fix this please? Without the code formatting, all my posts show as badly formatted and are terrible to read.

    The blog I need help with is: (visible only to logged in users)

  • You’re using lang="java"

    Instead, please use language="java"

  • Unknown's avatar

    I have tried that as well and it does not make any difference. The documentation says
    The language (or lang) parameter controls how the code is syntax highlighted.

  • Would you please give us a link to the post or page on your site where you’re trying this?

  • Unknown's avatar

    here is the link:
    https://sidshome.wordpress.com/2020/03/05/test-post-2/

    I authored this post via email.

    I have also tried using the WP editor but it also does not process the code shortcode correctly. see this: https://en.forums.wordpress.com/topic/how-to-avoid-wordpress-from-auto-inserting-p-and-span-tags-when-posting-code-in-a-blog-post/

    this was the email I sent to publish the post:

    trying to get this to work

    SyntaxHighlighter Code Block

    [code lang="java"]
    import java.util.Map;

    import java.util.Properties;

    /**

    * Created by moksha on 07/02/16.

    */

    public class JavaEnvironmentVariables {

    public static void main(String args[]){

    System.out.println("******************************Environment Vars*****************************");

    Map<String, String> enviorntmentVars = System.getenv();

    enviorntmentVars.entrySet().forEach(System.out::println);

    }

    }

    [/code]

  • Is this happening when you try to write the code directly into the editor or only when you’re using the post by email feature?

  • Unknown's avatar

    It happens in BOTH cases.

    When I use the post by email feature the code shortcode is simply ignored and when I write code directly into the editor, WP does some really bad formatting to the code and inserts all sorts of junk. I had posted about that experience here: https://en.forums.wordpress.com/topic/how-to-avoid-wordpress-from-auto-inserting-p-and-span-tags-when-posting-code-in-a-blog-post/

    would really appreciate if WP can fix this bug. Without code formatting, all my posts look extremely ugly.

  • I can see your post looks bad, but I can’t seem to duplicate this on my test site no matter what I try.

    Could you put up a pastebin (or something similar) of the unmodified code and send us the link? I’m wondering if something’s getting stripped out.

    And, would you be willing to try inserting the code using the block editor instead, to see if that helps at all? We can enable the block editor for you if you’re missing it.

  • Unknown's avatar

    here is the full text of the email that I used to create the post:


    trying to get this to work
    https://en.support.wordpress.com/wordpress-editor/blocks/syntax-highlighter-code-block/2/
    [code lang="java"]
    import java.util.Map;
    import java.util.Properties;
    /**
    * Created by moksha on 07/02/16.
    */
    public class JavaEnvironmentVariables {
    public static void main(String args[]){
    System.out.println("******************************Environment Vars*****************************");
    Map<String, String> enviorntmentVars = System.getenv();
    enviorntmentVars.entrySet().forEach(System.out::println);
    }
    }
    [/code]

    view raw

    gistfile1.txt

    hosted with ❤ by GitHub

    and I have tried same text in WP editor as well.

    In case of post by email the [code] shortcode seems to have no effect and in case of editor the post gets badly formatted and has all sorts of rubbish in it mentioned in https://en.forums.wordpress.com/topic/how-to-avoid-wordpress-from-auto-inserting-p-and-span-tags-when-posting-code-in-a-blog-post/

  • Unknown's avatar

    @supernovia, does it matter what theme is being used? the [code] shortcode should work with all themes I imagine.

  • I’ve copied your code to my test site, using the Block Editor and the Syntax Highlighter Block, the result can be seen here:

    Could you please try using the Block Editor as well and let us know if that helps? When pasting to the Syntax Highlighter Block you don’t need to use the shortcode, you would just paste the code itself and choose the programming language used from the right sidebar.

    The theme should not affect how the shortcodes work.

  • Unknown's avatar

    Hi staff-mckluskey

    I need this to work with the post by email feature. I don’t use the WP editor (esp. block) as its not very easy on my wrists. Could this be fixed please so that it works with post by email?

  • We’ll look into this and see what we can do, but please do note that we can’t promise all desktop and app-available formatting will work via post-by-email.

    Have you tried one of the apps instead? https://apps.wordpress.com/

  • Unknown's avatar

    staff-blorbo I did try the Mac app today and it gives same result as the web browser based editor. See this:

    https://imagebin.ca/v/5JFpulWw5PzP

    staff-mckluskey what theme were you using when you tested it? Could you please try with twentyten as that is the theme I use. I once changed my theme and then had a hard time switching back to twentyten so don’t want to change themes to test if the code tag has issues with twentyten.

  • Unknown's avatar

    I have noticed that it ONLY works when the editor is set to Code

    https://imagebin.ca/v/5JFsZIwVMp0n

    Thus it WILL NOT WORK with Visual Editor. Is this a known issue? I don’t anything in the docs that says one has to use the Code Editor for the code shortcode to work.

    Moreover, now if I try to edit my post, the formatting is hugely messed up.

    How can I specify that I am using the Code Editor when a publish a post using the post by email feature? Is there a shortcode to set the editor type?

  • So the post by email will be a different issue that needs investigation.

    But for using the Syntax Highlighter block, do you have better luck if you leave out the [code lang="java"] part, as well as the ending shortcode bracket?

    If I leave that out and select Java in the block settings, it works no matter the theme.

  • Unknown's avatar

    No, you don’t understand. See this video to see it in action and how annoying it is: https://youtu.be/itL6lgOUkNc

  • Unknown's avatar

    watch this instead: https://youtu.be/cloakU-7vtU

    TL;DR

    (Block Editor, Visual Mode) – Use SyntaxHighlighter Code Block

    (Block Editor, HTML Mode) – Using Code shortcode [code] ... [/code] will mess up the code inserting br and p tags

    (Classic Editor, Visual Mode) – Code shortcode does not work and the SyntaxHighlighter Code Block is not available

    (Classic Editor, HTML Mode) – Code shortcode [code] ... [/code] works sometimes but in other cases messes up the code just like before

    The code shortcode never worked for me using post by email feature.

    So only 1 case works and all others are broken. I am especially interested in the post by email since that is what I use to write my posts.

  • The Syntax Highlighter Block has different code (different repositories, different bug reporting) from the Code Shortcode for the classic editor. And PBE is another system too. We’ll need to handle those separately.

    You should only use [code]...[/code] if you are using the Code Shortcode. Don’t use it in the Syntax Highlighter Block:
    https://wordpress.com/support/wordpress-editor/blocks/syntax-highlighter-code-block/

    I don’t know why it’s working if you add it using the “code” view but you shouldn’t be adding it at all there, because the block is not a shortcode.

    So, given that:

    (Block Editor, HTML Mode) – Using Code shortcode [code] ... [/code] will mess up the code inserting br and p tags

    Could you confirm whether the syntax highlighter block works if you do not use shortcode tags there? If it works fine without shortcode tags (as intended) then we’ll focus our testing / bug reporting on the other scenarios.

  • Unknown's avatar

    Yes, I can confirm that. Thanks for testing / bug reporting on the other scenarios. Re-iterating, the PBE case should be the one to prioritize because if a user is using WP Editor, they might as well use Block Editor in Visual Mode.

    I am curious do you provide any command line interface (CLI) tools for users who would like to write their post in a text editor and process it with a CLI to format and publish it?

  • The topic ‘Can't get code to format’ is closed to new replies.