" Umut, hiç görmeyen birine gökkuşağını anlatmak kadar zor ve imkansız... "

Categories

-

Asp.Net Ckeditor-syntaxhighlight kurulumu...

Bu CKEditor syntaxhighlight eklentisi için kisa bir kurulum kilavuzdur. Syntaxhighlight eklentisi CKeditör ile programlama dilleri kodlari yazarken daha sade,renkli ve düzgün bir biçimde gösterilmesini sagliyor. Wakti zamaninda ckeditörüme syntaxhighlight eklentisi eklemek istemistim ama yapamamistim. Internette bununla ilgili pek fazla kaynak yok zannediyorum, aramistim bulamamistim. Ama yine aklima geldi, web sayfamda paylastigim kodlarin daha düzgün bir biçimde gösterilmesi için syntaxhighlight eklentisi gerekti ve arastirmaya basladim... Sonunda kurulumunu buldum ve yazimda paylasacagim....

http://alexgorbatchev.com/SyntaxHighlighter/download/ sayfasindan SyntaxHighlighter eklentisini indiriyoruz... Indirdikten sonra dosyamizi açip scripts,styles dosyalarini web sayfasi dizinimize kopyaliyoruz...

Web sayfasi dizinine koplayadiktan sonra ben default.aspx sayfamdan örnek verecegim... default.aspx sayfami açiyorum ve

<script type="text/javascript" src="js/scripts/shCore.js"></script>
<script type="text/javascript" src="js/scripts/shLegacy.js"></script>
<script type="text/javascript" src="js/scripts/shBrushBash.js"></script>
<script type="text/javascript" src="js/scripts/shBrushCpp.js"></script>
<script type="text/javascript" src="js/scripts/shBrushCSharp.js"></script>
<script type="text/javascript" src="js/scripts/shBrushCss.js"></script>
<script type="text/javascript" src="js/scripts/shBrushDelphi.js"></script>
<script type="text/javascript" src="js/scripts/shBrushDiff.js"></script>
<script type="text/javascript" src="js/scripts/shBrushGroovy.js"></script>
<script type="text/javascript" src="js/scripts/shBrushJava.js"></script>
<script type="text/javascript" src="js/scripts/shBrushJavaFx.js"></script>
<script type="text/javascript" src="js/scripts/shBrushJScript.js"></script>
<script type="text/javascript" src="js/scripts/shBrushPerl.js"></script>
<script type="text/javascript" src="js/scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="js/scripts/shBrushPlain.js"></script>
<script type="text/javascript" src="js/scripts/shBrushPython.js"></script>
<script type="text/javascript" src="js/scripts/shBrushRuby.js"></script>
<script type="text/javascript" src="js/scripts/shBrushScala.js"></script>
<script type="text/javascript" src="js/scripts/shBrushSql.js"></script>
<script type="text/javascript" src="js/scripts/shBrushVb.js"></script>
<script type="text/javascript" src="js/scripts/shBrushXml.js"></script>
  
<script type="text/javascript">
        SyntaxHighlighter.all();
</script>

head taglari arasina yukaridaki baglanti yollarimi belirtiyorum... css yolumu ve sitemde hangi programlama dillerini paylasacagimi söylüyorum... Mesela siz Vb.Net kodlari paylasacaksiniz ama yukarida diye belirtmediyseniz eger syntaxhighlight ekletiniz çalismayacaktir. Bunlara dikkat edelim... Kurulumun zaten pek bir zorlugu bulunmuyor.ardindan ckeditor-syntaxhighlight-1.0.tar eklentimizi indiriyoruz....

CKEditör 3 versiyonlari için yeni sürüm :

Syntaxhighlight_ver.1.3_CKEditor_Plugin

Kurulum asamalari

  1. ckeditor-syntaxhighlight eklentimizi indirdikten sonra açiyoruz ve  plugins klasörü içesindeki syntaxhighlight klasörünü CKEditör klasörümüz içindeki plugins klasörü içerisine koplayaliyoruz.
  2. Kopyalama islemini yaptiktan sonra CKEditör klasörü içerisindeki config.js dosyasini açiyoruz ve

        config.extraPlugins = 'syntaxhighlight';
        config.toolbar_Full.push(['Code']);


    kodlarini yaziyoruz...
  3. Bütün islem bu kadar... Ardindan CKEditorumuzu çalistirdigimizda syntaxhighlight butonun eklendigini göreceksiniz. Butona bastigimizda kodlarimizi yapistiriyoruz ve dilimizi seçiyoruz tamam butonuna basiyoruz ve kodlarimiz CKEditörümüze eklenmis oluyor.

Örnek uygulamayi buradan indirebilirsiniz.

  • 0
  • 838
  • 2

- BUNLARIDA GÖZDEN GEÇİREBİLİRSİNİZ -

2 YORUM

  • ekrem

    Teşekkürler gerçekten çok işime yaradı. Allah razı olsun

    2014-06-29
  • Okan Düzgün

    Faydasi dokunduysa ne mutlu...

    2014-09-16

Yorum yazın

HAKKIMDA

KONULARI TAKİP EDİN

SOSYAL AĞLAR

  • Mesajınızı Gonderin