Blogger Sayfa İle Kayan Sticky Widget Yapımı

Blogger Sayfa İle Kayan Sticky Widget Yapımı
Bu haber 02 Şubat 2017 - 6:33 'de eklendi ve 48 kez görüntülendi.

Blogger Sticky Widget Nasıl Yapılır ?

Blogger eklentilerinde  çok sayıda kullanabileceğimiz özellik  yok. Ama  yabancı  geliştiriciler bu konuda boş durmuyor. WordPress de  kullanılan sayfa ile kayan araç çubukları  blogger sitelere de uyarlanabiliyor. Buna  sticky widget yani yapışan  widget deniyor.

Bu widget ‘ ın uygulanması da  çok basit.  Eğer  blogger da  şablon ile alakalı az çok bilginiz var ise  kolaylıkla düzenleyebiliyorsunuz.

Blogger Sticky Widget Kullanımı:

1. İlk Önce blogger panelimize  giriş yapıyoruz.  Yerleşim  kısmından sayfa ile kayan widget yapmak istediğimiz sütuna   Gadget Ekle  kısmına  tıklayarak bir HTML JavaScript  gadget ekliyoruz.  Daha sonra oluşturduğumuz  gadget ‘ da  Düzenle  kısmına  tıklıyoruz. Yeni bir pencere  olarak açılacak. Açılan pencerenin adres satırının sonunda [kirmizitext] #HTML1 [/kirmizitext]  şeklinde  bir yazı yazar. Tabi sizinkinde  HTML 2  veya başka olabilir onu bir kenara yazıyoruz.

2.  Şablon > HTML düzenle > Şablonu Biçimlendir  şeklinde  girip aşağıdaki kodu  </body>  kodunun hemen üstüne  yapıştırıyoruz.  Ve  şablonu Kaydediyoruz.

[code lang=”js”]<script type=’text/javascript’>
//<![CDATA[
// Sticky Widget
function makemeSticky(e){function t(){var e=s.getBoundingClientRect();e.top<0?(n.className=a+" makesticking",n.style.width=i+"px"):n.className=a}var n=document.getElementById(e),s=document.createElement("div");n.parentNode.insertBefore(s,n);var i=n.offsetWidth,a=n.className+" makesticky";window.addEventListener("scroll",t,!1)}makemeSticky("HTML1");
//]]>
</script>[/code]

Üsteki kodun sınunda yazan HTML1 kodunu kendi oluşturduğumuz widgetinkiyle değiştiriyoruz.
3.  Daha sonra  aşağıdaki kodu  ]]></b:skin>  buluyoruz  ve hemen üstüne ekliyoruz  ve şablonu kaydediyoruz.

[code]/* Davetsiz Hayat www.davetsizhayat.com */.makesticking{background:none!important;position:fixed!important;top:25px;z-index:99;-webkit-transform:translateZ(0);}
#HTML1 .widget-content {padding:0;margin:auto;} [/code]

Şu anda  widgetimizin  çalışması  gerekiyor.  Eğer yapamadığınız  bir şey varsa yorumlardan yardımcı olabilirim.

Blogger  Sticky  Widget Eklentisi  hakkında  aşağıdaki örnek siteye bakarak inceleyebilir siniz..

 

[kirmizibuton]Demo [/kirmizibuton]

HABER HAKKINDA GÖRÜŞ BELİRT

YASAL UYARI! Suç teşkil edecek, yasadışı, tehditkar, rahatsız edici, hakaret ve küfür içeren, aşağılayıcı, küçük düşürücü, kaba, pornografik, ahlaka aykırı, kişilik haklarına zarar verici ya da benzeri niteliklerde içeriklerden doğan her türlü mali, hukuki, cezai, idari sorumluluk içeriği gönderen kişiye aittir.
POPÜLER FOTO GALERİLER
SON DAKİKA HABERLERİ
İLGİLİ HABERLER