FreeRichText Editor’u Web Sayfasına Ekleme ve Kullanma

25Dec/082

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.

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

Üretici Sayfası : Sayfaya Git

Demo Sayfası : Sayfaya Git

İndirme Sayfası : FreeRTE İndir

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.

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.

Tagged as: FreeRichTextEditor, FreeRTE, WYSIWYG Leave a comment

Comments (2) Trackbacks (0) ( subscribe to comments on this post )

Çağlar
July 14th, 2009 - 14:12

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?
Ehocam
July 14th, 2009 - 22:59

Ş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.