Display Codes on website or Blogger with Copy Option ft. Prismjs.com

 Show Codes on website or Blogger with Copy Option ft. Prismjs.com

Steps :-

    1. Add PrismJS Library To Your Website .

       (i)  Add CSS CDN .

        

           <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/CDNSFree2/PrismJS@latest/prism.min.css">       
        
    

     (ii) Add Javascript CDN

        

          <script src="https://cdn.jsdelivr.net/gh/CDNSFree2/PrismJS@latest/prism.min.js"></script>       
        
    

    2. Now, Use The Combo of <pre> and <code> Tag To Show Your Code .

        
        <pre>
        <code class="language-javascript">
            function getParameterByName(name, url) {
                if (!url) url = window.location.href;
                name = name.replace(/[\[\]]/g, "\\$&");
                var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                    results = regex.exec(url);
                if (!results) return null;
                if (!results[2]) return '';
                return decodeURIComponent(results[2].replace(/\+/g, " "));
            }
                        
        </code>
    </pre>


        

Sample Code...

<pre>
    <code class="language-html">
    <!--//Your Code Goes Here-->

    </code>
</pre>
        

Here is Code Will Excuted as mentioned UP 

Plugins :- 

    1. Show line Numbers :- 

                For Showing Line numbers add <body class="line-numbers"> <!-- enabled for the whole page --> . See More Details ->

Note :- You must have to use HTML Entity Encoder To Show HML in Code Tag Otherwise the will run in the page .

Example :- https://mothereff.in/html-entities