Code Block Syntax Highlighter

Home Forums Iconic One Pro Support Code Block Syntax Highlighter

This topic contains 3 replies, has 2 voices, and was last updated by  Themonic-Support 1 year, 8 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #6752

    yubi
    Participant

    Hi team,

    Do you have a syntax highlighter feature with this theme? I want to change the code block with some syntax highlighting without using plugins.

    Any help would be greatly appreciated.

    Thanks

    #6753

    Hi,

    No, you have to use a plugin for that.

    To change base background color and styles of pre tag (code tag from blocks), use like the following in Customizer -> Additional CSS:

    
    .entry-content pre {
        border: 1px solid #ededed;
        border-radius: 0;
        margin: 24px 0;
        background: #333333;
        padding: 24px;
        color: #ffffff;
    }

    You can modify as per your requirements.

    #6754

    yubi
    Participant

    Thank you for your quick response.

    I want another help.

    How to make code block compact. Currently, my code is not compact. It has lots of line breaks and spaces.

    When I use language-css class from css in code tag like following:

    <code class=”language-css”>
    // My code here

    The code displays nicely.

    I have added that class manually doing inspect element.

    Could you please help me to add that class to my code tag like I can override custom css?

    Note: I don’t have the implemented CSS code for that class. If I can get the css code for that class that is also ok. Because I can add that css to my custom css file

    Thank you

    #6755

    Try

    
    .entry-content .language-css {
    CSS here
    }

    in Customizer -> Additional CSS.

    Regarding line break and blank spaces, if you are copying code, first copy and paste to notepad++ and then copy and paste to WordPress editor.

    Please contact via support email for further support on this if needed.

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Code Block Syntax Highlighter’ is closed to new replies.