Syntax Highlighter with Copy Button Script for Blogger

नमस्कार दोस्तों! स्वगात् है आपका Techly360 हिंदी ब्लॉग में. और आज के इस आर्टिकल में जानेंगे Syntax Highlighter with Copy Button Script के बारे में. या कहे की Blogger ब्लॉग आर्टिकल में Script Box Copy Button के साथ कैसे लगाये.

Advertisement

तो इस पोस्ट में हम आपको सभी जानकारियाँ उपलब्ध करवाने वाले है. वैसे तो इन्टरनेट पर आर्टिकल से लेकर YouTube Video Tutorial मौजूद होंगे. परन्तु जब बात आती है Live Demo के साथ दिखाने की, तो सभी सभी video धरे के धरे रह जाते है.

Syntax Highlighter with Copy Button Script for Blogger

Syntax Highlighter with Copy Button

बहुत सारे दोस्तों को शायद पता भी नाम हो की ये Syntax Highlighter क्या होता है? तो मैं आपको बता देना चाहता हूँ की किसी भी ब्लॉग पोस्ट में जो Source Code उपलब्ध करवाया जाता है. और उसे जिस फॉर्मेट में पोस्ट में Add किया जाता है उसे हम Syntax Highlighter के नाम से जानते है.

पंरतु अब समय के साथ साथ सब कुछ Advance होता जा रहा है. ऐसे में अब Normal Syntax Highlighter को भी एडवांस बना दिया गया है. अब इसमें आपको Syntax Highlighter with Copy Button भी देखने को मिल जाता है. और इसका फायदा यह है की बिना सेलेक्ट किये ही आप बटन पर क्लिक करके आसानी से सभी Code को Text Area Box से Copy कर सकते है.

Advertisement

इन्हें भी पढ़े:-


Syntax Highlighter with Copy Button Script for Blogger

अब मैंने निचे आपके लिए इस Syntax Highlighter Copy Button Script Blogger के लिए उपब्ध करवाया है. इसके मदद से आप अपने ब्लॉगर पोस्ट को बहुत ही आकर्षक बना सकते है.

Advertisement
<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>

नोट : {—-Enter You Code Here—-} के साथ आपको अपना Code Replace कर देना है.

निष्कर्ष : So दोस्तों आपको यह Syntax Highlighter with Copy Button Script for Blogger का आर्टिकल कैसा लगा. निचे कमेंट करके हमे जरुर बताये. और साथ ही इस पोस्ट को Social Media पर दोस्तों के साथ शेयर जरुर करे!

लेटेस्ट अपडेट्स पाने के लिए Techly360 को Facebook, Twitter और Instagram पर फॉलो करे. और वीडियोज देखने के लिए YouTube पर सब्सक्राइब करे.

Syntax Highlighter with Copy Button Script for Blogger

2 thoughts on “Syntax Highlighter with Copy Button Script for Blogger”

  1. Hello sir Aapne Jo is post me Jo code paste Kiya hai vo kaise Kiya hai please tell me hum bhi aapki Tarah ek blogger hai aap codes ko highlight Karne ke liye kon SE plugin ya kon SE code Ka istemal karte ho please tell me

    Reply

Leave a Comment

Copy link