12 Mayıs 2009 Salı

Blog Temanızın Genişliğini (width) Nasıl değiştirirsiniz?

Blog temanızın genişliğini değiştirebilmek için öncelikle CSS (CASCADING STYLE SHEET) yapısını bilmek gerekiyor. Bu konuya da ayrıca başka bir makelemizde değineceğim.

Temamızda değişiklik yapma için öncelikle Blogger Kumanda Paneli / Yerleşim / Sayfa Öğeleri’ni izliyoruz. HTML’yi düzenleden Şablonu düzenleyeceğiz. Ancak burada unutmamaız gereken önemli bir konu mutlaka Temanızın bir BACK UP alın.
Widget Şablonlarını Genişleti tıklıyoruz ve Temamızda değişiklik yapmaya başlayabiliriz.:
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 1025px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 530px;
margin-left: 20px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
#sidebar-wrapper {
width: 250px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
#newsidebar-wrapper {
width: 170px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
OuterWrapper ana wrapperları ve 2 tane sidebar wrapperları içerir. Bunlar genişlik paremetrelerini gösterirler ve float parameter olarak tanımlanırlar. Burda dikkat edilmesi gerekem konu outer wrapper float parametera sahip değildir. Bundan dolayı sayfanın ortasındaki pozisyon margin olarak tanımlanmıştır. Main yada sidebar kolunun genişliğini değiştirdiğinizde bunların sadece parametreleri değişir, ve ardından outer wrapper genişiğini de aynı şekilde değiştrimeniz gerekebilir.
Ardından HEADER genişiğinide değiştrmek isterseniz, aynı şekilde Edit template texten yapabilirsiniz.
/* Header
-----------------------------------------------
*/
#header-wrapper {
width:750px;
margin:0 auto 10px;
border:0px solid $bordercolor;
}
then change 750 to whatever width you want it to be.

Not. Bazı temalar OUTER WRAPPER’a sahip olmayabilir. Bu durumda temanızdaki body kısmından bu değişiklikleri yapabilirsiniz.

Hiç yorum yok:

Yorum Gönder