Cumartesi

Blogger Bayram Şekeri Teması

Kategori 63 yorum

Arkadaşlar, herkesin merakla beklediği temayı paylaşıyorum :) 2011'in Ramazan Bayramının 1.Günü paylaştığımdan temanın adını Bayram Şekeri Teması koydum. Ek olarak: Bayramın 1.Günü 30 Ağustos Zafer Bayramı'na da denk geliyordu :) Daha sonra temayı, yavaş olması yönünde gelen yorumlardan dolayı internetten kaldırdım. Şimdi ise temada resimlerin çoğunu atarak yerine css borderları koydum. Şimdi gelelim temanın özelliklerine;

Bayram Şekeri Teması



Blogger Bayram Şekeri Teması
Rar şifresi:www.furkanozden.net
Blogger Bayram Şekeri Teması Önizleme
bayramsekeri-demo.blogspot.com

Özellikler

  • 3 Sütun
  • Alt ve üst kısımda 4lü gadget grubu
  • Bulunduğu sayfaya göre görünür/görünmez gadgetlar
  • İçerik hırsızlarına karşı metin seçme engeli
  • Twitter için son twit'i gösterme alanı
  • Resimleri görüntülemek için lightbox eklentisi
  • Kod görüntülemelerinde syntax highlighter eklentisi

Navigasyon

Tema Düzenleme


Seo Ayarları


Temanın seo ayarlarını yapmak için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra <head> kodunun altındaki içerikleri kendinize göre düzenleyin.

Favicon


Seo ayarlarının hemen altında olan kodu düzenlemek için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra;

<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLZrrB0oxkPv9sgmPE7Jz_ijVU06ad1tcGJ1Uf-gzMXJCpS59sXvNbzFeeFkLVMLL3nx0NUKCGSDZCDNOZt-iQK5GBLeDdCxclRbDkVZxhR5r6P7hNRMP0EU-0Bp45jBYYdlQ6H7FohWDc/s1600/parasol_48%255B1%255D.png' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

kodundaki resim linkini kendinize göre düzenleyin.

Logo


Tasarım » Sayfa Öğeleri kısmına geldiğinizde en sol üst köşedeki gadget'taki resim yolunu değiştirin ve resme kendi anasayfanızın linkini verin.

Reklam


Tasarım » Sayfa Öğeleri kısmından logonun hemen sağındaki gadgetı tıklayarak 468*60 boyutlarında bir reklam görseli ekleyebilirsiniz.

Menü1


Menü1 dediğim şey, temanın en sağ üst kısmında bulunan menüdür. Bunun için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra aşağıdaki kodları bulun ve kendinize göre düzenleyin.

<div id='pages'>
<ul>
<li class='page_item'><a href='/' title='Ana Sayfa'>Ana Sayfa</a></li>
<li class='page_item'><a href='http://furkanozden.blogspot.com/p/contact.html' title='%u0130leti%u015Fim'>Ileti%u015Fim</a></li>
<li class='page_item'><span style='color: #ffffff;'>|</span></li>
<li class='page_item'><a href='http://furkanozden.blogspot.com/' title='Türkçe diline çevir'>TR</a></li>
<li class='page_item'><a href='http://goo.gl/RTRD8' title='Translate to English'>EN</a></li>
</ul>
</div>

Arama kutusu


Arama kutusunu düzenlemek için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra <div id='searchbox'> kodunu bulun ve kendinize göre düzenleyin, furkanozden.blogspot.com'u da kendi adresinizle değiştirin.

Twitter son twit gösterme alanı


Tasarım » Sayfa Öğeleri kısmından bulunduğu gadget'ı tıklayın. Daha sonra frknzdn kelimesini aratın ve kendi twitter kullanıcı adınızla değiştirin.

Menü2


Bu bahsettiğim menü ise, twitter durum güncellemesi gadget'ının hemen sağındaki gadgettır. Bu alanı düzenlemek için Tasarım » Sayfa Öğeleri sayfasına girip twitter durum güncellemesi gadget'ının hemen sağındaki gadgetı tıklayın ve menü ve linkleri kendinize göre düzenleyin.

