Yazı alanına slider ekleme nasıl yapılır?

Yazı alanına slider ekleme nasıl yapılır?

Bu eklentiyi nerede kullanabilirim diye kafanızda bir soru oluştuysa.. Bir kaç örnekle kullanım alanları hakkında ipuçları verebilirim.

Öykü yazıyorsanız aşağıya doğru uzayıp giden sayfalar yerine bu eklentiyi kullanabilirsiniz.
Ya da son izlediğim filmlerim / kitaplarım şeklinde kullanmakta iyi bir seçim olur.


1. Blogger kumanda panelinde Template edit kısmını açıyoruz. Aşağıdaki kodları kopyalayıp ></b:skin> ya da </style> üzerine yapıştırıyoruz.

/* Yazı Alanı Slider Eklentisi */
a.movepg.nexter,a.movepg.prever{color:#fff}
.separator{overflow:hidden;max-height:240px;margin:0 0 20px}.separator img{background:#eee;max-width:100%;vertical-align:middle;background-position:middle;border:0;height:auto;width:100%}.next-wrap img,.next-wrap video,.next-wrap object{max-width:100% }.next-wrap{position:relative;padding:0 0 0 40px;line-height:normal;}.instruction{display:block;height:100%;width:100%;overflow:hidden}.slidecontentWrap{width:1000%}.slidecontent{float:left;width:10%;line-height:161%;overflow:hidden}.movepg{display:none;position:absolute;bottom:20px;background:#e74c3c;color:#fff;font-weight:700;text-transform:uppercase;padding:6px 12px;cursor:pointer;font-size:80%;outline:none;border-radius:3px;transition:background .6s}.movepg:hover{background:#c0392b}.movepg.prever{left:20px}.movepg.nexter{right:20px}



2. Adım olarak yine temamızda </body> kodunu aratarak hemen üzerine aşağıdaki kodları yapıştırıyoruz.

<script type='text/javascript'>
//<![CDATA[
function updateBtnState(){0==index?$(".prever").hide():$(".prever").show(),index==maxIndex?$(".nexter").hide():$(".nexter").show()}var index=0,maxIndex=4;$(".nexter").on("click",function(e){if(index++,index>maxIndex)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),$(".prever").on("click",function(e){if(index--,0>index)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),updateBtnState();
//]]>
</script>

Java kodları içindeki maxIndex=4 değerini değiştirerek slayt sayınızı ayarlayabilirsiniz.

Temamızı Kaydediyoruz ve çıkıyoruz.

3. Son olarak yazımıza entegre edebilmek için, yeni yayın penceresini açarak aşağıdaki kodları kopyalayıp HTML kısmına yapıştırıyoruz.


<div class="next-wrap">
  <div id="photocons" class="instruction">
    <div class="slidecontentWrap">
      <div class="slidecontent">
        <-- İÇERİK 1 -->
      </div>
      <div class="slidecontent">
        <-- İÇERİK 2 -->
      </div>
      <div class="slidecontent">
        <-- İÇERİK 3 -->
      </div>
      <div class="slidecontent">
        <-- İÇERİK 4 -->
      </div>
      <div class="slidecontent">
        <-- İÇERİK 5 -->
      </div>
      </div>
      </div>
      <a class="movepg prever">prev</a>
      <a class="movepg nexter">next</a>
</div>



İçerik yazan kısımlara resim ve yazımızı ekleyerek yazımızı yayınlıyoruz.

BLOG YAZILARINIZI SÜTUNLARA BÖLME ilginizi çekebilir.

Örnek gösterim :


Son izlediğim filmler

Spotlight: Oscar yarışında ön sıralarda ismi geçen film, 29 Ocak 2016’da seyirci karşısına çıkacak. Tom McCarthy’nin yönettiği filmde, geçen yılın Oscar şampiyonu Birdman’in başrol oyuncusu Michael Keaton, Mark Ruffalo, Rachel McAdams, Liev Schreiber, Stanley Tucci, Billy Crudup, John Slattery ve Jamey Sheridan rol alıyor.



İftarlık Gazoz: ‘’Dondurmam Gaymak’’ filminin usta yönetmeni Yüksel Aksu’nun yeni filmi, 29 Ocak 2016’da gösterimde. Yönetmenliğini ve senaristliğini Yüksel Aksu’nun yönettiği filmde, Berat Efe Parlar, Macit Koper, Okan Avcı ve Yılmaz Bayraktar rol alıyor. Cem Yılmaz’ın konuk oyuncu olarak yer aldığı film, 1970’ler Türkiye’sinin küçük bir Ege kasabasında geçiyor.




Senaryosunu Mark L. Smith ile Alejandro Gonzalez Inarritu’nun kaleme aldığı film, Michael Punke’ın ‘’The Revenant: A Novel Of Revenge’’ kitabından beyazperdeye uyarlandı. Film, kürkleri için hayvanlar avlayan bir kuruluş için çalışan Hugh Glass adındaki bir tuzakçının, bir boz ayı tarafından ölümcül bir biçimde yaralandıktan sonra, kendi ekibi tarafından ölüme terk edilmesini ve sonrasında verdiği yaşam mücadelesini konu alıyor.





Western türündeki film, İç Savaş’ın bitmesinin ardından,birbirini tanımayan 8 kişinin, tipiden kurtulmak için dağdaki bir konaklama yerine sığınmasını konu alıyor. Filmin oyuncuları Samuel L. Jackson, Kurt Russell, Jennifer Jason Leigh, Walton Goggins, Michael Madsen, Tim Roth rol alıyor.




prev
next
Previous
Next Post »

3 yorum

Hızlı yorum Comments
Recep Altun;
Geliştirici
16 Mayıs 2016 09:37 ×

Merhabalar.
Bloggerlere faydalı olabilmek için araştırıyorsunuz buluyorsunuz ve okuyucularınızla paylaşmak için de epeyce bir efor ve emek sarfediyorsunuz. Paylaştığınız her konu çok değerlidir ve paylaştığınız her bir konu, birimizin arayıp da erişemediği konular olabilir.
Çalışmalarınızdan ve yararlı paylaşımlarınızdan ötürü size takdir ediyor ve teşekkürlerimi sunuyorum.
Selam ve dualarımla birlikte en Güzel'e emanet olun.

Cevap ver
avatar
ergun214
Geliştirici
20 Mayıs 2016 11:29 × Bu yorum yazar tarafından silindi.
avatar
avon üyelik
Geliştirici
20 Mayıs 2016 11:31 ×

teşekkürler

Cevap ver
avatar
Yorumunuz için teşekkür ederim.

Katkıda Bulunanlar

Geliştirici ol