Blogger Sablonu Genislik Ayarı

<div style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px; text-align: center;"> Blogumuzun düzenli olmasını istiyorsak önce neyi nasıl yapacağımızı bilmemiz gerekiyor.</div> <div style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px; text-align: center;"> Tabi bunun için şablon tasarımının en azından en basit halinden de biraz anlamak lazım.</div> <div style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"> </div> <div style="text-align: center;"> <span style="font-family: Arial, Helvetica, sans-serif;">şimdi hazırladığım resimde biraz anlatmaya çalışayım</span></div> <br /> <br /> <div class="separator" style="background-color: white; clear: both; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; text-align: center;"> </div> <div class="separator" style="background-color: white; clear: both; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgapFXP_FZL-n4XrPzgHbL4H_JqiFXW6VqM4xQ9stSuobbClrGIk04D9t4o8pXH9euym54s1BC7_eaMgGf18zk1KIvdF_kWHFlry6xofiIAOxjK3QBV7_hjsVsjIl8a3_KYSIflsK2qc5A/s1600/Animation2.gif" imageanchor="1" style="color: #a6cbcc; margin-left: 1em; margin-right: 1em; outline: none;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgapFXP_FZL-n4XrPzgHbL4H_JqiFXW6VqM4xQ9stSuobbClrGIk04D9t4o8pXH9euym54s1BC7_eaMgGf18zk1KIvdF_kWHFlry6xofiIAOxjK3QBV7_hjsVsjIl8a3_KYSIflsK2qc5A/s400/Animation2.gif" style="background-color: transparent; border: none; padding: 0px;" width="320" /></a></div> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px;" /> <div class="separator" style="background-color: white; clear: both; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; text-align: center;"> </div> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px;" /> <span style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"><b><span style="color: red;">header</span></b><span style="color: #222222;">= blogumuzun başlık kısmı</span></span><br /> <span style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"><b><span style="color: red;">sidebar</span></b><span style="color: #222222;">= gadget larımızı (widget da deniyor) yerleştirdiğimiz bölüm</span></span><br /> <span style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"><b><span style="color: red;">footer</span></b><span style="color: #222222;">= sayfa sonu bilgi bölümü</span></span><br /> <span style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"><span style="color: red;"><b>contanier </b></span></span><span style="background-color: white; font-family: Arial, Helvetica, sans-serif; line-height: 20px;"><span style="color: #222222;">= </span><b><span style="color: orange;">outer-wrapper</span></b><span style="color: #222222;"> da deniyor hatta bazı şablonlarda daha değişik isimleri de var,kırmızı ile belirlediğim bölüm</span></span><br /> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;" /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">peki bunların ayarları nasıl yapılıyor dersek=></span><br /> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;" /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">kumanda paneli >  tasarım > html'yi düzenle  düzeninde ilerleyip şablonumuzu açtıktan sonra kırmızıyla işaretlediğim şu etiketi buluyoruz</span><br /> <br /> <div class="separator" style="background-color: white; clear: both; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmuMdyaGqbRmQ_X5pZOo1-lN3pSib3k0DTes3XLTyOMoYZdSNOi4aRWxf5T2ffyZIFc-TpHmTCxiMoz8yUD7nbIPyyGk1WTJkr1ptNVt6UPxkEJ-4X7f9QajW12TbKZAtyD6MfRFV5vwA/s1600/ScreenHunter_1.jpg" imageanchor="1" style="color: #a6cbcc; margin-left: 1em; margin-right: 1em; outline: none;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmuMdyaGqbRmQ_X5pZOo1-lN3pSib3k0DTes3XLTyOMoYZdSNOi4aRWxf5T2ffyZIFc-TpHmTCxiMoz8yUD7nbIPyyGk1WTJkr1ptNVt6UPxkEJ-4X7f9QajW12TbKZAtyD6MfRFV5vwA/s400/ScreenHunter_1.jpg" style="background-color: transparent; border: none; padding: 0px;" width="400" /></a></div> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px;" /> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px;" /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">bu kadar kodun içinde onu nasıl bulacağım diye üzülmeyin :) klavyede kısa bir yol var... "ctrl" tuşuna basarken aynı anda da "f" e basarsanız ekranın sağ köşesinde küçük bir kutu çıkacak..</span><br /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">o kutuya aradığınız kodu yazıp "enter" a basarsanız kod otomatik olarak karşınıza gelir</span><br /> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;" /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">Sonra yine kırmızı ile gösterdiğim "width: 960px" koduna dikkat edelim.işte bu bizim blog sayfamızın genişliğini belirleyen koddur..bana kalırsa en güzeli 960 ya da 990 dır..bunlardan daha düşük rakamlar sayfayı daraltır..daha yüksekler ise sayfayı genişletir ki bu da  izleyecileriniz tarafından sayfanızın bir sağa bir sola çekiştirilmesi demektir..</span><br /> <br style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;" /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">bu ayarı yaptıktan sonra header ve footer bölümlerindeki "width" ayarlarını da değiştirmeyi unutmayın..yoksa ya küçük ya da büyük görünürler..header ve footer ınızın contanier-outer wrapper ayarlarınızla aynı olması gerekir.</span><br /> <span style="background-color: white; color: #222222; font-family: Arial, Helvetica, sans-serif; line-height: 20px;">Hayırlı Olsun...Yorumlarınızı Esirgemeyin Lütfen</span>

Blogger Sablonu Genislik Ayarı

Blogumuzun düzenli olmasını istiyorsak önce neyi nasıl yapacağımızı bilmemiz gerekiyor. Tabi bunun için şablon tasarımının en azından en ...

Devamı »