ब्लॉगर में Whatsapp Share बटन कैसे लगाए ?

यदि आप अपनी ब्लॉगर वेबसाइट में WhatsApp Share Button लगाना चाहते हो तो आप निचे दिए गए कोड को अपने ब्लॉगर HTML में लगा कर आसानी से WhatsApp Share Button लगा सकते हो। ब्लॉगर में WhatsApp Share Button लगाने की पूरी प्रक्रिया निचे बताई गई है।

Step 1)

1. सबसे पहले आप ब्लॉगर में लॉगिन करे।

2. उसके बाद Theme ऑप्शन पर क्लिक करे।

3. उसके बाद Edit HTML ऑप्शन पर क्लिक करे।

4. उसके बाद HTML एरिया में एक बार क्लिक करे और उसके बाद कीबोर्ड से ctrl+f दबाये। कीबोर्ड से ctrl+f दबाने से एक सर्च बॉक्स खुल जायेगा।

5. उसके बाद उस सर्च बॉक्स के अंदर आप ]]></b:skin> लिख कर सर्च करे।

6. उसके बाद आप निचे दिए गए CSS कोड को कॉपी करे और ]]></b:skin> के ऊपर पेस्ट करे।

.tist{background:#35BA47; 
color:#fff; 
padding:2px 6px; 
border-radius:3px;}
a.tist:hover{color:#fff !important;}

Step 2)

ऊपर दिए गए CSS कोड को पेस्ट करने के बाद अब आप सर्च बॉक्स में </head> लिख कर सर्च करे। उसके बाद निचे दिए गए JAVA SCRIPPT कोड को कॉपी करे और </head> टैग के ऊपर की तरफ पेस्ट कर दे।

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script>
$(document).ready(function() {
$(document).on("click", '.tist', function() {
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
var text = $(this).attr("data-text");
var url = $(this).attr("data-href");
var message = encodeURIComponent(text) + " - " + encodeURIComponent(url);
var whatsapp_url = "whatsapp://send?text=" + message;
window.location.href = whatsapp_url;} 
else {alert("If you want to share on WhatsApp, Then please use Mobile Device");}});
});
</script>

Step 3)

JAVA SCRIPPT कोड को </head> टैग के ऊपर पेस्ट कर देने के बाद अब आप निचे दिए गए HTML कोड को कॉपी करे और जहा आपके दूसरे शेयर बटन लगे हुए है उनके साथ निचे दिए हुए HTML कोड को पेस्ट करे। यदि आपकी वेबसाइट में शेयर बटन पहले से नहीं लगे हुए है तो आप सर्च बॉक्स में <data:post.body/> लिख कर सर्च करे। उसके बाद <data:post.body/> टैग के निचे आप इस HTML कोड को पेस्ट करे। (ध्यान रहे – HTML के अंदर <data:post.body/> कोड सर्च करेने पर ये कोड आपको एक से ज्यादा बार मिल सकता है तो आपको सबसे आखरी वाले कोड के निचे ही ये HTML कोड पेस्ट करना है। )

<a class='tist' expr:data-href='data:post.url' expr:data-text='data:post.title' href='#'>WhatsApp</a>

सभी कोड अच्छे से लगा लेने के बाद Save Theme पर क्लिक करे और अपने थीम को सेव कर ले। अब आपकी ब्लॉगर वेबसाइट में WhatsApp Share Button लग चूका है। यदि आप इसको और भी अच्छे से समझना चाहते हो तो निचे दिए गए वीडियो लिंक पर क्लिक कर के इसका वीडियो देख सकते हो। वीडियो के अंदर आपको WhatsApp Share Button लगा कर दिखाया गया है।

वीडियो देखने के लिए यहाँ क्लिक करे।