Blogger'da Çok Sütunlu Yazılar Nasıl Yazılır?
Klasik blog yazıları blogumuzda tek sütun halinde yer alır. Tıpkı bu yazıda ve blogda olduğu gibi. Ancak bazı Wordpress ve HTML sitelerde görebileceğiniz gibi yazıları yan yana iki veya daha fazla sütun halinde yazmak Blogger’da da mümkün.
Ne demek istediğimi gözünüzde canlandıramadıysanız aşağıda resimli örneklerle blog yazılarını Blogger’da 2, 3 ve 4 ve sütun halinde nasıl yazabileceğinizi anlattım.
Öncelikle Blogger Kumanda Paneli > Tema > HTML’yi Düzenle yolunu izleyerek ]]></b:skin> kodunu bulun ve bunun üzerine aşağıdaki CSS kodlarını ekleyin.
Ardından blogunuza normal bir yazı yazıyormuş gibi yazı editörünü açın ve burada HTML kısmına aşağıdaki kodları ekleyerek 2,3 ve 4 sütunlu yazılar oluşturabilirsiniz.
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 2 sütun halinde yazmak için şu kodları kullanacaksınız:
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 3 sütun halinde yazmak için şu kodları kullanacaksınız:
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 4 sütun halinde yazmak için şu kodları kullanacaksınız:
Çok sık olmasa da zaman zaman bu şekilde çok sütunlu yazılara ihtiyaç duyabiliyoruz. Umarım işinize yarar.
İyi bloglar!!!
Ne demek istediğimi gözünüzde canlandıramadıysanız aşağıda resimli örneklerle blog yazılarını Blogger’da 2, 3 ve 4 ve sütun halinde nasıl yazabileceğinizi anlattım.
Öncelikle Blogger Kumanda Paneli > Tema > HTML’yi Düzenle yolunu izleyerek ]]></b:skin> kodunu bulun ve bunun üzerine aşağıdaki CSS kodlarını ekleyin.
.iki-sutun, .uc-sutun, .dort-sutun{text-align:justify!important;} .bhsutunlar .iki-sutun, .bhsutunlar .uc-sutun, .bhsutunlar .dort-sutun{ display: block; padding: 0 10px; float: left;!important;} .bhsutunlar { margin: 15px 0; } .bhsutunlar *, .bhsutunlar *:after, .bhsutunlar *:before { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .bhsutunlar:after, .bhsutunlar:before { content: ""; display: block; clear: both; } .bhsutunlar .iki-sutun { width: 50%; } .bhsutunlar .uc-sutun { width: 33%; } .bhsutunlar .dort-sutun { display: block; width: 25%; }
Ardından blogunuza normal bir yazı yazıyormuş gibi yazı editörünü açın ve burada HTML kısmına aşağıdaki kodları ekleyerek 2,3 ve 4 sütunlu yazılar oluşturabilirsiniz.
2 Sütunlu Yazı
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 2 sütun halinde yazmak için şu kodları kullanacaksınız:
<div class="bhsutunlar">
<div class="iki-sutun">
Buraya ilk sütunun metnini girin</div>
<div class="iki-sutun">
Buraya ikinci sütunun metnini girin
</div>
</div>
3 Sütunlu Yazı
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 3 sütun halinde yazmak için şu kodları kullanacaksınız:
<div class="bhsutunlar">
<div class="uc-sutun">
Buraya ilk sütunun metnini girin</div>
<div class="uc-sutun">
Buraya ikinci sütunun metnini girin</div>
<div class="uc-sutun">
Buraya üçüncü sütunun metnini girin</div>
</div>
4 Sütunlu Yazı
Resimdeki örnekte gördüğünüz gibi yazıları yan yana 4 sütun halinde yazmak için şu kodları kullanacaksınız:
<div class='bhsutunlar'>
<div class='dort-sutun'>Buraya ilk sütunun metnini girin</div>
<div class='dort-sutun'>Buraya ikinci sütunun metnini girin</div>
<div class='dort-sutun'>Buraya üçüncü sütunun metnini girin</div>
<div class='dort-sutun'>Buraya dördüncü sütunun metnini girin
</div>
</div>
Çok sık olmasa da zaman zaman bu şekilde çok sütunlu yazılara ihtiyaç duyabiliyoruz. Umarım işinize yarar.
İyi bloglar!!!
Elinize sağlık Serdar hocam, çok işimize yarayacak :)
YanıtlaSilHocam ameğinize sağlık gayet güzel yazı olmuş. ve bilmediğimiz o kadar şey var ki blog ve Blogger hakkında sağolsun sizden öğreniyoruz.
YanıtlaSilİkili sütun şeklinde yazı paylaşmıştım. 3 ve 4 sütunlar bana fazla gelir ama bilgi açısından kıymetli. kullanışlı olduğu kesin.
YanıtlaSilÇok faydalı bir konu. Not alıyorum lazım olursa diye.
YanıtlaSilTeşekkürler :)
olumlu
YanıtlaSilkonuyla alakasız ama eski tema daha iyi değil miydi hocam?
YanıtlaSilÇok yavaştı, çok sıkıntısı vardı. Değiştirmek şart olmuştu artık.
SilTesekkurler
SilBu Temayı'da eski tema gibi ben yaptım de hadii.
YanıtlaSilUzun yazan arkadaşlar için kullanışlı bir eklenti bu eklentiyi kullanacagim..
YanıtlaSilTeşekkürler.
Temanızı Paylaşırmısınız.?
YanıtlaSilHoca. Tema eskisinden yavaş değilmi
YanıtlaSilBirader para para lazım. O tema daha hızlı ancaj reklam konmuyor. Baksana maşallah her yer reklam yapmış.
SilHayır eski temada çok fazla gereksiz kod ve grafik vardı.
Siladsız kardeş her insan emeğinden para kazanmak ister ama fazla reklam ve link siteye fazla zarar buna da biz karışamayız. Teşekkürler.
SilTemanızı değiştirmişiniz hayırlısı olsun.Benim merak ettiğim tema değişikliği hit kaybına sebep olmuyor mu? Siz hit kaybı yaşamadınız mı? Ayrıca temayı bloğa nasıl uyguladınız anlatırsanız,bilmeyen arkadaşlar için çok faydalı olur.Güle güle kullanın,iyi çalışmalar.
YanıtlaSilTema değiştirmek bir miktar hit kaybına sebep oluyor ama böyle sadık takipçileri olan güçlü siteler bunu kısa sürede atlatıp toparlıyor. Temayı doğru uygulayıp içerik girmeye devam edildiği sürece sorun yok.
SilHocam yazınız çok güzel olmuş; emeğinize sağlık!
YanıtlaSilBen de youtube a eğlenceli videolar hazırlıyorum. Kanalıma bir bakarsanız sevinirim! Teşekkürler...
https://www.youtube.com/channel/UC2zmUlUWz9ZyAhdOnCBMMSQ
Daha önce başka bir yerde rastlamadığım güzel bir bilgi. İleride lâzım olur belki de. Teşekkürler...
YanıtlaSilBlog yazarlarının sık kullanılanlara eklemesi gereken bir site, paylaşımlar için teşekkürler
YanıtlaSilMerhaba makaleniz güzel olmuş . Web sitenize daha fazla ziyaretçi çekmek için son yazdığım makalemi okuyabilirsiniz . https://sorununcevabiburada.blogspot.com.tr/2018/01/blogger-hit-arttrma-yontemleri.html
YanıtlaSilBlogumda lazım olacağını düşünüyorum hikaye yazıyorum paylaşımın için teşekkürler admin.
YanıtlaSil