blogger me automatic posts slider widget kaise add kare

मित्रो आज हम आप लोगो को ब्लागर ब्लाग में स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट को लगाने बारे में विस्तार से जानकारी उपलब्ध करायेगें। मित्रो ब्लागर ब्लाग के टेम्पलेट को स्टाइलिश लुक देने के लिए ब्लागर ब्लाग ने ब्लाग टेम्पलेट को एडिट करने का आफ्शन दे रख्खा है। जबकि ब्लागर ब्लाग में उपलब्ध टेम्पलेट में ब्लाग को स्टाइलिश लुक देने के लिए नही है। ऐसे में हमारे पास दूसरा विकल्प यह है कि हम अपने ब्लाग या वेबसाइट के लिए किसी थर्ड पाटी टेम्पलेट कम्पनी से कोई स्टाईलिश टेम्पलेट खरीद ले। या यदि हमें थोडा बहुत ब्लागिंग के एडिटिंग के बारे में जानकारी है। तो हम ऐसे में अपने ब्लाग को एक आकर्षक सटाइलिश लुक प्रदान कर सकते है। मित्रो दरअसल जब हमारे ब्लाग का टेम्पलेट आकर्षक होता है तो ऐसे में हमारे ब्लाग पर विजिटर प्रभावित होतें है और हमारे ब्लाग के ट्रैफिक में भी बृद्धि होता है। परन्तु जब हमारे ब्लाग का टेम्पलेट साधारण होता है तो ऐसे में हमारे ब्लाग पर विजिटर का प्रभाव नही पड पाता । जिससे एक तो विजिटर की कमी होता है और दूसरा सबसे बडी बात कि इससे ट्रैफिक भी नही बढ पाता है। इस लिए हमें ब्लाग बनाते समय यह विशेष ध्यान देना चाहिए कि हम अपने ब्लाग के लिए कोई अच्छा सा एक टेम्पलेट खरीद कर लगा ले या फिर थोडा बहुत ब्लाग एडिंटिंग का ज्ञान हासिल कर अपने ब्लाग को एक नया आकर्षक लुक प्रदान कर दे।

ब्लाग में स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट लगाने के फायदा और नुकसान -

मित्रो आप जब ब्लागिंग शुरू करते है तो आप अपने ब्लाग में अनगिनत आर्टिकल को पोस्ट करते है। और ब्लाग को स्टाइलिश लुक देने के लिए जब हम अपने ब्लाग पर स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट लगाते है,तो ऐसे में स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट ब्लाग में मौजूदा आर्टिकल को आटोमेटिक सर्च कर प्रदर्शित करता रहता है। और इससे हमारे ब्लाग पर आटोमेटिक चलता फिरता स्लाइडर पोस्ट प्रदर्शित होता रहता है। जो देखने में काफी आकर्षक होता है जिससे विजिटर काफी प्रभावित होते है।  इससे हमारे ब्लाग के मौजूदा पोस्ट पर यदि कोई विजिटर आता है। और उसे स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट में कोई आर्टिकल पसन्द है। तो ऐसे में वह उस आर्टिकल को क्लिक करके पढता है जिससे ब्लाग की ट्रैफिक में बृद्धि होता है। 

ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट कैसे ऐड करे

मित्रो ब्लागर ब्लाग में स्वचालित रुप से प्रदर्शित पोस्ट स्लाइडर विजेट लगाना बहुत ही आसान प्रक्रिया है। परन्तु इसके लिए आपको दिये गये स्टेप का पालन करना होगा जिससे आपको ब्लागर ब्लाग में आटोमेटिक पोस्ट्स स्लाइडर विजेट कैसे ऐड करना आसान हो सके। 

स्टेप संख्या -01

यदि आप ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट के कोड को वायरस मुक्त कापी करना चाहते है। तो आप इसके लिए डाउनलोड बाटम पर क्लिक कर ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट के कोड को को डाउनलोड कर सकते है । 

• [[Automatic Posts Slider Widget CODE-DOWNLOAD HERE ]]

स्टेप-संख्या-02

• सबसे पहले आप ब्लागर डेशबोर्ड में लागिंन करे। 
• अब आप Theme पर क्लिक करे। 
• अब आप Customize पर क्लिक करे। 
• अब आप EDIT HTML  पर क्लिक करे इसके बाद एक नया पप अप विंडो ओपन होगा ।

स्टेप-संख्या-03

सबसे पहले आप नीचे दिये गये blogger me automatic posts slider widget kaise add kare के कोड को ]]></b:skin>  में लगाने के लिए कापी पेस्ट कर ले । 

.featslider { position: relative; } ul.featured-widget-list,ul.featured-widget-list li{margin:0;padding:0;list-style:none;position:relative }ul.featured-widget-list li{display:none}ul.featured-widget-list li:nth-child(1){display:block;line-height:0}ul.featured-widget-list img{border:0;width:100%;height: 400px; object-fit: cover;}ul.featured-widget-list .featuredbg{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5PZFhSzFrERqmSIhuwBqhq4VFu256-XzIfRSx9a1g81SDVMfyeRhDnFsDy-gFqyCUZCDnnwfiHHi6EkjaULyuvw9Ngl5_H0auHNLOZ57r8x9mn5EekB3FoP_9Q6FuIBmVq7Kpf7x6WRo/s400/overlay-bg.png);background-position:0% 100%;background-repeat:repeat-x}ul.featured-widget-list .featuredbg:hover{opacity:.1}ul.featured-widget-list h5{position:absolute;left:0;right:0;text-align:center;bottom:10px;z-index:2;color:#fff;margin:0;text-transform: capitalize;padding:10px 20px;line-height:1.9em;letter-spacing:0.3px;font: 600 16px 'Abel', sans-serif;overflow:hidden}ul.featured-widget-list li:hover h5{bottom:30px}ul.featured-widget-list .featured-meta{font: 11px 'Abel', sans-serif;letter-spacing:0.3px;position:absolute;bottom:0;left:0;right:0;text-align:center;z-index:2;color:#fff;opacity:0}ul.featured-widget-list h5, ul.featured-widget-list .featured-meta {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}ul.featured-widget-list li:hover .featured-meta{bottom:20px;opacity:1}.feat-buttons{position:absolute;top:50%;z-index:5;width:100%} .feat-buttons a{text-indent:-9999px;margin:0 7px;width:15px;height:15px;padding:15px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter: alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6;position:relative;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}.feat-prev{float:left;}.feat-next{float:right;}.feat-buttons a.feat-prev::before, .feat-buttons a.feat-next::before{content:"";width:0;height:0;border-width:6px 7px;border-style:solid;border-color:transparent #fff transparent transparent;position:absolute;top:50%;margin-top:-6px;margin-left:-11px;left:50%} .feat-buttons a.feat-next::before{border-color:transparent transparent transparent #fff;margin-left:-3px} 

• अब Search Box में (CTRL + F)  दबाकर आप ]]></b:skin> को सर्च करें ।
• अंत में मार्कअप की लाइन का अनुसरण करें और इसे  ]]></b:skin>  के ठीक ऊपर पेस्ट करें ।

• उसके बाद अब आप अंत में Save Theme पर क्लिक करें जिससे Theme Coding Save हो जाये ।  

स्टेप-संख्या-04

सबसे पहले आप नीचे दिये गये blogger me automatic posts slider widget kaise add kare के कोड को </head>   में लगाने के लिए कापी पेस्ट कर ले । 

<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> 

• अब Search Box में (CTRL + F)  दबाकर आप  </head>    को सर्च करें ।
• अंत में मार्कअप की लाइन का अनुसरण करें और इसे  </head>    के ठीक ऊपर पेस्ट करें ।

उसके बाद अब आप अंत में Save Theme पर क्लिक करें जिससे Theme Coding Save हो जाये ।  

स्टेप-संख्या-05

• इसके बाद अब आप ब्लाग के layout पर क्लिक करे।
• इसके बाद अब आप add a gadget  पर क्लिक करे। 

स्टेप-संख्या-06

• इसके बाद अब आप HTML/JavaScript पर क्लिक करे। 

स्टेप-संख्या-07

नीचे दिए गए blogger me automatic posts slider widget के कोड को कॉपी करे ।

