Blogger Kod Penceresi Resimli

   Yeni bulduğum ve diğer blog sitemde kullandığım kod çerceve kodunu sizinle paylaşmak istedim.
Bu kodun kullanımı kolay ve üstelik kod çercevesine resim ekleyebilirsiniz.Ayrıca kod kutusu şeklini ve yazı tipini değiştirme imkanınız da var.Bunu yapabilmeniz için öncelikle yazı şekilleri kodlarını bilmek gerekiyor yoksa yapmış olduğunuz değişiklikler işe yaramaz.

   Şimdi bu kod kutusunu Blog sitemize ekleyelim;

1. Kumanda Paneli > Şablon > Html Düzenle yolunu izleyiniz.
2. Daha sonra şablon kodlarınız içinde Ctrl+F kısa yol tuşları ile ]]></b:skin> kodunu aradınız.
3. Bulduğunuz ]]></b:skin> kodunun hemen üstüne aşağıda ki Kodları ekleyin ve şablonunuzu kaydediniz.

.codeview {
margin : 15px 15px 15px 35px;
padding : 10px;
clear : both;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
line-height:1.6;
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7SIatHYehjwBurht7c9oBpf4wiDIh9iP_XXPgYe00KffW5tNWK2sVmOpzqHGqImQCv2i5OvpMyFpLYrLh9GFpH7c1OWgJbPKh7FrLXjh_DCucRC5nrOj9keivDNVCyy00o3LZDpXd7_7d/') no-repeat scroll bottom right #EFFBF5;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
line-height : 24px;
color : #333333;
margin : 0;
padding : 0;
}

    4. Şimdi makaleleriniz içinde kod paylaşacak olduğunuzda HTML kısmına tıklayarak aşağıda ki kod içinde yazan  Kodlar Buraya Eklenecek metin yerine ekleyin ve yazınıza Oluştur kısmından sonra yazmaya devam ediniz.

<div class="codeview">

<!-- Kodlar Buraya Eklenecek -->

</div>

     5. Yazı tipini değiştirmek isterseniz en baştaki kod içinde yazan kodu değiştirmeniz gerekir.

font-family : "Courier New", "MS Sans Serif", sans-serif, serif;

          6. Kod resmini değiştirmek isterseniz eğer;

url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7SIatHYehjwBurht7c9oBpf4wiDIh9iP_XXPgYe00KffW5tNWK2sVmOpzqHGqImQCv2i5OvpMyFpLYrLh9GFpH7c1OWgJbPKh7FrLXjh_DCucRC5nrOj9keivDNVCyy00o3LZDpXd7_7d/') no-repeat scroll 

          7. Kod kutusu renklerini değiştirmek isterseniz eğer;

border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;

color : #333333;

      ÖNİZLEME İçin aşağıda ki kod şablonunu inceleyin


Bizi Takip Edin
Pinterest>> Facebook>> Twitter
 © by bilgicafem61
Aşağıda Yorum ve Sorularınızı Bırakın...