FCKeditor là một công cụ soạn thảo tin trực tuyến miễn phí đầy đủ tính năng hữu dụng gần như MS Word. Khi được tích hợp vào hệ thống quản lý nội dung website, người dùng có thể dễ dàng soạn thảo, cập nhập trang tin một cách nhanh chóng với định dạng phong phú. Qua bài viết này tôi muốn giới thiệu với các bạn cách sử dụng và tích hợp FCKeditor cho website của mình.

Tính năng

Điểm mạnh của FCKeditor ở chỗ nó chính là một phần mềm mã nguồn mở, miễn phí, cập nhập thường xuyên và chứa trong nó những tính năng phong phú hữu dụng mà nhiều phần mềm thương mại không có:

· Tương thích với hầu hết các trình duyệt phổ biến trên thị trường như IE, Nestcape, Mozilla, FireFox. Đây chính là một đặc điểm rất quan trọng giúp mở rộng đối tượng sử dụng chương trình.

· Hỗ trợ chuẩn định dạng XHTML 1.0 – sự kết hợp giữa HTML và XML giúp hiển thị và truyền tải thông tin qua trình duyệt tốt hơn.

· Định dạng font chữ đa dạng theo loại, kích cỡ, màu sắc, kiểu dáng.

· Có thể dễ dàng cắt/dán (cut/paste) giữ nguyên định dạng và hình ảnh, có khả năng phục hồi (undo/redo).

· Tự động phát hiện và tạo liên kết cho đoạn text phù hợp, ví dụ http://www.nsd-it.com tự động được chuyển thành http://www.nsd-it.com.

· Hỗ trợ “anchor” (neo hình).

· Tải ảnh lên thư mục trên server một cách dễ dàng, nhờ đó người dùng có thể chọn ảnh chèn vào bài viết dễ dàng.

Dễ dàng thêm các biểu tượng có sẵn.

· Tạo và định dạng bảng dễ dàng, đây là một tính năng rất quan trọng và được đánh giá là mạnh nhất trong số những công cụ soạn thảo trực tuyến.

· Dễ dàng thêm các đối tượng hiển thị trong form: nút kiểm, nút chọn, nút bấm, text...

· Hỗ trợ menu ngữ cảnh khi nhấn chuột phải vào phần chỉnh sửa. Ví dụ khi nhấn vào phần chỉnh sửa trong bảng, menu ngữ cảnh là của bảng.

· Có thể hiển thị tùy ý những nút trên thanh công cụ.

· Hiển thị giao diện trình soạn thảo theo giao diện Win2000 hoặc XP hoặc Mac.

· Có thể gắn thêm các tính năng (plug-in).

· Có thể kiểm lỗi chính tả ngay trên công cụ.

· Hỗ trợ CSS vào nội dung trang tin để hiển thị định đạng tốt hơn.

· Có thể tùy biến ngôn ngữ hiển thị giao diện. Ví dụ, hiển thị trợ giúp, tooltip... bằng tiếng Việt thay vì tiếng Anh.

· Có thể chỉnh sửa cả trang web thay vì chỉ phần nội dung hiển thị.

· Chiếm ít bộ nhớ và tốc độ tải nhanh. Nhưng tốt nhất nên dùng trong mạng Lan hoặc mạng ADSL. Khi dùng soạn tin trên mạng Dial-Up thời gian hiển thị công cụ khá chậm.

· Tự động phát hiện ra trình duyệt đang dùng và tùy biến cho thích hợp.

· Hỗ trợ phát triển với hầu hết các ngôn ngữ lập trình web thông dụng hiện nay: ASP, ASP.NET, Java, ColdFusion, Perl, Php, Java Script.

· Đối với nhà lập trình, nó dễ tích hợp và tùy biến. Đối với người sử dụng, nó dễ dùng bởi tính thống nhất và quen thuộc trong giao diện tương tự như MS Word.

Tích hợp FCKeditor bằng ngôn ngữ ASP

a) Giải nén công cụ vào thư mục FCKeditor trong thư mục chứa trang web mã. Ví dụ thư mục chứa trang web mã là (nsdit): nsdit\FCKEditor\Editor.

