Blogger sticky widget |
Daha önce konuyla ilgili farklı içerikler paylaşmıştık. Eklentilerin sayfa ile hareket etmesini sağlayan bu kodların bazı bloglarda çalışmadığı fark edince bir yeni alternatifin olması faydalı olur diye düşündük. Bu kodlar sayesinde Blogger bloglarınızda dilediğiniz eklentiyi sticky yapmanız mümkün. Şimdi gelelim kodların nasıl Blogger bloglarına eklendiğine.
Tema ardından HTML düzenle seçenekleri ile ulaştığımız HTML alanında Ctrl F yardımıyla aşağıdaki kodu buluyoruz.
]]></b:skin>Bulduğumuz bu kodun hemen üstüne ise
.sticky{position:fixed!important;top:0;z-index:99;-webkit-transform:translateZ(0);}bu kodları ekliyoruz. Daha sonra yine Ctrl F yardımıyla
</body>koduna ulaşıyoruz. Bulduğumuz bu kodun hemen üstüne ise
<script type='text/javascript'>Bu kodları ekleyerek işlemi sonlandırıyoruz. Temamızı kaydettikten sonra blogumuzu kontrol edebiliriz. Kırmızı renkle belirginleştirdiğimiz alana sticky yapmak istediğiniz eklentinin id sini eklemeyi unutmayın. Konuyla ilgili sorularınızı yorum yaparak bildirebilirsiniz. Ayrıca daha önceden paylaştığımız "Blogger eklentilerini nasıl yapışkan (sticky) yaparız?", "Blogger eklentilerini sayfa ile hareket ettirme" başlıklı içeriklerimizi de inceleyebilirsiniz.
//<![CDATA[
// Sticky Menubar
function makemeSticky(e){function t(){var e=s.getBoundingClientRect();e.top<0?(n.className=a+" sticky",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("widget id bu kısma");
//]]>
</script>
Sadece küçük bir CSS kodu ile de yapılabilir. Yeni CSS3 kodları ile daha kolay ve daha düzenli olacak şekilde ve blog şablonunda fazla js koduna gerek kalmadan.
YanıtlaSilPosition kodundan bahsediyorsunuz sanırım?
SilAdsense reklamlarına uygulasak sıkıntı çıkarır mı?
YanıtlaSilGenelde yapılması pek tavsiye edilmiyor ama ben herhangi bir sorunla karşılaşmadım bugüne kadar.
SilEkşi sözlük yapıyor. Onlar yapıyorsa sorun olmaz.
SilAdsense reklamlara yapınca sıkıntı olmuyor ben daha önce sormuştum yaptım uzun zamandır çalışıyor.
YanıtlaSilÖnceki kodda siteyi yavaşlatan jquery vardı bunda o yok sanırsam. Siteyi yavaşlatıyor uyarısı veriyordu.
Diğer blogda sormuştum birden fazla kodu sabitlemek istersek ne yapmak lazım.
"Merhaba, rica ederim. #widget Id, #widget Id şeklinde aralarına virgül ekleyerek birden fazla eklentiyi sabitleyebilirsiniz."
cevabını vermiştiniz görmemişim onu deneyeceğim.
Bu kodda da geçerli mi?
Teşekkürler.
Maalesef bu kodda geçerli değil.
Siliki tane sticky sabitlemeyi virgülle, başka şekillerde denedim olmadı yalnız nasıl yapabiliriz?
YanıtlaSilSidebardaki reklamı sabitleyince buna gerek kalmadı.
SilTeşekkürler.
Sidebardaki reklamı sabitlemek en iyi çözüm.
Üst sidebara reklam sabitleme işi süper oldu bu yazınızla reklamlar tam istediğim gibi oldu. Her boşluğa reklam doldurmak doğru değil.
YanıtlaSilBu şekilde sitede 1 reklam olsa bile yeterli.
3-4 reklam ile çeşitlilik olur.
Hemde izleyenler reklama boğulmuş olmaz.
Önceki yazılarda orada bir yorumda sidebar falan yazıyordu o sırada sidebardaki reklamı sabitleme fikri geldi aklıma.
Tam istediğim buydu.
Teşekkürler.
Ben teşekkür ederim değerli yorumlarınız için.
SilAklıma bir soru takıldı.
YanıtlaSilŞimdi bu etiket ile sidebardaki adsense gatgetini yapışkan yaptık.
Pencere aşağı doğru indikçe reklam içeriğin üzerine geliyor.
Daha önce reklam içeriği kapatmamalı şeklinde bir yazı okumuştum.
Bu şekilde kullanım adsense açısından sorun olur mu?
Siteden bakıp bilgi verirseniz sevinirim.
Teşekkürler.
Ekranı kapatan pop-up reklamlar için geçerli o uyarı. Ama sizin blogunuzdaki pek sorun yaratmayacaktır. Çünkü ekranın ufak bir kısmını kapatıyor.
SilÇok teşekkürler hocam. Popüler yazılar için kullandım. Bence site içinde gezinti yani sitede kalma oranını artırmaya yönelik iyi bir adım. Reklam için kullanılması bence pek doğru değil. Zaten adblock kullananlar için boş görünecek. Ama popüler yazılarda ilgisini çekecek bir yazıyı okuyarak hiç olmazsa google için seo tadında bir katkısı olur. Teşekkürler...
YanıtlaSilRica ederim. Tabi seçim sizin, dilediğiniz alan için kullanabilirsiniz. Ben ilk zamanlarda son yazılar için kullanıyordum daha sonra blogu reklamlarla boğmamak adına tercih etmiştim.
Sil