Giới thiệu toàn tập về Gutenberg – trình soạn thảo mới của WordPress

Rate this post

Trong nhiều năm, WordPress sử dụng trình soạn thảo mặc định và nó ngày càng thiếu đi khả năng linh hoạt xử lý dữ liệu người dùng nhập vào. Gutenberg là cuộc cải cách với tầm nhìn thay đổi và mang lại cho người dùng cơ hội thêm nhiều nội dung phong phú trong website.

Gutenberg là gì?

Gutenberg là trình soạn thảo mới của WordPress. Nó được đặt theo tên của Johannes Gutenberg, người phát minh ra máy in di động hơn 500 năm trước. So sánh với trình soạn thảo hiện tại (TinyMCE), Gutenberg mang lại những trải nghiệm phong phú hơn hẳn. Thay vì mất công để tạo ra các shortcodes và HTML để một bố cục hoạt động, Gutenberg mang tới mục tiêu là làm nó đơn giản hơn, đặc biệt cho những ai mới bắt đầu với WordPress. Nó được gọi là “little blocks”, tức những bố cục nhỏ.

Tuy vậy, Gutenberg chưa phải lựa chọn tốt nhất ở thời điểm này dành cho các lập trình viên, do đang trong giai đoạn thử nghiệm. Chúng ta chủ yếu xem những cải tiến và tính năng gì có trong Gutenberg trong bài viết này.

Cài đặt Gutenberg

Mặc dù dự định là Gutenberg sẽ trở thành trình soạn thảo mặc định, nhưng điều này sẽ chỉ xảy ra ở các phiên bản WordPress 5.0+. Với phiên bản WordPress 4.9.x trở xuống, bạn cần vào plugin và cài đặt Gutenberg như một plugin bình thường trong thư viện WordPress.

Cài đặt Gutenberg trong thư viện plugin WordPress

Sử dụng Gutenberg

Sau khi cài đặt, bạn sẽ nhìn thấy liên kết bên dưới mỗi bài viết giúp bạn mở trực tiếp trình soạn thảo Gutenberg trong nội dung bài viết. Nội dung đã có sẵn sẽ không mất đi mà được chuyển sang dữ liệu đồng bộ với Gutenberg như là một văn bản bình thường.

Liên kết mở Gutenberg

Ngoài ra, Gutenberg còn thêm một menu bên trái có chứa demo và liên kết tới tài liệu hướng dẫn. Rất tiếc, các nội dung này đều là tiếng Anh.

Menu Gutenberg trong WordPress

Đặt cạnh nhau giữa trình soạn thảo hiện tại và Gutenberg, ta có thể quan sát thấy nhiều cải tiến về cách thức sử dụng:

So sánh Gutenberg và TinyMCE

Ẩn hiện Post Settings

Để bố cục không bị thu hẹp quá khi sửa nội dung bài viết, bạn có thể nhấp vào “Post Settings” để ẩn/hiện cột bên phải.

Ẩn Post Settings trong Gutenberg

Chuyển đổi giữa chế độ Visual (nhìn để sửa) và Text (code)

Việc chuyển đổi giữa phần code và phần visual cũng được chuyển sang bên trái, tương tự như trong trình soạn thảo cũ. Chỉ có khác là vị trí nằm bên phải mà thôi.

Chuyển đổi giữa code và nhìn để sửa trong Gutenberg

Di chuyển các khối

Khi bạn đang chọn một khối, nó bao gồm cả tuỳ chọn cho phép di chuyển khối lên trên hoặc xuống dưới. UI này khá giống những gì bạn làm trên medium.com.

Di chuyển các khối trong Gutenberg thuận tiện hơn nhiều.

Toolbar mới từ Gutenberg

Một điều bạn nhận thấy là các thanh công cụ trong TinyMCE, trình soạn thảo cũ trước đây, đã hoàn toàn biến mất và thay thế hoàn toàn bằng menu dropdown với các khối bạn có thể thêm vào.

Thêm block mới trong Gutenberg