Metin Seçme Engeli


Metin seçme engeli kodu E-Bülten gadget'ı içinde bulunmaktadır. Bu kodu silmek isterseniz. Tasarım » Sayfa Öğeleri kısmından E-Bülten gadget'ına girin ve </center> kodunu bulun ve altındaki kodu silin.

Standart yazı görseli


Yazınızın başında bir resim olmadığı zaman çıkan standart görseli değiştirmek için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Qhilt8gw2WF-Aaab94uYj9buPEKPSuebjfWPOifsG_FDcOIq2M6r-QtbsFDCbHKZAXcU6b4SCYx8Kg-jy2Dx9f3vbRDxDFTTqPH0EjRlS7zg5_-4dmedM7-ZJp1_-852WXODVtY4gKcz/s1600/%25C3%25B6nizleme.png linkini bulun ve kendi resminizle değiştirin. Resmin boyutları 150*150'dir.

Yazdığım Tüm Yazılar


Her yazının üst kısmında bulunan yazar adınıza tıkladığınızda istediğiniz bir etikete gitmesini sağlayabilirsiniz. Bunun için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra Yazdığım tüm kişisel yazılar için tıklayın kelimesini aratın ve oradaki linki ve yazıyı kendinize göre değiştirin.

Diğer Gadgetlar


Diğer gadgetlar için de şunu söylemeliyim. Kendi blogumdaki aynı gadgetlerı temaya koydum. İsterseniz hepsini değiştirebilirsiniz. Kendinize göre düzenlemek isterseniz aşağıdaki yönergeleri takip edin.

Kayan Sosyal Paylaş Butonları


Bahsettiğim alanı düzenlemek için Tasarım » HTML'yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra sidenav kelimesini aratın ve en sonda bulduğunuz kısmı kendinize göre düzenleyin. Facebook, Google+1, Tweet ve Addthis butonu.

E-Bülten


Tasarım » Sayfa Öğeleri sayfasından E-Bülten başlıklı gadget'a girip tüm furkanozden kelimelerini kendi feedburner id'nize göre düzenleyin.

Beğen & Takip Et


Tasarım » Sayfa Öğeleri kısmında Beğen & Takip Et adlı gadget'a gelip twitter için frknzdn, Facebook için FurkanOzdenTR kelimelerini kendinize göre değiştirin. Google +1 butonu içinse kendi kodunuzla benimkini yer değiştirin.

İstatistikler


Blogun istatistiklerinin gösterildiği gadget'ta ise Tasarım » Sayfa Öğeleri kısmına gidip İstatistikler adlı gadget'a girin. Daha sonra furkanozden.blogspot.com adresini kendinize göre düzenleyin.

Footer


En alttaki ince gadgetta ise birkaç toplist gadget'ı ve yüksekliği 18'i geçmeyen bazı butonlar kullandım. Dilerseniz bunları kaldırabilirsiniz yada kendinize göre düzenleyebilirsiniz.

Yukarı Çık Butonu


Bundan önceki anlattığım Footer gadgetı için yönergeleritakip edin ve furkanozden.blogspot.com kelimesini bulun ve en sondakini kendi adresinizle değiştirin.

Tema Dosyaları


Temada bulunan .css ve .js dosyalarını kendi hostunuza atmanızda fayda var. Çünkü silme ve değiştirme yetkileri benim elimde olan birşey olduğu için sıkıntı çıkmasın.

Yayımcılık


Lightbox


Resimlerin lightbox olarak görünmesini istiyorsanız. Hiçbirşey yapmadan sadece resim yükleyin. Eğer resmin altında açıklama çıkmasını istiyorsanız. Resmin linkine title tagı verin. Eğer grup resim paylaşmak isterseni resme rel="lightbox[albümadi]" tagını ekleyin. Resmi lightbox olarak görüntülemek için ayrıca bir rel="lightbox" eklemenize gerek yok. Bunu temaya entegre ettim.

Syntax Highlighter


Bu eklenti hem kodlarınıza şık bir görünüm verir. Hem de ziyaretçileriniz, sitede metin seçme engeli olduğu halde kodları seçip alabilirler. Yayımlarınızda kod paylaşırken kodu aşağıdaki gibi yazmalısınız.

<pre class="brush: js">Buraya birkaç kod ekleyebilirsiniz.</pre>

Resimler


Genişliği 544px'i geçen resimleri iki yana yaslı ve tam ortalamak için resmi yüklerken sola dayalı yükleyin ve genişliği 544 yapın yüksekliğini boş bırakın. 544'e göre orantılı olarak ayarlanacaktır. Bunu yaptıktan sonra resmin soluk görünmemsi için resim yolundaki s200,s320 veya s400 kısmını s1600 olarak değiştirin. Bu resmin orjinal boyutudur.

Sayfalar


Bir sayfaya girdiğinizde sağ ve soldaki sidebarlar kaybolmaktadır. Bunu yapmak için sayfa yayınlarken, sayfa içeriğinin üst kısmına şu kodları eklemelesiniz.

<style type="text/css">
#Poll1{display:none;}
#entry-meta {
display:none;
}
#sidebarleft-wrapper {
display:none;
}
.post img {max-width:974px;
}
.zaa{width:974px;height:14px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1gz2xWogvqaktwrFpozUc1PqEVmagmPSK7HG45OcDVvxmSWtzLccwNBVl4u0FarWzISsgZzqpTsw5dHq-aFDFSj7EGtYYYN_RM2_hXMmRayMVZUTYsZSBDsFFzUJ4iL9vwzrdEzhH2BY/s1600/seperator.png) no-repeat;}
#sidebar-wrapper {
display:none;
}
#main-wrapper {
width: 974px;
}
#main2-wrapper {
width: 974px;
}</style>

Eğer sidebarların görünmesini istiyorsanız aşağıdaki kodu kullanabilirsiniz.

<style type="text/css">#entry-meta {display:none;}</style>

Bu kodlar sadece bulunduğu sayfadaki css kodlarına yeni bir düzenleme getirir.

Örnek resimler





