Tùy chỉnh cài đặt – hướng dẫn sử dụng TinyMCE [WordPress]

Thông thường khi bạn nhấn enter, trình soạn thảo TinyMCE trong wordpress sẽ tự động thêm thẻ p và br để tạo dòng mới.

Sử dụng thẻ ngắt dòng br thay vì p

Mặc định TinyMCE wordpress tạo thẻ p (paragraph) mỗi khi bạn nhấn enter xuống dòng. Điều này gây khó khăn cho những ai chuyển từ nền tảng blogging/social media khi viết nội dung.

Đoạn đầu tiên sử dụng dòng ngắt br tag và đoạn thứ 2 mỗi dòng chứa trong thẻ p. Hai cách này đều sử dụng trong wordpress editor, khi bạn viết xong nội dung của 1 dòng bạn nhấn phím Shift+Enter để sang dòng mới, tuy nhiên nếu là một đoạn chúng ta sẽ không sử dụng ký tự ngắt dòng br thông thường mà phải sang đoạn văn mới với thẻ bao p cho đoạn đó. Để làm điều này, đơn giản hơn bạn chỉ nhấn Enter là wordpress tự động tạo thẻ p bao nội dung đoạn cho bạn.

Tạo br gán cho lệnh ngắt đoạn (paragraph)

Nhiều khi bạn xuống dòng thôi, không cần ký tự ngắt đoạn, bạn mất thời gian nhấn thêm phím shift? Bạn có thể loại bỏ cách sử lý này, bằng cách thêm thiết lập cấu hình cài đặt cho Editor. Mẹo sau đây giúp bạn thay thế ký tự p bằng thẻ br bằng cách thiết lập giá trị false cho option forced_root_block. Chúng ta sử dụng filter tiny_mce_before_init. Thêm đoạn code sau vào functions.php

/* Filter Tiny MCE Default Settings */
add_filter( 'tiny_mce_before_init', 'my_switch_tinymce_p_br' );
 
/**
 * Switch Default Behaviour in TinyMCE to use "<br>"
 * On Enter instead of "<p>"
 * 
 * @link http://shellcreeper.com/?p=1041
 * @link http://codex.wordpress.org/Plugin_API/Filter_Reference/tiny_mce_before_init
 * @link http://www.tinymce.com/wiki.php/Configuration:forced_root_block
 */
function my_switch_tinymce_p_br( $settings ) {
    $settings['forced_root_block'] = false;
    return $settings;
}

Lưu ý: Đoạn code trên chỉ làm việc với WordPress 3.9+

Nâng cấp TinyMCE

Mọi tính năng nếu muốn nâng cao hơn, bạn gặp rắc rối với hàng tá API tuy nhiên bạn nên dùng đến plugin giúp bạn làm một công việc nhất định ví dụ như chúng ta vẫn đang sử dụng Contact Form 7 để tạo form liên hệ trong wordpress… Để sử dụng và tùy biến nhiều hơn MCE bạn có thể nhờ đến plugin TinyMCE Advanced.

Nếu bạn thấy bài viết này hữu ích, hãy chia sẻ với bạn bè bằng cách nhấn nút chia sẻ ở bên dưới. Theo dõi chúng tôi trên Twitter và Facebook