Sign in

Syntax Highlighter with prims js

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #440
    ajeet

    Hi Bob,

    I am trying to use Prism js in theme. I am following this docs:

    https://getpublii.com/docs/highlight-your-code-syntax-with-prism-js.html

    As suggested in the doc, I downloaded js and css files and put that in the respective folders.

    head.hbs

    `        {{/checkIf}}`
    `      `
    `       {{{@headCustomCode}}}`
    `    `
    `    `
    `        {{{@bodyCustomCode}}}`

    and in footer.hbs

    `{{#if @renderer.previewMode}}`
    `   `
    `   `
    `{{/if}}`
    ``
    `{{{@footerCustomCode}}}`
    `{{{ publiiFooter }}}`
    ``
    ``

    I wanted to use the dark layout ( below) , but I don’t know how how to proceed.

    desired-output

    Also, I don’t see any pop up like Code-css in Format section as shown in the image in the doc here

    View post on imgur.com

    Could you please help me out here.

    Thanks,

    Ajeet

     

     

    #443
    BobBob
    Support

    Hi Ajjet,

    Just follow the instructions, everything is described in detail https://getpublii.com/docs/highlight-your-code-syntax-with-prism-js.html

    Your example does not contain the prism.js file, this one must be added to the footer section.  To have a popup with a list of coding languages you have to add them to the config.json file.

    The” dark layout” was created by me and is available and delivered only with the following themes: Documentation and ProDocs.

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #445
    ajeet

    Sorry,

    I did add the code in footer, pasted it wrongly.

    View post on imgur.com

    View post on imgur.com

    I did not add the languages in the config file. I have added now

    View post on imgur.com

    But the pop is still not there.

    View post on imgur.com

    AM I missing something ????

     

    TIA.

    Ajeet

     

     

    #446
    BobBob
    Support

    Use FORMATS select, not the Code.

    screenshot-2019-10-11-o-18.45.37

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #449
    ajeet

    Yes, I added the labels at the wrong place in config file. I had to add under  here :

    “customElements”: [ ]
    It works.
    Thanks so much
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Syntax Highlighter with prims js’ is closed to new replies.