Web design

Khung soạn thảo BBcode Editor cho WordPress (Không dùng Plugin)

Mặc định phần bình luận của WordPress khá đơn giản, thường thì chúng ta chỉ cần đưa text vào thôi, nhưng để...

Written by Tú Cao · 2 min read >
Demo BBcode Editor cho Wordpress

Mặc định phần bình luận của WordPress khá đơn giản, thường thì chúng ta chỉ cần đưa text vào thôi, nhưng để cho người dùng thuận tiện hơn thì chúng ta cần làm thêm thanh Toolbar để tiện sử dụng. Nếu dùng bộ soạn thảo đầy đủ thì quá nhiều, không cần thiết, thậm chí nếu làm không tốt còn tiềm ẩn nhiều nguy cơ. Bài viết này mình sẽ hướng dẫn các bạn thêm 1 bộ soạn thảo đơn giản là BBcode Editor (nó thường thấy trên các diễn đàn)

Demo BBcode Editor cho WordPress
Demo BBcode Editor cho WordPress

 

Vì sao lại dùng BBcode editor ?

Nó phù hợp với mục đích của mình, khi ở khung soạn thảo mình chỉ muốn người dùng chèn thêm link, in đậm, in nghiêng và đặc biệt là nhúng được ảnh vào phần bình luận. Bởi vậy BBcode cho phần comment với mình là đủ.

Các plugin trên mạng hiện tại thì không sử đụng được khi nó đã lên bảng 4.x. Có 1 plugin trả phí là Mega BBCODE Editor có giá 13 USD.

Tích hợp BBcode editor cho comment – bình luận WordPress

Bước 1: Bạn tải: taeditor_v1_4

Bước 2: Tiếp đến giải nén ra thư mục chứa theme của bạn: wp-content/themes/your theme/

(Bạn sẽ tải thêm thư mục editor lên trên website)

Bước 3: Tại thư mục chưa theme của bạn, bạn tìm file comments.php

Tiếp đến tìm nội dung

[code]<?php comment_form(); ?>[/code]

Bạn xóa nó đi và thay thế bằng đoạn sau:

[code]<?php comment_form( array(
‘comment_field’ => ‘<p class=”comment-form-comment”><label for=”comment”>’._x( ‘Comment’, ‘noun’ ).'</label>
<script type=”text/javascript” src=”‘.get_bloginfo(‘template_directory’).’/editor/ed.js”></script>
<link rel=”stylesheet” type=”text/css” href=”‘.get_bloginfo(‘template_directory’).’/editor/styles.css” />
<script>edToolbar(\’comment\’);</script>
<textarea id=”comment” name=”comment” cols=”45″ rows=”12″ aria-required=”true”></textarea></p>’,
) ); ?>[/code]

Bước 4: Bình thường vậy là xong, nhưng do mình tích hợp vào WordPress nó sẽ bị lỗi mấy cái icon của bbcode editor do nó không thể xác định được đường dẫn, cách đơn giản thì ta làm như say.

Mở và sửa file: editor/ed.js

Chú ý đoạn:

[code]    document.write(“<img class=\”button\” src=\”/images/bold.gif\” name=\”btnBold\” title=\”In đậm\” onClick=\”doAddTags(‘<strong>’,'</strong>’,'” + obj + “‘)\”>”);[code]

Bạn thay /images/bold.gif\ bằng đường dẫn chính xác

VD:

https://nguyencaotu.com/wp-content/themes/mytheme/editor/images/bold.gif

Vậy là xong, đến đây thì bạn đã có thể có cho mình một bộ bbcode editor đơn giản nhưng đủ dùng. Và mình cũng khỏi phải mua với giá 13 USD vì nó không thực sự cần thiết.

Chúc các bạn thành công.

Written by Tú Cao
Tôi là Tú Cao. Tôi chia sẻ và dạy mọi người cách kinh doanh trên Internet. Bởi vì "Hạnh phúc không phải là nhận, hạnh phúc chính là sự cho đi". Bài viết này dựa trên quan điểm, hiểu biết của Tôi. Bạn tự cân nhắc và chịu trách nhiệm khi làm theo, nếu nó hữu ích với bạn hãy Mời Tú Cao một tách CÀ PHÊ. Profile

One Reply to “Khung soạn thảo BBcode Editor cho WordPress (Không dùng Plugin)”

  1. xin chào các bạn!
    Cho mình hỏi chút, mình có vấn đề muốn các bạn hỗ trợ chút. Mình có website về nhôm kính là https://hoangphiglass.vn mình muốn hỏi xem web này đã chuẩn SEO chưa và cấu trúc của trang đã ổn chưa vậy.
    xin các bạn cho ý kiến giúp mình với ah. Xin cảm ơn các bạn!!
    Lê Hòang Địa chỉ Văn Phú- Hà Đông – Hà Nội

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *