Blogger Eklentisi Slayt HTML Kodu | Web ve Teknoloji Haberleri

Blogger Eklentisi Slayt HTML Kodu

Blogger siteniz için hem görünüm hem de daha fazla içeriği takipçilerinize paylaşmanızı sağlayacak Blogger Eklentisi 'ni sizlerle payl...

Blogger siteniz için hem görünüm hem de daha fazla içeriği takipçilerinize paylaşmanızı sağlayacak Blogger Eklentisi 'ni sizlerle paylaşıyorum.

Blogger Eklentisi Slayt HTML Kodu


blogger slayt Eklenti Kodları
Blogger HTML Kodları "SLAYT"

Bir Blogger Eklentisi ile daha sizlerleyim. Bu eklentimiz Blogger Slayt Kodları içeriyor. Yapmanız gerekenleri sırasıyla  yazımda anlattığım gibi uygularsanız sizde bu faydalı Blogger Eklentisinden faydalanabilirsiniz.

Gelelim Blogger Eklentisi Kurulumuna, Bloggerınıza giriş yapıyorsunuz - Yerleşim - HTML/Javascript ekle diyerek aşağıdaki kodları içine kopyalayıp yapıştırıyorsunuz. Herşey bu kadar kolay ama faydası çok olacağına inandığım bir Blogger Eklentisi

İşlemi Yapmadan önce mutlaka [Önizleme ##eye##] işlemini yapmanızı tavsiye ederiz.


<style scoped="" type="text/css">
ul.rcnslider *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
ul.rcnslider{font-size:11px}
ul.rcnslider,ul.rcnslider li{margin:0;padding:0;list-style:none;position:relative}
ul.rcnslider{width:100%;height:500px}
ul.rcnslider li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none}
ul.rcnslider li:nth-child(1),ul.rcnslider li:nth-child(2),ul.rcnslider li:nth-child(3),ul.rcnslider li:nth-child(4){display:block}
ul.rcnslider img{border:0;width:100%;height:auto}
ul.rcnslider li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0}
ul.rcnslider li:nth-child(2){left:0;top:50%}
ul.rcnslider li:nth-child(3){left:50.5%;top:50%}
ul.rcnslider li:nth-child(4){width:100%;left:0;top:75%}
ul.rcnslider .overlayx,ul.rcnslider li{transition:all .4s ease-in-out}
ul.rcnslider .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAFACAYAAAB5k8bJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAhhJREFUeNrslG1LVFEUhe/cGQtLfBlrECECIZEgDAlRCUEoUwQRIXWc/HmmJaIiKqIFCin1YQiFNDWTCKQPEhS9qGO6Vuwlxzs62cfiXnhg77Ofu845M44Rz/MqPXt8z3nCJmzCJmz+/cZ3m1+qfXfR1Xw3IKImAg7ZRFnoxQObRn1T8pQWAxlpGdMuKO0i2GOTD/a16a5N86VdAj/YFICf0r7btCBm8ZfBNxaFNv196q+mFetycfCFRSkLpX02La4rJLjIpgzsUIvaO5yW6Wzl4BOba2CbU2rFpl3XphXgI4sb4IPSikyrlFYF3qnYkKa0mzrbLbDKphq8CWq3pdWAJTa1YJnfhqvdkVYH0mzqwUvPvtxCm96N2UIDWKDWCBZ1U12hUVdoAi9Y3APz0pR2X9oD8JxFC3gWvEKzPt5WMMOmDUxLK7GQNmmcTvHFSTCuK+hs7dq0A0xwZRaMuRqfDn0gnZyymAMj0uKaalNqo1xZAMPSSmz6UGldnLJ4BYaCaV1KozbElTR4EtS6pXWDp1x57WqlZ2rLph1Su2paT5bGP6JBN82TxmmSISxWXE1pSaX1cMqVt2BA2hWbJpXWK23tNK1XadQeU1tn8WeNP5d+92z89/RIm/ZxLxabbpq0lNJSSsvSTt80t3ac9j54tr/QTpytX9rxpokzz3ZObSvn2XKnZZ9t63xXCLVQC7VQ+0+0IwEGAOg12Bw8IUYdAAAAAElFTkSuQmCC);background-position:50% 50%;background-repeat:repeat-x}
ul.rcnslider .overlayx,ul.rcnslider img{margin:3px}
ul.rcnslider li:nth-child(1).overlayx{background-position:50% 25%}
ul.rcnslider .overlayx:hover{opacity:.1}
ul.rcnslider h4{position:absolute;bottom:10px;left:10px;right:10px;z-index:2;color:#fff;font-weight:700;margin:0;padding:10px;line-height:1.5em;font-weight:normal;overflow:hidden;transition:all .3s}
ul.rcnslider li:hover h4{bottom:30px}
ul.rcnslider li:nth-child(1)h4,ul.rcnslider li:nth-child(4)h4{font-size:150%}
ul.rcnslider .label_text{position:absolute;bottom:0;left:20px;z-index:2;color:#fff;font-size:90%;opacity:0;transition:all .3s}
ul.rcnslider li:hover .label_text{bottom:20px;opacity:1}
ul.rcnslider li:nth-child(2).autname,ul.rcnslider li:nth-child(3).autname{display:none}
.rcnslider-btn{margin:5px 0 0}
.rcnslider-btn a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}
.rcnslider-btn a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #444 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}
.rcnslider-btn a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}
</style>

<br />
<div id="rcnsliderpost">
</div>
<script type="text/javascript">
function rcnsliderpost(a){(function(e){var h={blogURL:"",MaxPost:8,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"data:image/gif;base64,R0lGODlhAQABAIAAAPHx8AAAACH5BAEAAAAALAAAAAABAAEAQAICRAEAOw==",MonthNames:["Ocak","Şubat","Mart","Nisan","Mayıs","Haziran","Temmuz","Ağustos","Eylül","Ekim","Kasım","Aralık"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="slidercn">
<ul class="rcnslider"></ul>
</div>
<div class="rcnslider-btn">
<a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></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.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$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.MonthNames[parseInt(p,10)-1];l+='
<li><a target="_blank" href="'+q+'"><div class="overlayx">
</div>
<img class="random" src="'+u+'"/><h4>
'+k+'</h4>
</a><div class="label_text">
<span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div>
</li>
"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .slidercn li:first").before(e(h.idcontaint+" .slidercn li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .slidercn li:last").after(e(h.idcontaint+" .slidercn li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .slidercn li:first").before(e(h.idcontaint+" .slidercn li:last"));e(h.idcontaint+" .slidercn").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};
//<![CDATA[
rcnsliderpost({
  blogURL: "http://webinsokagi.blogspot.com",
  MaxPost: 8,
  idcontaint: "#rcnsliderpost",
  ImageSize: 300,
  interval: 5000,
  autoplay: true,
  tagName: false
});
//]]>
</script>


HTML Slayt Kodlarımızın bazı noktalarını kendinize göre ayarlamanız gerekmekte. HTML kodlarının arasında kırmızı ile işaretlenmiş alanlar kendinize göre ayarlamanız gereken bölümler.

Kodlar ve İşlevleri

blogURL : kendi blog adresinizi yazmalısınız. ( yayınlayacağınız blog adresi ile aynı olması gerekir.

MaxPost : yayınlanacak en fazla yayın sayısını ifade eder.

interval : bu alan slayt alanının dönüş hızını belirlemeye yarıyor. "5000" olarak belirlediğimiz rakamı yükseltip ve ya düşürerek hızını istediğiniz gibi ayarlayabilirsiniz

autoplay : otomatik kaydırma çubuğunun hareketini sağlar "true"

tagName : bu kod sayesinde eklentimizi istediğimiz etiketi seçerek bir çok farklı kategorideki yazılarınızı gösterebilirsiniz. Bu özelliği aktif etmek için "Blogger Tema" gibi etiketinizi false yazan yerle değiştiriyoruz.

Blogger Slayt Eklentisi yazımızın sonuna gelmiş bulunmaktayız umarım vermiş olduğumuz bilgiler işinize yarar. Yapamadığınız ya da takıldığınız bir şey olursa yorum bölümünden bize ulaşabilirsiniz.






YORUMLAR

www.haberinbasi.com
İsim

2018 Ping Siteleri,2,Anahtar Kelime Seçimi,1,ANDROID,1,Android Uygulama,1,Bedava Tema,1,beyaz ekran sorunu,1,Blogger,3,Blogger Destek,2,Blogger Düzeltmeleri,2,Blogger Eklentisi,1,blogger faydalı bilgiler,1,Blogger Geliştirmeler,2,Blogger Hataları,1,Blogger Hesabı Nasıl Açılır,1,Blogger oluşturma,1,Blogger Seo,1,Blogger Seo Ayarları,1,Blogger Tema,1,Blogger tema yükleme,1,Blogger Themes,1,Blogger Widget,1,com.tr uzantısı,1,config.php hatası,1,Deneme Yazısı,1,En iyi eklentiler,1,Free Blogger Template,1,google seo ayarları,1,google yükselme,1,gösterim başına para,1,Güncel Ping Siteleri,2,Hata ve Düzeltme,1,headers already sent by,1,HTML Kodları,1,İnternet,1,internetten para kazanma,1,Kişisel Blog,1,LG V30 batarya gücü,1,LG V30 detayları,1,LG V30 incelemesi,1,LG V30 kamera özellikleri,1,LG V30 özellikleri,1,LG V30 teknik özellikleri,1,limit hatası,1,Magazin Teması,1,memory hatası,1,Mobil,1,Mobil Teknik Özellikleri,2,otomatik paylaşım,1,para kazanma yolları,1,PHP 7,1,PHP Hakkında Herşey,1,PHP Öğreniyorum,1,Ping nasıl yapılır,2,Ping Siteleri,1,Pingleme Nasil Yapilir,1,Pingleme Nedir,2,Rehber Uygulama,1,reklam veren siteler,1,Reklam yayınlama,1,Samsung,1,Samsung Galaxy S9,1,Samsung Galaxy S9 Teknik Özellikleri,1,Samsung S9,1,Seo Ayarları Nasıl Yapılır,1,Seo çalışması,1,Seo Nasıl Yapılır,1,Seo Nedir,1,Seo Uyumlu Makale,1,Site dışı Seo,1,Site içi Seo,1,Site Pingleme Nedir,1,Slayt Eklenti Kodları,1,Slayt Widgeti,1,Sosyal medya,1,Tavsiyemiz,1,tıklama reklamlar,1,Türkiye Gezi Rehberi,1,Ücretsiz Blogger Teması,1,Ücretsiz Wordpress 2017,1,Warning: Cannot modify header information,1,Web Teknolojileri,1,WORDPRESS,4,Wordpress Eklentileri,2,wordpress güncelleme hatası,1,wordpress hakkında,1,Wordpress Hata Çözümleri,1,Wordpress Hata düzeltme,1,Wordpress ping siteleri,2,Wordpress seo,2,wp-config.php:34,1,ziyaretçi artışı,1,
ltr
item
Web ve Teknoloji Haberleri: Blogger Eklentisi Slayt HTML Kodu
Blogger Eklentisi Slayt HTML Kodu
https://2.bp.blogspot.com/-s8JxUr8wjj4/W3Q3YUT25kI/AAAAAAAAFvM/AAkOmvw-GtcwwjouKdDXPPm_8l-jNAQMQCLcBGAs/s320/blogger-eklentisi-slayt-kodlari_640x426-min.jpg
https://2.bp.blogspot.com/-s8JxUr8wjj4/W3Q3YUT25kI/AAAAAAAAFvM/AAkOmvw-GtcwwjouKdDXPPm_8l-jNAQMQCLcBGAs/s72-c/blogger-eklentisi-slayt-kodlari_640x426-min.jpg
Web ve Teknoloji Haberleri
http://webinsokagi.blogspot.com/2018/08/blogger-eklentisi-slayt-html-kodu.html
http://webinsokagi.blogspot.com/
http://webinsokagi.blogspot.com/
http://webinsokagi.blogspot.com/2018/08/blogger-eklentisi-slayt-html-kodu.html
true
388630085700064430
UTF-8
Tüm Yazılar Yüklendi Her hangi bir mesaj bulunamadı TÜMÜNÜ GÖR Daha Fazlası Cevap Cevabı iptal et Sil Tarafından Anasayfa SAYFALAR YAZILAR TÜMÜNÜ SEÇ SİZİN İÇİN ÖNERİLEN ETİKET ARŞİV ARAMA TÜM YAZILAR İsteğinizle eşleşme bulunamadı Başa Dön Pazar Pazartesi Salı Çarşamba Perşembe Cuma Cumartesi Paz Pts Sal Çrş Prş Cum Cts Ocak Şubat Mart Nisan Mayıs Haziran Temmuz Ağustos Eylül Ekim Kasım Aralık Ock Şub Mar Nis Mayıs Haz Tem Ağs Eyl Ekm Kas Arl şuan da 1 dakika önce $$1$$ dakika önce 1 saat önce $$1$$ saat önce Dün $$1$$ gün önce $$1$$ hafta önce 5 haftadan önce İzleyiciler Takip et Bu içerik Özeldir Kilidi Açmak için Paylaş Tüm Kodu Kopyala Tüm Kodu Seç Tüm kodlar panonuza kopyalanmıştır. Kodları / metinleri kopyalayamıyor, kopyalamak için lütfen [CTRL] + [C] tuşlarına (veya Mac ile CMD + C'ye) basınız