Blogger Bayram Şekeri Teması
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='http://1.bp.blogspot.com/-UU8vSwg9VBQ/TWold57OrLI/AAAAAAAAAI0/RfjseBvVhIQ/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 http://4.bp.blogspot.com/-0DW_3p4qALk/TpRj7T7-HqI/AAAAAAAAB34/tHqF9S8v304/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(http://4.bp.blogspot.com/-PtDtkAq0fEk/Tuug8pu8RxI/AAAAAAAACz4/17ufgZKPHRk/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
Vatana Millete Hayırlı olsun :)==
sen var ya furkan cennetliksin ya süper oldu bu eline saglık
Müjdata kesinlikle katılıyorum 🙂
� çogu kodlarda bu hata var olsun düzeltirim tekrar çok tşk ederim furkan
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.
olsun furkan sorun deil sen o kadar emek harcamıssın ben bi bunumu düzeltemicem ..
Anlayışın için teşekkür ederim 🙂
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 :=)
Hadi hayırlısı 🙂
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
Bloguna facebook’ta paylaş butonu ekle: Bu yazım işini görür 🙂
Bu yorum yazar tarafından silindi.
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.
Bu yorum yazar tarafından silindi.
Bu yorum yazar tarafından silindi.
Hocam burayı işgal etmeyelim 🙂 Özelden iletişim kuruyorum.
tmm ustam face sayfana gelem o zaman ben dur yorumlarımıda siliyim
Teşekürler. güzel tema 🙂
“Benzer Yazılar” bölümü çok güzel olmuş! (:
Oradan buradan alıp güzelce kombine ettim 🙂
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
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
Kodlardan #sidenav‘a display:none; özelliği ver yeter 🙂
anemmmmm 🙂 🙂 çok tşk ederim tekrar eline emegine saglık
ç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 🙁 🙂
Valla o konu hakkında hiç bi’ bilgim yok 🙁 İlk defa sende gördüm.
abi o şey varya popüler yayınlar benimkinde linkleride çıkıo sadece resim nasıl yapıcam sade resim olucak …
Temada css elementlerinde #PopularPosts1 ile başlayan yerleri sil yeter.
Teşekkür ederim
ö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
Yorumunuz için teşekkürler. Adsense ile aram pek iyi olmadığından fazla uğraşmadım. Doğal olarak temada yeri yok 🙂
Bu yorum yazar tarafından silindi.
ö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 🙂
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.
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 🙂
Menü ve twitter’ı silmek için #cats css elementine display:none; etiketini eklemeniz yeterli olacaktır.
tekrar ben 🙂 ya benim blog başlığı bu temayı yükledikten sonra üstte olmuyor onu nasıl halledebilirim ?
Gadgetlar yeni bir tema yüklendiğinde rastgele dağılırlar. Gereğine göre dizmeniz gerekebilir.
evet hepsi dağılmış ama başlığı hareket etmiyor etiremiyorum ?
lütfen bilgilendirmenizi bekliyorum 🙁
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.
ç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 🙁
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.
.com her yerde paralıdır. Biraz araştırırsanız görürsünüz.
peki siz furkanözden.net’i paraylamı yaptınız?
evet.
hiç bedava hosting/domain sitesi yokmu .com olarak?
yoktur
hocam tasarım Sayfa öğeleri kısmını bulamadım yardım edermisniz
Kumandal Paneli > Yerleşim
geldim şimdi logoyu nasıl düzenlicem
en sol üst köşedeki gadget’taki resim yolunu değiştirin ve resme kendi anasayfanızın linkini verin.
Link kırık hocam yenilerseniz kullanacağım 🙂
Halletim hocam. Bilgilendirme için teşekkür ederim.
Hallettim demişsiniz ama indirme link yok 🙁
Şimdi oldu.
Hocam linklerin sonun /#axzz2JxDrDUoV bundan geliyor neden olabilir ?
Temada kopyalama koruması var o yüzden.
Hocam birde ban bu sol taraftaki menuyu kaldırmak isitoyurm fakat kaldıramadım yardım ederseniz sevinriim 🙂
furkan hocam #axzz2KKxn0K2T link sonunda böyle birşey geliyor ?
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.
hocam bunun sizinki gibi 2 sütun haline getirmek için hangi css den değişcez
Bir tane yok ki hocam. Hangi birini söyleyeyim?