Dosto kya aap bhi ya chahte hai ki aap ka whatsapp chat ka upper ek aisa hi chat show ho like aap ka DP show ho aap ka brand name show ho aur jaise hi start chat par click kara waise hi whatsapp chat open ho jaye aur jo bhi person jaha se bhi click kara ga waha ka url automatically copy ho kar aap ka pass aa jaye ga toh kya aap log bhi is feature ko blogger or blogspot website pa chahte hai toh is article ko step by step padhna rahiye.
#1 Method SIMPLE WHATSAPP BUTTON WIDGET
Aap ko yaha par ek tarike ka change karna hai sab sa phela aap ko yaha par aapna Whatsapp number change karna hai.
- Simply neecha diya code ko copy kara phir aap ko is code ko Notepad or Notepad++ par paste karna hai phir uska baad aap ko apna whatsapp number change karna hai code mai diya whatsapp number +910011223344 se aap ko apna Whatsapp number dalna hai.
- Code mai changes karna ka baad aap ko us code ko Blogger ka dashboard pa ja kar layout section pa jana hai phir uska baad add a new widget option par click kara jaha aap ko Whatsapp Chat button chaiye, phir uska baad select kara HTML/JavaScript Widget option ko. Select karna ka baad us code ko paste kar de aur save par click kara.
Aur phir jab aap apni website ko refresh karange toh aap whatsapp chat button dekh sakte hai.
<!-- GetButton.io widget -->
<script type="text/javascript">
(function () {
var options = {
whatsapp: "+910011223344", // WhatsApp number
call_to_action: "Message us", // Call to action
position: "right", // Position may be 'right' or 'left'
};
var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
})();
</script>
<!-- /GetButton.io widget -->
#2 Method FULL WHATSAPP CHAT WIDGET
Yaha par aap ko code mai kuch changes karna hai-
- Sabse phela aap ko search karna hai Gadgets Detected aur phir aap ko apna Brand Name se change karna hai.
- Phir aap ko search karna hai BrandImg aur change karna hai current url se(https://cdn.clare.ai/wati/images/WATI_logo_square_2.png) aap ko profile picture url se badalna hai.
- Search kara Gadgets Detected word ko aur change kara aapna name se (Aur un stars * symbol ko aalag mat karna)
- Aur aakhir mai change kara aapna whatsapp number ko 911234567890 aapne desh ka number ka saath (For Example: Country Code Is +92 And Number Is 1234567890 toh ye ho jaye ga 921234567890).
<script>
var url = 'https://wati-integration-service.clare.ai/ShopifyWidget/shopifyWidget.js?79435';
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = url;
var options = {
"enabled":true,
"chatButtonSetting":{
"backgroundColor":"#4dc247",
"ctaText":"",
"borderRadius":"25",
"marginLeft":"0",
"marginBottom":"50",
"marginRight":"50",
"position":"right"
},
"brandSetting":{
"brandName":"Gadgets Detected",
"brandSubTitle":"Typically replies within a day",
"brandImg":"https://cdn.clare.ai/wati/images/WATI_logo_square_2.png",
"welcomeText":"Hi there!\nHow can I help you?",
"messageText":"Hello, I have a question about {{page_link}}",
"backgroundColor":"#4dc247",
"ctaText":"Start Chat",
"borderRadius":"25",
"autoShow":false,
"phoneNumber":"911234567890"
}
};
s.onload = function() {
CreateWhatsappChatWidget(options);
};
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
</script>
Aagar aap ko koi dikkat aati hai toh aap mujhse comment box pa puch sakte hai.
Thankyou