• Posted by : Unknown 22 Mayıs 2011 Pazar

    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

    Leave a Reply

    Subscribe to Posts | Subscribe to Comments

  • Copyright © 2013 - Hyperdimension Neptunia

    Blogger Ve Wordpress Tema Arşivi - Powered by Blogger - Designed by Johanes Djogan