SyntaxHighlighter Blogger'a Nasıl Eklenir Ve Kullanılır?

Eğer yazılarınız içerisinde HTML, CSS, JavaScript gibi program ve scriptlerden alıntılar yapıyor ya da kendi kodlarınızı yayınlıyorsanız SyntaxHighlighter eklentisi, işinize çok yarayacak bir eklentidir. Bu eklenti ile birlikte, yayınladığınız kodlar, renklendirilerek estetik bir görünüme kavuşur. Ayrıca kodları kullanmak isteyenler kopyala / yapıştır işlemini daha hızlı ve daha doğru bir şekilde yapabilirler.



KURULUM

Eklentiyi temamıza uygulamak için yapmamız gerekenler aşağıdaki şekildedir.

Blogger Kumanda Paneli > Şablon > HTML’yi Düzenle > Devam Et > komutlarını uyguluyoruz.
CTRL+F tuş kombinasyonu yardımıyla </head> kodunu bulup hemen üzerine aşağıdaki kodları ekliyoruz.

    



Eklentinin blogumuza eklenmesi işlemi bu kadar. Ancak kullanımında dikkat edilmesi gereken bazı hususlar var.

KULLANIM

Örneğin; eğer yazımızın içinde HTML kodlarını yayınlayacaksak, yayınlayacağımız kodları buradaki Raw HTML to Escaped HTML çevirici ¹ program yardımıyla Escaped HTML hale getiriyoruz. Daha sonra bu kodu aşağıda tanımlanan kod formatlarından uygun olanın içine yerleştiriyoruz.
HTML kodlarımız buraya yazılacak.

Aynı şekilde eğer CSS kodları yayınlayacaksak, yukarıda bahsettiğimiz kod çevirme işleminden sonra, aşağıdaki yapıyı kullanmamız gerekir.
CSS kodlarımız buraya yazılacak.

JavaScript kodları için kullanılacak yapı ise aşağıdaki şekildedir.
JavaScript kodlarımız buraya yazılacak.

Yazıldığı dilin algılanıp, renklendirilebildiği brushların listesi aşağıdadır.

actionscript3, bash, shell, c-sharp, csharp, cpp, c, css, delphi, pas, pascal, diff, patch, groovy, js, jscript, javascript, java, jfx, javafx, perl, pl, php, plain, text, ps, powershell, py, python, rails, ror, ruby, scala, sql, vb, vbnet, xml, xhtml, xslt, html, xhtml
SyntaxHighlighter ile kod yayınlamak biraz zahmetli olsa da, yayınlanmış olan kodları kullanmak oldukça kolaydır. Yapmanız gereken tek şey, kodların üzerine geldiğimizde sağ üstte ortaya çıkan ve sırasıyla; viev source (kaynağı göster), copy to clipboard (panoya kopyala), print (yazdır) ve help (yardım) komutlarından, copy to clipboard komutunu kullanmaktır..

Hiç yorum yok:

Yorum Gönder

 

Sample Text

Sample Text