63 yorum:

  1. Vatana Millete Hayırlı olsun :)==

    YanıtlaSil
  2. sen var ya furkan cennetliksin ya süper oldu bu eline saglık

    YanıtlaSil
  3. Müjdata kesinlikle katılıyorum :)

    YanıtlaSil
  4. � çogu kodlarda bu hata var olsun düzeltirim tekrar çok tşk ederim furkan

    YanıtlaSil
  5. Hata olabilir. O yüzden paketin içine temayı .txt olarak da yükledim. Hepsini seçip HTML'yi Düzenle kısmına yapıştırmayı deneyin.

    YanıtlaSil
  6. olsun furkan sorun deil sen o kadar emek harcamıssın ben bi bunumu düzeltemicem ..

    YanıtlaSil
  7. Anlayışın için teşekkür ederim :)

    YanıtlaSil
  8. ASIL BEN TŞK EDERİM SANA SENİN SAYFAN SAYESİNDE HEVES EDİP BENDE AZ BİRAZ CSS KODLAMA DÜZENLEME FELAN ÖGRENDİM ŞU ANDA BLOGUM BU HALDEYSE SENİN SAYENDE-- ARADA Bİ SENİN BLOGUN KODLAMALARINA BAKIYODUM ONLARIN GİBİ ÖRNEKLERLE BİŞİLER ÖGRENDİM İŞTE :=)

    YanıtlaSil
  9. tşk ederim şeyyy bişiy sorcamtım furkan hocam sana şimdi benim bi tane blogum var ve örnegin blogumdaki bi konuyo facebbook share ile paylas diyorum sadece konunun adı çıkıyorr ve içerige dair hiç bişiy çıkmıyor sence sorun nedir bi yardımcı olabilir misin

    YanıtlaSil
  10. Bu yorum yazar tarafından silindi.

    YanıtlaSil
  11. Bende de dikkat ettiysen yazının içeriği değil alt kısmındaki bilgiler çıkıyor :( Önemli olan içerik kısmının çıkması.Daha bulamadım işte orasının nasıl yapılacağını ama birkaç arkadaş araştırıyoruz bakalım.

    YanıtlaSil
  12. Bu yorum yazar tarafından silindi.

    YanıtlaSil
  13. Bu yorum yazar tarafından silindi.

    YanıtlaSil
  14. Hocam burayı işgal etmeyelim :) Özelden iletişim kuruyorum.

    YanıtlaSil
  15. tmm ustam face sayfana gelem o zaman ben dur yorumlarımıda siliyim

    YanıtlaSil
  16. "Benzer Yazılar" bölümü çok güzel olmuş! (:

    YanıtlaSil
  17. Oradan buradan alıp güzelce kombine ettim :)

    YanıtlaSil
  18. furkan ustam tşkrar tşk etmek istedim sana TEKRAR ALLAH RAZI OLSUN DİYORUM BLOGUMA KURDUM YUKARIDAKİ DEDİGİN AYARLARI YAPTIM süper oldu sadece temanda resimlerde degişiklik yaptım emegine saglık ama tema senin tasarımın oldugu için aşagıdaki bayram şekeri teması furkan özden*.... vb resmini kaldırmadım emege saygı duymak lazım tekrar tşk ediyorum

    YanıtlaSil
  19. yalnız son bi soru daha sorucaktım şu sol taraftaki begen yani kayan cubugu nasıl pasif edebilirim yani nasıl kaldırabilirim rica etsem onuda söyler misin

    YanıtlaSil
  20. Kodlardan #sidenav'a display:none; özelliği ver yeter :)

    YanıtlaSil
  21. anemmmmm :) :) çok tşk ederim tekrar eline emegine saglık

    YanıtlaSil
  22. çok tşk ederim oldu valla ama bişiy daha sorcaktım biliyorum çok oluyorum ama mesela bi konunun altında begen tweet plus tusları çıkıyor ya işte begen butonunabasınca bende onayla tusuda çıkıyor onu nasıl hallederiz acaba yani onayla tusu çıkmasın
    örnek resim:http://dl.dropbox.com/u/53406672/ffffff.png bunada bi yardım etsen sana zahmet :( :)

    YanıtlaSil
  23. Valla o konu hakkında hiç bi' bilgim yok :( İlk defa sende gördüm.

    YanıtlaSil
  24. abi o şey varya popüler yayınlar benimkinde linkleride çıkıo sadece resim nasıl yapıcam sade resim olucak ...

    YanıtlaSil
  25. Temada css elementlerinde #PopularPosts1 ile başlayan yerleri sil yeter.

    YanıtlaSil
  26. önce bloger kullanıcılarıyla bu temayı paylaşma inceliğini gösterdiğiniz için teşekkür ederim genç kardeşim bloger kullanmak bir tutku gibi diyebilirim blogerede yazı içine adsense reklamı eklemek için( ) bu kodun altına veyaa üstüne koymak gerekiyor bu temanızda yok bu koda alternatif başka kod varmı acaba teşekkürler

    YanıtlaSil
  27. Yorumunuz için teşekkürler. Adsense ile aram pek iyi olmadığından fazla uğraşmadım. Doğal olarak temada yeri yok :)

    YanıtlaSil
  28. Bu yorum yazar tarafından silindi.

    YanıtlaSil
  29. öncelikle çoook teşekkürler izninizle size bi kaç sorum var :)
    1-menü yü nasıl çıkartabiliriz yukarda hani sayfaları nasıl ekleyebiliriz.
    2- yayınların aarasında çok boşluk kalıyor acaba bu boşluğu nasıl azaltabiliriz bide sizin blogunuzdaki gibi nasıl sağ tarafa kaydırabilirim lütfen ama lütfen açıklayın :(

    bekliyorum emeğinize sağlık diyorum :)

    YanıtlaSil
    Yanıtlar
    1. Yorum formuna gelen yenilik dolayısıyla yorum sayılarının olduğu kısımda biraz boşluk kalıyor. Bunu temadaki <span class='comments'> kısmını bulup oradaki style kodlarını düzenlemeniz gerekiyor.

      Sil
    2. tekrar merhaba dediğiniz gibi denedim ama kodları nasıl düzelteceğimi pek anlamadım biraz daha açarmısınız acaba
      bide dediğim gibi menüyü bide üstte twitter twitleride hallebilirsem sizin yardımınızla 10 numara bi tema olucak :)

      Sil
    3. Menü ve twitter'ı silmek için #cats css elementine display:none; etiketini eklemeniz yeterli olacaktır.

      Sil
  30. tekrar ben :) ya benim blog başlığı bu temayı yükledikten sonra üstte olmuyor onu nasıl halledebilirim ?

    YanıtlaSil
    Yanıtlar
    1. Gadgetlar yeni bir tema yüklendiğinde rastgele dağılırlar. Gereğine göre dizmeniz gerekebilir.

      Sil
    2. evet hepsi dağılmış ama başlığı hareket etmiyor etiremiyorum ?

      Sil
    3. lütfen bilgilendirmenizi bekliyorum :(

      Sil
    4. Hareket etmeyen gadget'ın adına bir isim verin. Daha sonra verdiğin ismi Şablon Tasarımcısındaki kodlarda aratın. Daha sonra o kodun yanında locked="true" diye bir ibare bulunacaktır. Onu false yapın tamamdır.

      Sil
    5. çok saol furkan kardeş o problemi halleddim saolsın artık 1-2 tane kaldı en önemlisi de şu yayınlar arasındaki boşluğun kalkmasını istiyorum ama yapamıyorum bu problemi nasıl halledebilirm yardımcı olurmusun biliorum çok oldum ama çok acil :(

      Sil
  31. furkan hocam SİZE Bİ ŞEY SORACAM: BEN BLOGUMU NASIL .COM ADINA ÇEVİREBİLİRİM BLOGDAN BAKTIM ÜCRETLİ DİYOR BU İŞİN ÜCRETSİZİ YOKMU ACABA YARDIMCI OLURSANIZ SEVİNRİZ.

    YanıtlaSil
    Yanıtlar
    1. .com her yerde paralıdır. Biraz araştırırsanız görürsünüz.

      Sil
  32. peki siz furkanözden.net'i paraylamı yaptınız?

    YanıtlaSil
  33. hiç bedava hosting/domain sitesi yokmu .com olarak?

    YanıtlaSil
  34. hocam tasarım Sayfa öğeleri kısmını bulamadım yardım edermisniz

    YanıtlaSil
    Yanıtlar
    1. Kumandal Paneli > Yerleşim

      Sil
    2. geldim şimdi logoyu nasıl düzenlicem

      Sil
    3. en sol üst köşedeki gadget'taki resim yolunu değiştirin ve resme kendi anasayfanızın linkini verin.

      Sil
  35. Link kırık hocam yenilerseniz kullanacağım :)

    YanıtlaSil
    Yanıtlar
    1. Halletim hocam. Bilgilendirme için teşekkür ederim.

      Sil
    2. Hallettim demişsiniz ama indirme link yok :(

      Sil
    3. Hocam linklerin sonun /#axzz2JxDrDUoV bundan geliyor neden olabilir ?

      Sil
    4. Temada kopyalama koruması var o yüzden.

      Sil
    5. Hocam birde ban bu sol taraftaki menuyu kaldırmak isitoyurm fakat kaldıramadım yardım ederseniz sevinriim :)

      Sil
  36. furkan hocam #axzz2KKxn0K2T link sonunda böyle birşey geliyor ?

    YanıtlaSil
    Yanıtlar
    1. Temayı kurduğunuz site içinden bir paragraf kopyalayıp başka bir yere yapıştırdığınızda altında otomatik olarak kaynak oluşuyor. Dediğiniz ifade o yüzden çıkıyor.

      Sil
  37. hocam bunun sizinki gibi 2 sütun haline getirmek için hangi css den değişcez

    YanıtlaSil
    Yanıtlar
    1. Bir tane yok ki hocam. Hangi birini söyleyeyim?

      Sil

Ana Sayfa