Blogger Footer Alanına Sütun Ekleme
Blogger'ın kullanıclarına sunmuş olduğu hazır temaların bazılarında Alt Kısım (Footer) sadece tek sütundan oluşmaktadır. Bu sütunları isteğe bağlı olarak çoğalma imkanımız var.
Header, Main, Sidebar, Footer Nedir?
Bir blog sayfasını ana hatları ile belli başlı dört parçadan oluşur. Bu dört alan yukarıdaki resimde görülebileceği gibi; Header, Main, Sidebar, Footer şeklinde sıralanabilir.
Üst alan (Header) başlık alanı olarak kullanılır ve genelde blog hakkında bilgi içeriklidir. İçeriğin yayınlandığı alana yazı alanı (Main), genelde yazı alanının sağ ya da sol kısımda bazen ise her iki alanda yer alan sütunlara sidebar, ve alt kısma ise footer denir.
Blogunuza 3 sütunlu Footer Nasıl Eklenir?
Adım 1: Blogger'a kullanıcı adınız ve şifrenizle giriş yapın ve temanızın bir yedeğini alın.
Adım 2: Yerleşim > HTML'yi Düzenle'ye tıklayın. Ve "Ctrl+F" yardımı ile alttaki kodu aratın.
Bulmuş olduğunuz bu kodun yerine alttaki kodu yapıştırın;
Yukarıdaki kodu ekledikten sonra sayfanızı şablonu görüntüleyerek sorun olup olmadığını kontrol edin. Eğer herhangi bir sorun yoksa sonraki adıma geçin.
Adım 3: Temanızda ]]> kodunu bulun ve hemen üstüne alltaki kodu yapıştırın ve şablonunuzu kaydedin.
Sayfa Ögelerinizi görüntüleyin alttaki resimdeki gibi şablonunuzun en altında Footer kısmını göreceksiniz. İstediğiniz eklentiyi ekleyebilirsiniz.
Blogger Yazı Bilgilerini Gösterme - Başlık - Tarih - Zaman - Yazar
Yazılarınız içinde olması gereken Başlık - Tarih - Zaman - Yazar gibi bir çok eklentiyi sunduğumuz bu kodlar sayesinde blogunuzda gösterebilirsiniz.
- Yazılarınız içinde olması gereken Başlık - Tarih - Zaman - Yazar gibi bir çok eklentiyi sunduğumuz bu kodlar sayesinde blogunuzda gösterebilirsiniz.
Blogunuzun herhangi bir yerinde (genellikle yazı içerisinde) kullanabilmeniz için aşağıdaki kodları eksiksiz kopyalamanız gerekmektedir.
Yazının Başlığı Gösterme:
Yazının Etiketini Gösterme:
Yazının Yazarını Gösterme:
Yazının Yorum Sayısını Gösterme:
Blogger CSS BRL Link / Linklerinizi Renklendirin
(CSS Background Rainbow Link) Farenizi yazı içerisindeki herhangi bir linkin üzerine sürüklediğinizde farklı renkler arasında geçiş yapmasını sağlar.
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada aşağıdaki kodu aratın:
.post-body a{ color: red !important; } .post-body a:hover{ color: default !important; } .post-body a:visited{ color: default !important; }
Bulduğunuz bu kodu silip aşağıdaki kodu ekleyin.
.post-body a{ color: red !important; } .post-body a:hover{background:url(http://3.bp.blogspot.com/-v2jAAO7SAcQ/VNvQn2GnJwI/AAAAAAAAQAk/2HbiQmRyyqI/s1600/rainbow.gif); color: default !important; } .post-body a:visited{ color: default !important; }
Blogger hareketli dinamik resimler eklentisi
Yazı içerisindeki resimlere dinamik bir görünüm kazandırmanızı sağlar. Herhangi bir resmin üzerine mouse'unuz ile geldiğinizde resim flu'dan normal görünümüne dönüşür.
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;
.post img {-webkit-transition: -webkit-transform .15s linear;-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);padding: 5px 5px 5px 5px;-webkit-transform: rotate(+2deg);-moz-transform: rotate(+2deg);}
.post img:hover {-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5);-moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);-webkit-transform: rotate(-2deg);-moz-transform: rotate(-2deg);}
Blogger Kategorileri Yan Yana Sıralamak
Blogger Kategorilerinize(Etiketlerinizi) Görsellik Kazandırmak Amacıyla Yan Yana Sıralamak İçin Bu Eklentiyi Kullanabilirsiniz. Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;Blogger Kategorilerinize(Etiketlerinizi) Görsellik Kazandırmak Amacıyla Yan Yana Sıralamak İçin Bu Eklentiyi Kullanabilirsiniz.
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;
#Label1 ul li{float: left;width: 45%;}
Blogger günün sözü eklentisi
Blogunuzda hergün ünlü bir düşünürden kesitler yayınlamanızı sağlar.
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " <div id="footer"> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;
<center><script language="javascript" src="http://in.sitekodlari.com/gununsozu.js"></script></center>
Blogger HTML Yönlendirme kodu
- Sitenizi/Blogunuzu 5 saniye gibi kısa bir sürede başka bir siteye/bloga yönlendirmenizi sağlar.
Aşağıda verilen kodu Şablon >>> HTML Düzenle'de buluyoruz.
<b:skin>
Bulduğumuz bu kodun hemen ÜSTÜNE aşağıdaki kodu ekliyoruz.
<meta http-equiv="refresh" content="5;URL=http://BLOGUNUZUNADI.blogspot.com" />
- Alternatifler:
content="5; / Başka bir bloga ne kadar sürede yönleneceğine kod içerisindeki rakamı değiştirerek kendiniz belirleyebilirsiniz. Değer küçülttükçe yönlendirme hızlanır.
Blogger Rocket Teması
Soratemplates durmadan güzel temalar hazırlamaya devam ediyor. Yeni temaları da bir o kadar güzel.Tema gelen olarak mavi ve gri renkler üzerine yoğunlaşmış, elegant bir tema. Tema da ayrıca şık bir slider alanı bulunuyor. Ayrıca sol sütunda da bir menü alanı bulunuyor. Tema da bir dizi de sosyal paylaşım eklentisi mevcut.
Blogger arkaplanına resim(wallpaper) yerleştirme / (Background image)
Blogger arkaplana resim yerleştirme / (Background image)
Blogunuzun arkaplanına belirlediğiniz resmi yerleştirmenizi sağlar.
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;
Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.;
background-image: url("gradient_bg.png");
Kodları yukarıda anlatılan şekilde yerleştirdiğinizde sorunsuz çalışacaktır. İyi çalışmalar.
Siteniz için alternatif arkaplan duvarkağıtları(wallpaper)
Kaydol:
Yorumlar (Atom)