Skip to main content

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

Unknown said…
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.
Nice, finding this code... 2 days...

Popular posts from this blog

FamilyAlbum - Free Unlimited Storage - Share Family Photos and Videos - Auto-Organized Album

Website :- https://family-album.com Play Store :- https://play.google.com/store/apps/details?id=us.mitene Description from Play Store The best way to safely share and organize your family’s photos and videos. Unlimited storage, no ads, and it’s free! 3 Reasons to Start Your Album: 1) You’ll love it YOUR MEMORIES ON DISPLAY. Show off your photos and videos in a way that’s both beautiful and intuitive. Everything is automatically sorted by month, complete with your child’s age. Just swipe the screen to go back in time! UNLIMITED STORAGE. Back up all your memories for free. STREAMLINED SHARING. No more sharing the same photo with five different group chats. All your photos, all your videos, all your favorite people, all in one place. YOUR PRIVACY IS OUR PRIORITY. Your album is completely private. All content you upload to the app belongs to you, and it can only be viewed by you and the family and friends you invite. That also ...

Git Conflict Guide 🚀

What is a Git Conflict? A Git conflict occurs when two branches have changed the same part of a file, and Git cannot automatically merge the changes. When you attempt to merge or rebase branches, Git will pause the process and mark the conflicted files. Steps to Resolve a Git Conflict 1. Identify Conflicted Files When you encounter a conflict, Git will mark the conflicted files. You can see these files by running: git status Enter fullscreen mode Exit fullscreen mode 2. Open the Conflicted File Open the conflicted file(s) in your code editor. You'll see Git's conflict markers: <<<<<<< HEAD Your changes ======= Incoming changes >>>>>>> branch-name Enter fullscreen mode Exit fullscreen mode <<<<<<< HEAD marks the beginning of your changes. ======= separates your changes...

Random Posts