Tích hợp vào trang web: b) Xem Mã nguồn mẫu.

c) Sửa lại đoạn mã định dạng của FCKeditor về phần Insert/Upload ảnh

Đây là phần chỉnh sửa khó nhất. Tôi xin trình bày cách đơn giản nhất để chỉnh sửa đường dẫn upload là lấy ảnh từ một thư mục tùy ý (mặc định công cụ quy định tải vào thư mục wwwroot trên server IIS). Giả sử, bạn quy định một thư mục chứa ảnh pics ngay trong thư mục gốc nsdit: nsdit\pics

- Sửa file config.asp trong nsdit\FCKeditor\editor\filemanager\browser\default\connectors\asp

Gán giá trị của biến ConfigUserFilesPath thành

ConfigUserFilesPath = “../../../../../../../pics/”

- Sửa file fck_image.js trong nsdit\FCKeditor\editor\dialog\fck_image, tại hàm SetUrl( url, width, height, alt), gán giá trị.
GetE(txtUrl).value =oEditor.FCKConfig.BasePath + “filemanager/browser/default/connectors/asp/” + url;

d) Lấy nội dung của FCKeditor

Bạn lấy nội dung của FCKeditor để lưu vào trong cơ sở dữ liệu thông qua

Dim noidung

Noidung=trim(Request.Form(“FCKeditor1”))

Như vậy bạn đã hoàn thành xong quá trình tích hợp. Bạn có thể tải về FCKeditor phiên bản mới nhất tại địa chỉ http://www.fckeditor.net, trong mã nguồn có đầy đủ các ví dụ hướng dẫn cách sử dụng và tích hợp. Mong rằng cộng đồng mã nguồn mở và mỗi người sử dụng cùng đóng góp xây dựng để chương trình ngày càng phát triển xứng đáng là công cụ soạn thảo trực tuyến miễn phí tốt nhất.

Mã nguồn mẫu - Tích hợp FCKeditor vào trang web
Code:
<!-- #INCLUDE file=”FCKeditor/fckeditor.asp” -->
<html>
<head>
</head>
<body>
<form action=”sampleposteddata.asp” method=”post” target=”_blank”>
<%
Dim sBasePath 
'bien nay nhat thiet phai khai bao
sBasePath = Request.ServerVariables(“PATH_INFO”)
sBasePath = Left( sBasePath, InStrRev( sBasePath, “/” ) )
sBasePath=sBasePath & “FCKeditor/”
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.BasePath = sBasePath
'chỉ ra đường dẫn đến giao diện mặc định là Office2003
oFCKeditor.Config(“SkinPath”) = sBasePath + “editor/skins/office2003/”
'chỉ ra ngôn ngữ mặc định là tiếng Anh. Bạn cũng có thể thay đổi ra ngôn ngữ tiếng Việt khi tạo ra một file Việt hóa của en.js rồi lưu thành vn.js
oFCKeditor.Config(“AutoDetectLanguage”) = false
oFCKeditor.Config(“DefaultLanguage”) = “en” 'chọn vn nếu có file tiếng Việt
'Bạn có thể chọn chế độ hiển thị các tính `năng của toolbar đầy đủ hoặc rút gọn `nhằm tăng tốc độ hiển thị, tốc độ tải `của trang web.
oFCKeditor.ToolbarSet=”Default”
oFCKeditor.ToolbarSet=”Basic”
'Nội dung hiển thị được gán vào thuộc `tính Value.
oFCKeditor.Value = “This is some <strong>sample text</strong>. You are using <a href=””http://www.fckeditor.net/””>FCKeditor</a>.”
'tạo ra đối tượng và hiển thị nó
oFCKeditor.Create “FCKeditor1”
'như vậy bạn sẽ thấy đối tượng FCKeditor thay thế cho TextArea hay dùng
%>
<br>
<input type=”submit” value=”Submit”>
</form>
</body>
</html>
Ngô Sơn Dương

CÁC CHỦ ĐỀ KHÁC: