Random Posts

Get This Gadget For Blogger :- WidgetWonderland

    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







    Comments

    1. sir how can I change dark theme to light theme please give me solutions because I want to light theme and there are I don't see anywhere.

      ReplyDelete

    Post a Comment