Çoğumuzun eviminde veya ofisinde mantar pano vardır.Küçük raptiyeler kullanarak aldığımız kısa notları mantar panolara tuttururuz.Buna benzer benzer br uygulamayı bloglarınızda nasıl kullanacağınızı anlatamak istiyorum bu yazıda.
Blogunuzda resimde gördüğünüz not kağıtlarını 2 biçimde kullanabilirsiniz.Birincisi yazınızın içerisinde yazı ile ilgili mühim bir hatırlatma vs yapmak istediğinizde, ikincisi ise kenar çubuğunda ziyaretilerinize yine bir hatırlatma, duyuru vs yapmak istediğinizde.
Bu not kağıtlarını blogunuzda kullanmak için önce şablonunuzdan ]]></b:skin> kodunu bulun ve üstüne aşağıdaki stil kodlarını ekleyin.
.not {
padding: 0 20px 20px 20px;
border: 1px solid #DDD;
border-top: none;
border-left: none;
width: 160px;
min-height:150px;
float: right;
margin: 15px 0 15px 15px;
background-color: yellow;
font-size:14px;
font-style:italic;
line-height:1.5em;
color: #000;
}
.not div{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO-j8TO1QVs_AWRQJulkIAZ5P0npGSLwk8pi4nzS-OVA58w0xZyXku3iTIg4ZxCDk3wvzkvM1AdN6gnJssgWmTQqEpPUzV8smir2KzgWeKZ8ISix_Kmy6jSGmg1aEIUapjmb99A3fxCiy-/s47/pin.png) no-repeat;
width: 47px;
height: 41px;
margin: -20px auto 10px auto;
}
){kind=link}
Şimdi blogunuzda yeni bir kayıt oluşturmak için yazı editörünü açın ve HTML’yi Düzenle kısmına şu aşağıdaki kodları ekleyin.
<div class="not">
<div>
</div>
Bu not Serdar Kara tarafından Portakal Kabuğu okuyucuları için yazılmıştır.
</div>
Kırmızı renkte olan yer not kağıdında gözükecek kısımdır.Not kağıdında gözükmesini istediğiniz yazıyı oraya yazın.
Denediğinizde sizin de farkedeceğiniz şey not kağıdınız sağ tarafa yaslanmış olması.Notları yazının kendisinden ayırmak için böyle bir stil kullanımış.Not kağıdını kenar çubuğuna eklemek isterseniz sağa yaslanması kötü duracağı için ilk verdiğim kodlardaki float: right; satırını silebilirsiniz.
0 yorum:
Yorum Gönder
Bir düşüncen varsa eğer söyle bana ?