Điểm mạnh của Gutenberg

  1. Gutenberg mang lại mức độ tuỳ biến bố cục phong phú hơn.
  2. Với những ai đang sử dụng blog Medium.com, Gutenberg chắc hẳn sẽ có nhiều thứ tương tự.
  3. Làm việc với các khối (block) khá thú vị và có nhiều tuỳ chọn căn chỉnh giúp tương thích đa dạng các loại hình màn hình từ nhỏ đến lớn.
  4. Gutenberg hoạt động tốt trên mobile.
  5. Có khả năng mở rộng các block mới thông qua các chủ đề và plugin dành cho lập trình viên.
  6. Dễ sử dụng cho người mới làm quen.

Điểm yếu của Gutenberg

  1. Mặc dù là công nghệ mới, nhưng Gutenberg lại chưa hỗ trợ Markdown.
  2. Một vài block vẫn chưa hoàn toàn dễ sử dụng.
  3. Việc hỗ trợ meta boxes từ tháng 10/2017, nhưng vẫn làm mối quan ngại với hầu hết developer.
  4. Không hỗ trợ bố cục cột responsive. Mặc dù tính năng này đang beta, nhưng sớm muộn nó cũng cần phải sẵn sàng.
  5. Tính tương thích với các plugin và giao diện cũ là điều đáng lo ngại. Hầu hết nó lại thuộc về phần việc của các developer. Có thể sẽ chưa sẵn sàng và cần tạm sử dụng trình soạn thảo cũ cho tới khi tích hợp hoàn toàn.
  6. Hỗ trợ accessibility (dành cho những người khuyết tật) cũng đáng lo ngại.

Những điểm cần lưu ý

Gutenberg một khi đã phát hành chính thức trong phiên bản WordPress 5+, nó sẽ thay thế trình soạn thảo mặc định (TinyMCE). Nó không phải TUỲ CHỌN, tức bạn có thể chọn hay không chọn.

Nếu bạn chưa cài Gutenberg và muốn thử luôn, bạn có thể thử tại đây.

7 bình luận về “Giới thiệu toàn tập về Gutenberg – trình soạn thảo mới của WordPress”

  1. Gutenberg dùng khá thích. Nó nhắm đến người dùng cuối nên chắc ko có vụ hỗ trợ Markdown đâu :). Còn meta box thì hỗ trợ ngon nghẻ hết rồi, chỉ là plugin nào về custom fields hỗ trợ tốt Gutenber thôi. Dùng Meta Box của anh thì hỗ trợ hết rồi đấy. ACF thì vẫn chưa thì phải.

    Hiện tại theo anh hiểu thì nó ko ảnh hưởng giao diện gì cả. Vì tất cả vẫn nằm trong content. Chỉ là các theme có hỗ trợ Gutenberg để dùng hết sức mạnh của nó ko thôi. Nếu theme ko hỗ trợ thì nó cũng gần như editor cũ.

    Trả lời

Viết một bình luận


Chuyên gia về Web
Bạn muốn làm việc với dịch vụ website do chúng tôi triển khai?
Gọi tư vấn 0982.90.4343
Chuyên gia về Web
Bài viết liên quan

07/04/2024

PHP: Format date dd/mm/yyyy và so sánh với Date hiện tại
Một vấn đề hay gặp trong quá trình xử lý PHP datetime là tình huống format date từ định dạng...

02/01/2024

Fix lỗi npm không thể cài các package devDependencies
Khi cài đặt dự án,  có lúc bạn sẽ cài mãi cũng không đủ các package npm, đặc biệt là...
Gọi file PHP trong WordPress

19/09/2023

Cài đặt và sử dụng WP-CLI trên môi trường Linux
Trên một số môi trường Hosting có thể cung cấp SSH hoặc Terminal access, song không có sẵn WP-CLI để...
Import database MySQL lớn trên môi trường Docker

06/08/2023

Import database MySQL lớn trên môi trường Docker
Mình sử dụng EasyPanel để quản lý các Docker và build môi trường app. Nay gặp tình huống phải import...