Dilediğiniz Zaman Arayın Canlı SOHBET Edelim: 
(İlk 5 Dakika Bedava)

Cansu: 008818200818

Esra: 0034951250447

22 Mayıs 2011 Pazar

Blog Yazılarında Kod Göstermek İçin Kod Penceresi

Bazı blogcular bloglarında java, html, css gibi kodları okurlarıyla paylaşmak isterler.Ancak bu kodları yazı editöründe direk paylaştığınızda kodlarınız değilde o kodlarla ortaya çıkan sonuç gözükür.

İşte bu yüzden kodlarınızı ayrı bir kod penceresinde paylaşmalısınız.Bu yazımda CSS ile nasıl kod penceresi oluşturacağınızı ve DIV ile kodlarınızı bu pencerede nasıl göstereceğinzi anlatacağım.

Blogger’da şablonunuzdaki kodlardan ]]></b:skin> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

.codeview {

font-family: Arial, Helvetica, sans-serif;

color: #CC0000;

margin : 15px 35px 15px 15px;

padding : 10px;

clear : both;

list-style-type : none;

border-top : 2px solid #cccccc;

border-right : 2px solid #cccccc;

border-bottom : 2px solid #cccccc;

border-left : 2px solid #cccccc;

background-color: #FFFFFF;

}

.codeview li {

font-size : 13px;

line-height : 24px;

font-family :

"Courier New", "MS Sans Serif", sans-serif, serif;

color : #333333;

font-weight : normal;

margin : 0;

padding : 0;

}


Yukarıda CSS kodları kod panceresini oluşturmak içindi.Blogger yazı editöründe yeni bir blog yazısı yazarken kodları göstereceğiniz yere şu kodu ekleyin.



<div class="codeview">

Kodlarınız buraya gelecek...

</div>


Ortaya çıkan sonuç şöyle olacaktır:



Blogger'da kod gösterme kutusu

Hiç yorum yok:

Yorum Gönder