<div id="featuredbwidget"></div> <script type='text/javascript'> //<![CDATA[ featuredbwidget({ listURL:"https://ht5445yrthfhhghn54553t.blogspot.com/", featuredNum:5, listbyLabel:false, interval:5000, autoplay:true, featuredID:"#featuredbwidget" }); function featuredbwidget(a){(function(e){var h={listURL:"",featuredNum:3,featuredID:"",feathumbSize:1200,interval:5000,autoplay:false,loadingFeatured:"nextfeatured",pBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeNpFFN_1sti9KH-1mVcRCYjsgvc67AwlBcb7VtPXLYqrry5bz-ZAL6XYMg6Xy9lxtavTwVBKXQjP37XRyzybOoo2r9JlG3LJbKd4hXC4trMCZtZMATNJ1dsSBLXbppQLMT70vd_sHekc/s500/no-image.png",byMonth:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Okt","Nov","Dec"],listbyLabel:false};h=e.extend({},h,a);var g=e(h.featuredID);var d=h.featuredNum*200;g.html('<div class="featslider"><ul class="featured-widget-list"></ul><div class="feat-buttons"><a href="#" class="feat-prev">Пред</a><a href="#" class="feat-next">След</a></div></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.feathumbSize+"")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.feathumbSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.byMonth[parseInt(p,10)-1];l+='<li><a href="'+q+'"><div class="featuredbg"></div><img class="featuredthumb" src="'+u+'"/><h5>'+k+'</h5></a><div class="featured-meta"><span class="fdate"><span class="fday">'+t+'</span> <span class="fmonth">'+v+'</span> <span class="fyear">'+x+'</span></span> - <span class="fauthor">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingFeatured)};var c=function(){e(h.featuredID+" .feat-next").click()};var b=function(){e.get((h.listURL===""?window.location.protocol+"//"+window.location.host:h.listURL)+"/feeds/posts/summary"+(h.listbyLabel===false?"":"/-/"+h.listbyLabel)+"?max-results="+h.featuredNum+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.featuredID+" .feat-prev").click(function(){e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));return false});e(h.featuredID+" .feat-next").click(function(){e(h.featuredID+" .featslider li:last").after(e(h.featuredID+" .featslider li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));e(h.featuredID+" .featslider").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingFeatured)},d)};e(document).ready(b)})(jQuery)}; //]]> </script> 

• Title को खाली छोड़ दे ।
• Content के खाली बाक्स में HTML/JavaScript कोड को कापी पेस्ट कर दे ।
• जब आपका सब कुछ कम्पलीट हो जाए तो आपको अंत में Save Arrangement सेव SAVE बाटन पर क्लिक करके सुरक्षित सेव SAVE कर ले ।

नोट - निम्न बदलाव करे ।

01-और अपने ब्लॉग से URL को  https://ht5445yrthfhghn54553t.blogspot.com/ को बदलना न भूलें।

02- स्पीड को कम या अधिक करने के लिए आप निम्न कोड में  interval:5000,  बदलाव कर सकते है ।

नोट - मित्रो अब आप देखेगें की आपका ब्लाग या वेबसाइट में Automatic posts slider widget आसानी के साथ सुरक्षित एड हो चुका है। आप अपने सुविधा के अनुसार ब्लाग या वेबसाइट में Automatic posts slider widget  को जहां चाहे वहा पर कोड बाक्स के लेआउट को सेट कर सकते है। 

मित्रो अब मुझे उम्मीद है कि आप लोगो ने ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट कैसे ऐड करे ?  यानि की  ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट कैसे ऐड करे ?  को  अच्छे से एड कर लिया होगा। परन्तु इसे आप एक बार अपने पेज को क्लिक कर ओपेन करने के उपरान्त अवश्य चेक कर ले की आपके  ब्लाग में पोस्ट विजेट ठीक प्रकार से कार्य कर रहा है या नही। हां यदि आप लोगो को इस आर्टिकल से रिलेटेड किसी भी प्रकार की कोई समस्या उत्पन्न होता है। तो इसके लिए आप लोग हमे ईमेल के माध्यम से या ब्लाग पर कमेन्ट कर अपने समस्या को साझा कर सकते है। जिससे आपके समस्या का निदान किया जा सके। यदि आप ब्लॉगर में आटोमेटिक पोस्ट्स स्लाइडर विजेट कैसे ऐड करे करने  के लिए दिए गये तकनीकों को सीखते हैं, तो कृपया नीचे टिप्पणी करें, या दूसरों की मदद करने के लिए इस लेख को साझा करें।