दोस्तों आज की इस Post में हम बात करने वाले कि ब्लॉगर में सोशल मीडिया
Follow Button Widget कैसे Add करते हैं Social Follow Gadgets Blogger Me
Kaise Lagaye , How to Add Social Media Icons on Blogger इसकी जानकारी
आपको इस पोस्ट में पढ़ने को मिलेगी !
दोस्तों Social Media Follow Button Widget को अपने ब्लॉग में Add करने से जो भी Visitors आपके ब्लॉग पर आते हैं वह आपके सोशल मीडिया को भी Follow कर सकते हैं और इससे आपके सोशल मीडिया पर Followers भी बढ़ते हैं !
इस Widget में आपको सोशल मीडिया Icons जैसे - YouTube, Instagram, Facebook, Twitter, Pinterest आदि के Icon मिलते हैं जिसपर आप Click करके Blog Author को उसके सोशल मीडिया Account पर भी फॉलो कर सकते हैं !
इसे भी पढ़े - 👇👇👇
Step - 1 |
| Social Follow Gadgets Blogger Me Kaise Lagaye |
दोस्तों Social Media Follow Button Widget को अपने ब्लॉग में Add करने से जो भी Visitors आपके ब्लॉग पर आते हैं वह आपके सोशल मीडिया को भी Follow कर सकते हैं और इससे आपके सोशल मीडिया पर Followers भी बढ़ते हैं !
Social Follow Gadgets Blogger Me Kaise Lagaye , How to Add Social Media Icons on Blogger
इस Widget में आपको सोशल मीडिया Icons जैसे - YouTube, Instagram, Facebook, Twitter, Pinterest आदि के Icon मिलते हैं जिसपर आप Click करके Blog Author को उसके सोशल मीडिया Account पर भी फॉलो कर सकते हैं !
इसे भी पढ़े - 👇👇👇
Blogger में Scrolling text widget कैसे लगाते हैं ? पूरी जानकारी हिंदी में
Blogger Blog Post में Code Box कैसे Add करते है? जाने हिंदी में
दोस्तों इस Widget को आप अपने ब्लॉग के Sidebar में बड़े आसानी के साथ लगा सकते हैं और इससे आपका ब्लॉग और भी शानदार लगने लगता है और जिस Visitors को आपके सोशल मीडिया Profile को देखना होता है या फिर सोशल मीडिया पर Follow करना होता है तो फिर वह इस Icon पर Click करके आपको फॉलो कर सकता है !Social Follow Gadgets ब्लागर में कैसे लगाएं ?
दोस्तों
तो फिर आइए जानते हैं कि ब्लॉगर में Social Media Follow Button Gadget
कैसे लगाते हैं इसके लिए आपको नीचे दिए गए Steps को फॉलो करना होता है !
Social Follow Widget No. 1
Step - 1
दोस्तों अगर आप इस तरह का Social Media Widget लगाना चाहते हैं तो फिर आपको सबसे पहले आपको नीचे दिया गया Code को Copy करना होता है !
Step- 2
Code Copy करने के बाद आपको अपने ब्लॉग के "Dashboard>Theme Section" में जाना होता है और वहां पर Edit HTML पर Click करना होता है !
Step- 3
अब आपने जो Code को Copy किया है उस Code को <head> के ऊपर Paste करना होता है !
Step - 4
अब आपको नीचे दिया गया Code को Copy करना होता है !
Step - 5
Code को Copy करने के बाद आपको अपने ब्लॉगर के Dashboard में जाकर Layout वाले Section पर Click करना होता है !
Step - 6
उसके बाद आपको Sidebar में Add A Gadget पर Click करके HTML/JavaScript पर क्लिक करना होता है और फिर उस Code को इस Box में Paste करना होगा !
दोस्तों Code में जिस जगह में सोशल मीडिया Account के URL दिए गये हैं वहां पर आपको अपने सोशल मीडिया Account के URL को Paste करना होता है !
तो इस तरह से आपके ब्लॉग के Sidebar में Social Media Follow Button Add हो जाएंगे और फिर आप View Blog करके देख सकते हैं !
दोस्तों अगर आप इस तरह का Social Media Widget लगाना चाहते हैं तो फिर आपको सबसे पहले आपको नीचे दिया गया Code को Copy करना होता है !
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
Step- 2
Code Copy करने के बाद आपको अपने ब्लॉग के "Dashboard>Theme Section" में जाना होता है और वहां पर Edit HTML पर Click करना होता है !
Step- 3
अब आपने जो Code को Copy किया है उस Code को <head> के ऊपर Paste करना होता है !
Step - 4
अब आपको नीचे दिया गया Code को Copy करना होता है !
<style>
.techornate-social-buttons ul{padding-left:0;list-style:none}.techornate-social-buttons li a{text-transform:uppercase;text-decoration:none;padding:10px 1px 10px 10px;letter-spacing:2px;font-size:10px;color:#fff;display:block;border-radius:3px}.techornate-social-buttons ul li{margin-bottom:10px;width:100%}.techornate-social-buttons li a i{width:35px;height:14px;float:right;padding:0 0 0 10px;margin:0;font-size:14px;line-height:14px;border-left:1px solid #B1B1B1}.techornate-social-buttons li a.social-btn-facebook{background:#3b5998}.techornate-social-buttons li a.social-btn-twitter{background:#1da1f2}.techornate-social-buttons li a.social-btn-youtube{background:#cd201f}.techornate-social-buttons li a.social-btn-instagram{background:#405de6}.techornate-social-buttons li a.social-btn-google{background:#dd4b39}
</style>
<div class="techornate-social-buttons">
<ul class="sidebar-social clearfix">
<li><a href="
https://www.facebook.com/Gyanhindionline/" class="social-btn-facebook">Like on Facebook <i class="fa fa-facebook"></i> </a></li>
<li><a href=" https://twitter.com/SAANSARI94?s=09" class="social-btn-twitter">Follow on Twitter <i class="fa fa-twitter"></i> </a></li>
<li><a href=" https://www.instagram.com/shazeb_ansari94/" class="social-btn-instagram">Follow on Instagram <i class="fa fa-instagram"></i> </a></li>
<li><a href=" https://www.yobutue.com/shazeb_ansari94/" class="social-btn-youtube">subscribe on youtube<i class="fa fa-youtube"></i> </a></li>
</ul></div>
.techornate-social-buttons ul{padding-left:0;list-style:none}.techornate-social-buttons li a{text-transform:uppercase;text-decoration:none;padding:10px 1px 10px 10px;letter-spacing:2px;font-size:10px;color:#fff;display:block;border-radius:3px}.techornate-social-buttons ul li{margin-bottom:10px;width:100%}.techornate-social-buttons li a i{width:35px;height:14px;float:right;padding:0 0 0 10px;margin:0;font-size:14px;line-height:14px;border-left:1px solid #B1B1B1}.techornate-social-buttons li a.social-btn-facebook{background:#3b5998}.techornate-social-buttons li a.social-btn-twitter{background:#1da1f2}.techornate-social-buttons li a.social-btn-youtube{background:#cd201f}.techornate-social-buttons li a.social-btn-instagram{background:#405de6}.techornate-social-buttons li a.social-btn-google{background:#dd4b39}
</style>
<div class="techornate-social-buttons">
<ul class="sidebar-social clearfix">
<li><a href="
https://www.facebook.com/Gyanhindionline/" class="social-btn-facebook">Like on Facebook <i class="fa fa-facebook"></i> </a></li>
<li><a href=" https://twitter.com/SAANSARI94?s=09" class="social-btn-twitter">Follow on Twitter <i class="fa fa-twitter"></i> </a></li>
<li><a href=" https://www.instagram.com/shazeb_ansari94/" class="social-btn-instagram">Follow on Instagram <i class="fa fa-instagram"></i> </a></li>
<li><a href=" https://www.yobutue.com/shazeb_ansari94/" class="social-btn-youtube">subscribe on youtube<i class="fa fa-youtube"></i> </a></li>
</ul></div>
Step - 5
Code को Copy करने के बाद आपको अपने ब्लॉगर के Dashboard में जाकर Layout वाले Section पर Click करना होता है !
Step - 6
उसके बाद आपको Sidebar में Add A Gadget पर Click करके HTML/JavaScript पर क्लिक करना होता है और फिर उस Code को इस Box में Paste करना होगा !
दोस्तों Code में जिस जगह में सोशल मीडिया Account के URL दिए गये हैं वहां पर आपको अपने सोशल मीडिया Account के URL को Paste करना होता है !
तो इस तरह से आपके ब्लॉग के Sidebar में Social Media Follow Button Add हो जाएंगे और फिर आप View Blog करके देख सकते हैं !
Social Follow Widget No. 2
दोस्तों अगर आप इस तरह का Social Media Widget लगाना चाहते हैं तो फिर आपको सबसे पहले आपको नीचे दिया गया Code को Copy करना होता है!
<style> .widget_social_apps { margin-left : -1%; margin-right : -1%; }
.widget_social_apps:after { clear : both; } .widget_social_apps .app_social { margin : 1% 0.5%; width : 49%; height : 45px; float : left; text-align : center;
background-color : #000; transition : all 0.2s; border-radius: 5px; }
.widget_social_apps .app_social.facebook { background-color : #4267b2; }
.widget_social_apps .app_social.twitter { background-color : #1DA1F2; }
.widget_social_apps .app_social.pinterest { background-color : #C92228; }
.widget_social_apps .app_social.instagram { background-color : #af2d9e; }
.widget_social_apps .app_social.google { background-color : #e24d3b; }
.widget_social_apps .app_social.linkedin { background-color : #0d6a96; }
.widget_social_apps .app_social.flickr { background-color : #ea097d; }
.widget_social_apps .app_social.youtube { background-color : #b5170a; }
.widget_social_apps .app_social.rss { background-color : #e07706; }
.widget_social_apps .app_social.tumblr { background-color : #5c6682; }
.widget_social_apps .app_social:hover { background-color : #cacaca; }
.widget_social_apps .app_social a { display : block; color : #ffffff; padding : 15px 5px; text-decoration: none; }
.widget_social_apps .app_social span { display : block; }
.widget_social_apps .app_social span.app_icon i { font-size : 12px; margin-bottom : 10px; }
</style>
<br />
<div class="widget_social_apps">
<div class="app_social facebook">
<a href="#" target="_blank" title="Follow on facebook">
<i aria-hidden="true" class="fa fa-facebook"></i> 5000 Likes
</a>
</div>
<div class="app_social twitter">
<a href="#" target="_blank" title="Follow on twitter">
<i class="fa fa-twitter"></i> 250 Followers
</a>
</div>
<div class="app_social pinterest">
<a href="#" target="_blank" title="Follow on pinterest">
<i class="fa fa-pinterest"> </i> 50 Followers
</a>
</div>
<div class="app_social instagram">
<a href="#" target="_blank" title="Follow on instagram">
<i class="fa fa-instagram"></i> 2500 Followers
</a>
</div>
<div class="app_social google">
<a href="#" target="_blank" title="Follow on google+">
<i class="fa fa-google-plus"></i> 100 Followers
</a>
</div>
<div class="app_social linkedin">
<a href="#" target="_blank" title="Follow on linkedin">
<i class="fa fa-linkedin"> </i> 500 Followers
</a>
</div>
<div class="app_social youtube">
<a href="#" target="_blank" title="Subscribe on youtube">
<i class="fa fa-youtube"></i> 200 Subscribers
</a>
</div>
<div class="app_social rss">
<a href="#="_blank" title="Subscribe blog feed">
<i class="fa fa-rss"></i> 1000 Subscribers
</a>
</div>
</div>
</div>
.widget_social_apps:after { clear : both; } .widget_social_apps .app_social { margin : 1% 0.5%; width : 49%; height : 45px; float : left; text-align : center;
background-color : #000; transition : all 0.2s; border-radius: 5px; }
.widget_social_apps .app_social.facebook { background-color : #4267b2; }
.widget_social_apps .app_social.twitter { background-color : #1DA1F2; }
.widget_social_apps .app_social.pinterest { background-color : #C92228; }
.widget_social_apps .app_social.instagram { background-color : #af2d9e; }
.widget_social_apps .app_social.google { background-color : #e24d3b; }
.widget_social_apps .app_social.linkedin { background-color : #0d6a96; }
.widget_social_apps .app_social.flickr { background-color : #ea097d; }
.widget_social_apps .app_social.youtube { background-color : #b5170a; }
.widget_social_apps .app_social.rss { background-color : #e07706; }
.widget_social_apps .app_social.tumblr { background-color : #5c6682; }
.widget_social_apps .app_social:hover { background-color : #cacaca; }
.widget_social_apps .app_social a { display : block; color : #ffffff; padding : 15px 5px; text-decoration: none; }
.widget_social_apps .app_social span { display : block; }
.widget_social_apps .app_social span.app_icon i { font-size : 12px; margin-bottom : 10px; }
</style>
<br />
<div class="widget_social_apps">
<div class="app_social facebook">
<a href="#" target="_blank" title="Follow on facebook">
<i aria-hidden="true" class="fa fa-facebook"></i> 5000 Likes
</a>
</div>
<div class="app_social twitter">
<a href="#" target="_blank" title="Follow on twitter">
<i class="fa fa-twitter"></i> 250 Followers
</a>
</div>
<div class="app_social pinterest">
<a href="#" target="_blank" title="Follow on pinterest">
<i class="fa fa-pinterest"> </i> 50 Followers
</a>
</div>
<div class="app_social instagram">
<a href="#" target="_blank" title="Follow on instagram">
<i class="fa fa-instagram"></i> 2500 Followers
</a>
</div>
<div class="app_social google">
<a href="#" target="_blank" title="Follow on google+">
<i class="fa fa-google-plus"></i> 100 Followers
</a>
</div>
<div class="app_social linkedin">
<a href="#" target="_blank" title="Follow on linkedin">
<i class="fa fa-linkedin"> </i> 500 Followers
</a>
</div>
<div class="app_social youtube">
<a href="#" target="_blank" title="Subscribe on youtube">
<i class="fa fa-youtube"></i> 200 Subscribers
</a>
</div>
<div class="app_social rss">
<a href="#="_blank" title="Subscribe blog feed">
<i class="fa fa-rss"></i> 1000 Subscribers
</a>
</div>
</div>
</div>
Step - 2
और फिर इस Code को आप अपने ब्लॉगर के Dashboard में जाकर Layout वाले Section पर क्लिक करके HTML/JavaScript पर Click करना होता है !
Step - 3
उसके बाद आपने जो Code को Copy किया है उस कोड को इस Box में Paste करना होता है और फिर आपके ब्लॉग पर Social Media Follow Gadgets Add हो जाता है और फिर आप View Blog करके देख सकते हैं !
दोस्तों Code में जहाँ पर "#" है वहां पर आपको अपने सोशल मीडिया का URLको Paste करना होता है और Code में जहाँ पर Numbers हैं वहां पर आपको अपने हिसाब से Followers को डालना होता है !
तो दोस्तों इस तरह से आप अपने Blogger ब्लॉग में Social Follow Gadgets को लगा सकते हैं मुझे उम्मीद है की यह पोस्ट Social Follow Gadgets Blogger Me Kaise Lagaye , How to add Social Media Icons on Blogger आपको बहुत पसंद आई होगी !
इस Post को आप अपने दोस्तों के साथ Share जरूर करें यदि इस Post से Related आपका कोई सवाल है तो आप नीचे Comment Box में पूछ सकते हैं मैं आपके सवालों के जवाब जल्द से जल्द देने की कोशिश करूँगा !
और हां दोस्तों अगर आपको ऐसे ही इंटरनेट से जुड़ी जानकारी पाना चाहते हैं तो फिर आप हमे Follow करना ना भूले !
धन्यवाद! दोस्तों
GyanHindiOnline की शुरुवात September 2019 को की थी जिसका संदर्भ है, कि लोगों की इंटरनेट की सहायता हिंदी भाषा के माध्यम से होना चाहिए जो लोग इंटरनेट में दिलचस्पी रखते हैं और वह इंटरनेट के बारे में कुछ पढ़ना चाहते हैं तो वह इस ब्लॉग से सीख सकते हैं !.
ConversionConversion EmoticonEmoticon