Web Sitesine Kod Kutusu "CodeBox" Ekleme!

Web sitesine bazen kod eklemeniz gerekebilir. Kodlarınızın yazmış olduğunuz makale arasında düzenli bir şekilde gözükmesini istiyorsanız; bunu kod kutusu ekleyerek yapabilirsiniz. Detaylar rehberimizde.

Ben bu rehberde kod kutusunu makalenizin içine birden fazla yöntem ile eklemeyi de göstereceğim. Hangisi işinize gelirse o yöntemi kullanabilirsiniz.

1. Yöntem

Aşağıdaki kodları web sitesinde yayın yazarken HTML kısmına kopyalayarak kod düzenleyicisini kullanabiliriz.

<pre style="background-color: #F5F8FA; border: 1px dashed #999999; color: black; font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;">
<code>
    Kodlar buraya gelecek
</code></pre>

2. Yöntem

1. Blogger hesabımıza giriş yaparak Yönetim Paneli kısmında Şablon > HTML’yi Düzenle bölümüne giriş yapalım.
2. CTRL + F kombinasyonu yardımı ile “]]></b:skin>”  yazan yeri aratalım.
3. “]]></b:skin>” kodunu bulduktan sonra bu kodun bir satır üstüne aşağıda vermiş olduğum kodları ekleyin.
4. Daha sonra temayı kaydet deyip çıkın.

Son olarak yeni bir yayın yazacağımız zaman HTML kısmına basarak;

 

<pre> Ekleyeceğiniz Kod </pre>

  

kırmızı alana istediğimiz kodu yazar kullanabiliriz.

Artık kod kutusunu aşağıdaki görünümde kullanabilirsiniz.

pre { 
/* Kod Kutusu Başlangıç/yimonla.blogspot.com */
border-radius: 4px 4px 4px 4px; 
border: 1px solid rgb(204, 204, 204);
 box-shadow: 0px 0px 10px rgb(204, 204, 204)
 inset; font-family: Arial,Helvetica,sans-serif; 
 margin-bottom: 20px; 
 margin-top: 20px; 
 max-height: 250px; 
 overflow: auto; 
 padding: 5px;
/*Kod Kutusu Bitiş/yimonla.blogspot.com */
}

3. Yöntem

Bu yol ile istediğimiz tagları kullanarak kod kutusu eklemeyi göstereceğiz.

Buradaki; web sitesine giderek kodlarımız yapıştırıyoruz, bu sayede bizim için kodları web sitesinde yayınlayacağımız şekile dönüştürülüyor.

Daha sonra ise; bu kodları yine yayın oluştururken HTML kısmına giriş yaparak yapıştırıyoruz ve  işlem tamamdır. Bu yönetemlerden dilediğinizi kullanarak sizde web sitenizdeki yayınların içine kod kutusu ekleyebilirsiniz. 

Ayrıca kullandımız kodları not defteri formatında indirmek isterseniz; burayı tıklayın.

Her türlü görüş ve sorunuzu yorumlar bölümünden bizlere iletebilirsiniz.