Syntax Highlighter with Copy Button Script for Blogger



Welcome friends, In this post blogger world are going to provide the script about Syntax Highlighter. By the Way, there are many articles on the Internet, YouTube Videos Tutorial & Facebook about Syntax Highlighter but this article are going very helpful for you.

Syntax Highlighter With Copy Button Script 


Many friends may also know what is this Syntax Highlighter? So I want to tell, sometime we want to add any code or scripts in to our blog post with copy button that can be easily copied and used whenever needed, and the format in Which it is added to the post, we know it by the name of Syntax Highlighter. You may made that source code Highlighter script in any blog post. But now everything is becoming Advance with time. In such a situation, now Normal Syntax Highlighter has also been made an advance. Now you also get to see Syntax Highlighter with Copy Button. And the advantage of this is that without selecting the button, you can easily copy all the code from the Text Area Box by clicking on the button.

Syntax Highlighter Script with Copy Button for Blogger 

<textarea cols="100" id="htmlText" readonly="" rows="20" style="background-color: #1b1b1b; color: white; height: auto; overflow: auto; resize: none; width: 100%;">

{----Enter You Code Here----}

</textarea>

<button id="htmlBtn" onclick="copyhtml()" style="background-color: #4caf50; border: none; color: white; cursor: pointer; display: inline-block; font-size: 16px; margin: 4px 2px; padding: 10px 30px; text-align: center; text-decoration: none;">Copy</button>
<script>
function copyhtml() {

const text = document.querySelector("#htmlText");

const btnText = document.querySelector("#htmlBtn");

text.select();

document.execCommand("copy");

btnText.textContent = "Copied";

setTimeout(function(){

btnText.textContent = "Copy";

}, 5000);

}
</script>
<br /><br /></div>
  1. Go to Blogger Post 
  2. Convert Compose mode to HTML 
  3. Where you want, Paste this code here 

Attention : 

Plz replace {--- Enter Your Code Here - TrickPk ---} with your own code or script. Now I have made available for you this Syntax Highlighter Copy Button Script Blogger. With its help, you can make your blogger posts very attractive. 

Conclusion : 

So friends, how did you like this article of Syntax Highlighter with Copy Button Script for Blogger. Please let us know by commenting below. Also, be sure to share this post with your friends and family members if it helpful for you also on social media!

एक टिप्पणी भेजें

0 टिप्पणियाँ
* Please Don't Spam Here. All the Comments are Reviewed by Admin.