Syntax Highlighter with Copy Button Script for Blogger

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

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

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 कर सकते है.

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

• Image Comparison Slider Script for Blogger
• Subscribe to Unlock Download Link Script
• Google Drive Direct Link Generator Script
• Create YouTube Video Downloader Tool in blogger
• Create Keywords Generator Tool in Blogger
• YouTube Thumbnail Downloader Script for Blogger
• Image to WebP Converter Tool Script for Blogger

Syntax Highlighter with Copy Button Script for Blogger

अब मैंने निचे आपके लिए इस Syntax Highlighter Copy Button Script 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>

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

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