FreeRichText Editor’u Web Sayfasına Ekleme ve Kullanma

Bu yazıda FreeRichTextEditor 1.0 versiyonunun genel özelliklerini, bir web sayfasına nasıl eklendiğini ve asp ile nasıl kullanıldığını göreceksiniz. Bu yazımın 4 parçadan oluştuğunu bilmeniz gerekmektedir. Parçalardan 2. makalem budur. 1. Makale’de en fazla kullanılan WYSIWYG editörlerini tanıtmıştım. 1. Makaleme buradan ulaşabilirsiniz. wysiwyg_editorler4

Öncelikli FreeRTE’nin üretici web sayfasını tekrardan vereyim.

Üretici Sayfası : Sayfaya Git

Demo Sayfası : Sayfaya Git

İndirme Sayfası : FreeRTE İndir

wysiwyg_editorler5

Editörümüzü buradaki adresimizden indiriyoruz. İlk olarak javascript ile nasıl eklenir ona bakalım. Dosyanızı açtığınızda içersinde examples klasörünü göreceksiniz. İçerisinde php, asp ve normal bir html sayfasına nasıl eklenebilir onu göreceksiniz. Html ile başlayalım. Bu kodları examples klasörünün içine yapıştırmanız gerekmektedir. Examples klasörünün adını değiştirebilirsiniz. Mesela adına sayfalar koyabilirsiniz. Fakat mutlaka bir üst klasörde images, html, js klasörleri olması gerekmektedir.

<form method="get">
<!-- Include the Free Rich Text Editor Runtime --> 

<script src="../js/richtext.js" type="text/javascript"></script>
<!-- Include the Free Rich Text Editor Variables Page -->
 <script src="../js/config.js" type="text/javascript"></script>

<!-- Initialise the editor -->

<script type="text/javascript">
<!--
initRTE('<i>This is some <b>preloaded</b> content</i>', 'example.css');
// -->
</script>

<input type="submit" />

</form>

Yukarıdaki kodu <body></body> etiketleri arasına koyduğunuz zaman editör karşınıza çıkması lazım. Html’de kolaylıkla yaptık. Asp’de ise sorun bulunmakta. Aslında sorun yanlış kod yazımı. Tam olarak farkında değiller mi yoksa benim bilmediğim kodlar mı türedi asp’de bilmiyorum ama IIS üzerinden example.asp dosyasını çalıştırdığınızda normalde birşey göremeyeceksiniz. (galiba php örneği asp bilmeyen biri yapmaya çalışmış 🙂 ) Bir kaç satır kod değiştirmek gerekecek.

free_rte4

Yani kısacası resimde görüldüğü gibi yanlış. Şimdi examples klasörünün içine deneme.asp diye bir dosya açın. Aşağıdaki kodları eklediğinizde sayfada editör karşınıza çıkacaktır.

<%function freeRTE_Preload(content)

content = trim(content)

content = replace(content, chr(10), " ")

content = replace(content, chr(13), " ")

content = replace(content, chr(145), chr(39))

content = replace(content, chr(146), chr(39))

freeRTE_Preload = content

end function

content = freeRTE_Preload("<i>Sayfa Yüklendiğinde İçeriği Buraya Yerleştir </i>")%>

<form method="post">

<script src="../js/richtext.js" type="text/javascript" language="javascript"></script>

<script src="../js/config.js" type="text/javascript" language="javascript"></script>

<script>

initRTE('<%= content %>', 'example.css');

</script>

<input type="submit">

</form>

Son olarak editörde yapmış olduğunuz verileri ise aşağıdaki komutla almanız mümkündür. Veriler icerik değişkenine html yapıda atanacaktır. Mesela kalın bir şekilde A harfini yazdığınızda html karşılığı<b>A</b> dir. Bunu editörde yaptığınızda icerik değişkenine <b>A</b> gelecektir. Daha sonra ister üzerinde işlem yaparsınız isterseniz de veritabanına kaydedersiniz. 🙂

This entry was posted in 3.Part Web Uygulamaları and tagged , , . Bookmark the permalink.

3 Responses to FreeRichText Editor’u Web Sayfasına Ekleme ve Kullanma

  1. Çağlar says:

    web siteme FreeRT yerleştirdim fakat html->design geçişlerinde problem yaşıyorum. Designa bastığım zaman kopyaladığım html kodumun takından itibaren otomatik olarak siliniyor ve tırnak işaretlerinden önce / konuyor. Çözümü varmıdır acaba?

  2. Ehocam says:

    Şimdi editöre birşey yapıştırmak isterken, önce notepad programına yapıştır. Daha sonra ordan kopyalayıp, editöre yapıştır. Bu şekilde stillerden veya benzer etiketlerden kurtulmuş olacaksın. Bu şekilde Design kısmında veriyi yapıştırıp, daha sonra üzerinde çalışma yapabilirsin. Temiz veri üzerinde değişiklik yaptığın zaman / işareti koymayacak diye tahmin ediyorum dostum.

  3. Murat says:

    link pelte çıkmış hocam elinizde mevcutsa upload etme şansınız varmı acaba??

    Teşekkürler..

Leave a Reply

Your email address will not be published. Required fields are marked *