Blogger kod kutusu ekleme

Blogger Kod Kutusu Nasıl Yapılır Blogger Codebox Eklentisi Blogger Kod Kutusu Ekleme Blogger Kod Kutusu Nasıl Eklenir Blogger Eklentileri Kod Kutusu

Blogger'a kod kutusu nasıl eklenir

Blogger kod kutusu Codebox adıyla da bilinen kod paylaşımı eklenti paylaşımı gibi paylaşımlarda bulunan arkadaşların çok fazla kullandığı bir araç tema tasarımcılarının temaya özel yapmış olduğu çok güzel çok özellikli kod kutularıda var tabiki  ama onları kullanmak biraz kod bilgisi gerektiren bir iş olduğu için yeni başlayan arkadaşlar kullanmakta zorluk çekebilir.

Blogger kod kutusu anlatımına geçelim

Blogger Codebox kod kutusu

Sizlere kendimce tasarladığım çok basit ve görsel anlamda da şık sayılabilecek kadar güzel kullanımı kolay kullanışlı bir kod kutusu sunacağım örnek sağ kısımda <pre data-codetype="HTML">HTML kodları Buraya</pre> gibi uzun uzun kodlar yazmanıza gerek yok kod paylaşmak için.

Sizleri bu zahmetten kurtarıcam  sadece bir kereliğe mahsus vermiş olduğum kodları temanıza ekliyeceksiniz ve sonra bir daha uğraşmıyacaksınız özellikle çok sık kod paylaşıyorsanız çok işinize yarayacak bir kod kutusu kullanımı kolay demiştim sadece yapmanız gereken <pre> Kodlar Buraya </pre> yazıp paylaşmak istediğiniz kodları kod dönüştürücü ile dönüştürdükten sonra ikisinin ortasına yapıştıracaksınız hepsi bukadar basit.

Üst kısımda da dediğim gibi kodlarınızı paylaşmadan önce kod dönüştürücü ile dönüştürmek zorundasınız yoksa kodlarınız kod şeklinde değilde neyin kodunu paylaşıyorsanız o şekilde görünecektir yada güzel düzenli bir şekilde görünmeyecektir.

Blogger kod kutusu kurulumu

Lafı daha fazla uzatmadan gelelim blogger kod kutusu kurulumuna blogger kontrol paneline girin Tema bölümününe tıklayın HTML'yi Düzenle kısmına tıklayın ve açılan kısımda CTRL F kombinasyonu ile
]]></b:skin> kodunu aratın kodu bulduktan sonra hemen üst kısmına aşağıdaki kodları yapıştırın temanızı kayıt edip çıkış yapabilirsiniz.

[pre { background-image: linear-gradient(rgba(0, 0, 0, 0.05) 50%, transparent 50%, transparent); background-size: 100% 50px; border:solid #1eb093; line-height:16px; color:#000; border-width:4px; font-family:monospace; font-size:14px; padding:4px 7px; background-color:#EEE; border-radius:6px; max-height:500px; overflow:auto;}]

Blogger kod kutusu ayarı

1-Yukarıda kırmızı ile belirttiğim border solid #1eb093 kod kutusunun çerçevesidir siz istediğiniz rengi ayarlayabilirsiniz.

2-Yukarıda kırmızı ile belirttiğim line height:16px kodların satır aralarındaki boşluğu belirtir isterseniz onuda değiştirebilirsiniz.

3-Yukarıda kırmızı ile belirttiğim color: #000 kodlarınızın rengini belirtir isterseniz onuda değiştirebilirsiniz.

4-Yukarıda kırmızı ile belirttiğim border-width:4px kod kutusunun çerçeve kalınlığını belirtir isterseniz onuda değiştirebilirsiniz.

5-Yukarıda kırmızı ile belirttiğim font-family:monospace kodlarınızın yazı tipini belirtir isterseniz onuda değiştirebilirsiniz.

6-Yukarıda kırmızı ile belirttiğim font-size:14px kodlarınızın yazı boyutudur isterseniz onuda değiştirebilirsiniz.

7-Yukarıda kırmızı ile belirttiğim padding:4px 7px üst ve sol kenar açılarını belirtir bu boyut idealdir. ama isterseniz onuda değiştirebilirsiniz.

8-Yukarıda kırmızı ile belirttiğim background-color:#EEE kod kutusunun arka planını belirtir isterseniz onuda değiştirebilirsiniz.

9-Yukarıda kırmızı ile belirttiğim border-radius:6px kod kutusunun oval kenarlarını belirtir isterseniz onuda değiştirebilirsiniz.

10-Yukarıda kırmızı ile belirttiğim max-height:500px kod kutusunun yüksekliğini belirtir ve idealdir.

Yukarıdan aşağıya kadar sayfa boyunca uzayan kod kutuları bence hoş görünmemekte hemde kodları kopyalamak isteyen kişi için zorluk çıkarır kodu kopyalıyım derken komple sayfa içeriğide kopyalanır onun için 500px yeterlidir tam sayfanın orta kısmında kalır hemde kolay kopyalama işlemi yapılır.

Aslında çok basit bir konuyu tam detaylı bir şekilde açıkladığımı düşünüyorum yinede yapamayan yada bir sorun ile karşılaşan olursa yorum yaparak bildirebilir yada iletişim sayfasından bana ulaşabilirsiniz kodları kullanıcak arkadaşlara şimdiden hayırlı olsun diyeyim. Kodları bloğunuzda paylaşmak isterseniz 

Blogdan indir'den alıntı olduğunu belirtirseniz sevinirim. Takipde kalın yazılarımı okumaya devam edin.