How to add float button share html css for blogger in hindi

[हिंदी में] float WhatsApp share button html code for blogger blog website in hindi

How to Add a Floating whatsapp Share Button in Blogger in hindi

blogger / blogspot पर आप wordpress site की तरह ही अपनी वेबसाइट को डिजाइन भी कर सकते हैं, लेकिन इसके लिए आपको एचटीएमएल [HTML language for blogging] का नॉलेज होना बहुत जरूरी है blogging ke liye html language kaise sikhe in hindi

अगर दोस्तों आप ब्लॉक कर पर अपनी वेबसाइट या अपने ब्लॉग को बना रखे हैं तो यह कोई गलत नहीं है बहुत ही अच्छा प्लेटफार्म है जिसमें पैसे एक भी नहीं लगता लेकिन आपको एचटीएमएल का ज्ञान है। तो अब बहुत अच्छे से अपनी वेबसाइट को डिजाइन कर सकेंगे लेकिन इसने कुछ परेशानियां भी हैं, जैसे कि आप मनचाही permalink जनरेट नहीं कर सकते। क्योंकि ब्लॉगर पर किसी भी पोस्ट का लिंक में आपको “महीना और साल लिखा” देखने को मिलता है।
अगर इसको इग्नोर करें तो ब्लॉगिंग के लिए ब्लॉगर से अच्छा कुछ भी नहीं होगा वर्डप्रेस एक दूसरा ऑप्शन है यदि आपके पास बजट है तो आप वर्डप्रेस चुन सकते हैं। चलिए आज हम जानते हैं कि ब्लॉगर में अपने किसी भी थी पर आप फ्लोटिंग शेयर बटन कैसे लगाएं

Blogger me Floating whatsapp Share button kyu lagaye?

दोस्तों ब्लॉगर की वेबसाइट पर आप ने देखा होगा कि जैसे ही पोस्ट खत्म होती है उसके बाद में share का बटन आता है। जिस पर क्लिक करके blog post का टाइटल और यूआरएल शेयर होती है।
लेकिन यह पूरे पेज में एक ही जगह पोस्ट के खत्म होने बाद ही दिखती हैं लेकिन यदि आप इसे स्क्रीन पर फिक्स करके रख दे और डिस्प्ले पर सभी को हर एक समय दिखती रहे तो इस बटन पर क्लिक ज्यादा होंगे और आपकी पोस्ट ज्यादा share होगी जिससे आपके व्यूज और बैकलिंक ज्यादा बढ़ेंगे इस तरीके से अब की blog wensite जल्दी renk करेगी और और ब्लॉगिंग से ज्यादा पैसा कमा सकते हैं।

floating whatsapp share button in blogger
floating whatsapp share button in blogger

Blogger (blogspot) wale Blog Me floating whatsapp ka Share button kaise add kare?

Float WhatsApp share button html code for blogger: ब्लॉगर में फ्लोटिंग व्हाट्सएप शेयर बटन लगाने के लिए आपको floating WhatsApp share buttons html code की जरूरत पड़ेगी जो मैं नीचे आपको step by step तरीके से समझा रहा हूं

सबसे पहले blogger.com पर अपने ब्लॉग का डैशबोर्ड को लॉगिन करे।

अब theme बटन पर क्लिक करे।

blogger blogspot theme editing


ओरेंज कलर का Customize बटन के पास drop down मेनू पर क्लिक करे।

blogger share button whatsapp kaise lagaye

इसके बाद edit HTML पर क्लिक करे और थीम का कोड ओपन कर ले (ध्यान रहे कोड की जानकारी न हो तो अपनी ब्लॉगर थीम का बैकअप जरूर ले)

अब theme बटन पर क्लिक करे।

ओरेंज कलर का Customize बटन के पास drop down मेनू पर क्लिक करे।

इसके बाद edit HTML पर क्लिक करे और थीम का कोड ओपन कर ले (ध्यान रहे कोड की जानकारी न हो तो अपनी ब्लॉगर थीम का बैकअप जरूर ले)

अब </style> को ढूंढे इसके लिए control+f करे और सर्च बॉक्स में </style> लिखे ये तुरन्त मिल जाएगा।

</style> के ठीक पहले नीचे दिया हुआ CSS add कर दे / agar ye style tag nhi find ho to ]]></b:skin> search kare

#wa-whatsapp-button { 
position: fixed;
width: 45px;
height: 45px;
fill: #fff;
background: blue;
bottom: 150px;
right:0px;
z-index: 100;
transition: opacity 2.3s; }

अब </body> को सर्च कर ओर इसके ठीक पहले ही नीचे दिया हुआ कोड कॉपी कर पेस्ट कर दो।

<a class='ncie' href='exmaple.com/' rel='nofollow noreferrer' target='_blank' title='Blogger Templates Whatsapp Help'><svg class='whatsapp-ico' id='wa-whatsapp-button' viewBox='0 0 32 32'><path d=' M19.11 17.205c-.372 0-1.088 1.39-1.518 1.39a.63.63 0 0 1-.315-.1c-.802-.402-1.504-.817-2.163-1.447-.545-.516-1.146-1.29-1.46-1.963a.426.426 0 0 1-.073-.215c0-.33.99-.945.99-1.49 0-.143-.73-2.09-.832-2.335-.143-.372-.214-.487-.6-.487-.187 0-.36-.043-.53-.043-.302 0-.53.115-.746.315-.688.645-1.032 1.318-1.06 2.264v.114c-.015.99.472 1.977 1.017 2.78 1.23 1.82 2.506 3.41 4.554 4.34.616.287 2.035.888 2.722.888.817 0 2.15-.515 2.478-1.318.13-.33.244-.73.244-1.088 0-.058 0-.144-.03-.215-.1-.172-2.434-1.39-2.678-1.39zm-2.908 7.593c-1.747 0-3.48-.53-4.942-1.49L7.793 24.41l1.132-3.337a8.955 8.955 0 0 1-1.72-5.272c0-4.955 4.04-8.995 8.997-8.995S25.2 10.845 25.2 15.8c0 4.958-4.04 8.998-8.998 8.998zm0-19.798c-5.96 0-10.8 4.842-10.8 10.8 0 1.964.53 3.898 1.546 5.574L5 27.176l5.974-1.92a10.807 10.807 0 0 0 16.03-9.455c0-5.958-4.842-10.8-10.802-10.8z' fill-rule='evenodd'/></svg></a>
<script>   $(&#39;.ncie&#39;).attr(&#39;href&#39;, &#39;https://api.whatsapp.com/send?text=hello%20maine%20abhi%20ye%20dekha%20ye%20trick%20bahut%20achhi%20hain%20isko%20aage%20*share%20kar%20jaldi*.%20&#39; + window.location); </script>
whatsapp floating share button kaise lagaye blogger me

इसके बाद theme को save कर दे जैसे आप इस ब्लॉग वेबसाइट को विजिट करेंगे तो आप पाएंगे कि इस स्क्रीन पर एक स्थाई जगह पर संपूर्ण समय के लिए एक व्हाट्सएप का बटन दिखाई देगा जिस पर क्लिक करने पर व्हाट्सएप ओपन होगा और कुछ लिंक शेयर हो जाएंगे

blogger me floating WhatsApp share button kaise lagaye

Leave a Comment

Your email address will not be published. Required fields are marked *