Syntax Highlighter with Copy Button Script for Blogger
Hello friends! Welcome to your Masud Computer BD blog. And in today's article you will learn about Syntax Highlighter with Copy Button Script. Or say how to put Script Box with Copy Button in Blogger blog article.
Syntax Highlighter with Copy Button
A lot of friends might even know the name What is this Syntax Highlighter? So I want to tell you that in any blog post which Source Code is made available. And the format in which it is added to the post is known as Syntax Highlighter.
But now with time everything is becoming Advance. Now Normal Syntax Highlighter has also been made advanced. Now you can see Syntax Highlighter with Copy Button in it. And the advantage of this is that you can easily copy all the code from the text area box by clicking on the button without selecting.
Syntax Highlighter with Copy Button Script for Blogger
Now I have made this Syntax Highlighter Copy Button Script Blogger available to you below. It lets you make your Blogger posts more compelling.
<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;"></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>
Note: You have to replace your code with {—-Enter You Code Here—-.
Conclusion: So guys how did you like this Syntax Highlighter with Copy Button Script for Blogger article. Let us know by commenting below.
ডোমেইন হোস্টিং সার্ভিস এই লিংকে চাপ দিন ।
ওয়েব ডিজাইন সার্ভিস এই লিংকে চাপ দিন ।
গ্রাফিক্স ডিজাইন সার্ভিস এই লিংকে চাপ দিন ।
ডোমেইন চেকার এই লিংকে চাপ দিন ।
