Tech Docs Buy Now

Code Blocks

Create code block with a sigle class that adjust for the dark as well as the light theme

Code Blocks

WoodPecker® uses PrismJS to render code blocks. To generate a codeblock for any progamming langauge just add the code in a code block <code class="language-html"></code> followed by the 'class="langauge-*"' where '*' is the language of your choice. We support the default PrismJS languages for additional languages you need to download theJS file for the relevant languge and include it in your markup.

                

<ul class = "nav nav-pills mb-3 mt-4" id = "pills-tab" role = "tablist">
    <li class = "nav-item">
        <a class = "nav-link active" id = "html-tab" data-toggle = "pill" href = "#html"
           role = "tab" aria-controls = "html" aria-selected = "true">HTML</a>
    </li>
    <li class = "nav-item">
        <a class = "nav-link" id = "scss-tab" data-toggle = "pill" href = "#scss"
           role = "tab" aria-controls = "pills-profile" aria-selected = "false">SCSS</a>
    </li>
    <li class = "nav-item">
        <a class = "nav-link" id = "js-tab" data-toggle = "pill" href = "#js"
           role = "tab" aria-controls = "pills-profile" aria-selected = "false">JS</a>
    </li>

</ul>