寫教學的最大目的是教會未來的自己

給瀏覽器用的HTML編輯器-ckeditor(安裝篇)

會寫網站的人,應該都知道HTML吧,當然也有人看不懂也照樣做網站,畢竟現在很多軟體都有視覺化的處理方式,就算不懂HTML 也可以做出一個不錯的網頁。

但是,當你是要做一個論壇(這應該不會有人要自己刻了)、一個留言板、甚至是一個回函系統,有很多狀況是要使用者在網頁上自己編寫,方法大家都知道,用一個<form>,裡面再包一個<textarea> 恩 搞定,但是….如果不懂HTML,就算是後製處理,可能只能幫他換行,難道要教使用者如何使用HTML嗎?不可能嘛,所以就是要使用給瀏覽器用的HTML編輯器,而我常用的就是這套"ckeditor"

他是用種 利用javascript 實作出,平常我們網頁編輯軟體的"設計"模式,相當方便

 

官方網站 : http://ckeditor.com/

載點:http://download.cksource.com/CKEditor/CKEditor/CKEditor%203.6.1/ckeditor_3.6.1.zip (如果是使用ASP.net 建議去官方網站下載專用版本)

 

安裝方式:(wordpress 要使用請直接搜尋外掛安裝就好)

  1. 解壓縮後 把ckeditor 資料夾用FTP 上傳至網站上
  2. 在需要的網頁上在<head></head>中加入以下code
    <script src="../ckeditor.js" type="text/javascript"><!--mce:2--></script>
  3. 當一個頁面只需要一個的時候,在<textarea>中 加入class="ckeditor" 即可,如下
    <textarea id="editor12" class="ckeditor" cols="80" rows="10" name="editor12"></textarea>
  4. 當一個頁面藥使用多個的時候可以用以下方式(沒用過…)
    <!-- 嵌入第1個編輯器 -->
    <textarea id="editor1" cols="80" rows="10" name="editor1"></textarea>
    <script type="text/javascript"><!--mce:0--></script>
     
    <!-- 嵌入第2個編輯器 -->
    <textarea id="editor2" cols="80" rows="10" name="editor2"></textarea>
    <script type="text/javascript"><!--mce:1--></script>
    

這就是完成後的樣子,不過這是在 wordpress 用pluug-in弄出來的

Post to Twitter Post to Plurk Post to Facebook Send Gmail

發表迴響

Copyright © 2024. All Rights Reserved.

歡迎光臨
初音