Đánh giá Gutenberg: Điểm mạnh và điểm yếu của WordPress Editor Mới

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Đánh giá Gutenberg: Điểm mạnh và điểm yếu của WordPress Editor Mới Một nhóm các nhà phát triển và một đội ngũ cộng tác viên cũng nghĩ như vậy và đã bắt đầu làm việc để cập nhật tăng trải nghiệm viết bài của WordPress. Dự án đầy tham vọng của họ được gọi là Gutenberg.

Giới thiệu

Trình soạn thảo bài viết và trang web đi kèm với WordPress đã được sử dụng quá lâu vì thế đã lới lục nâng cấp?

Một nhóm các nhà phát triển cùng một hàng ngũ cộng tác viên cũng nghĩ như vậy và đã bắt đầu làm việc để cập nhật tăng dùng thử viết bài của WordPress. Dự án đầy tham vọng của họ được xem là Gutenberg. Nó nhằm mục đích để thay thế tận gốc trình biên soạn mặc định trong tương lai gần và đang được thử và thử nghiệm như là một plugins trước khi cũng có thể có thể tích hợp vào phần lõi của WordPress.

Gutenberg là gì?

Gutenberg là một trình soạn thảo bài viết và trang mới cho WordPress. Dự án này được đặt tên theo Johannes Gutenberg, người đã giới thiệu máy in cơ khí và bắt đầu cuộc cách mạng in ấn ở châu Âu. Phát minh của ông khiến cho kiến thức và tin tức có thể tiếp cận được với quần chúng và bắt đầu cuộc cách mạng xã hội quan trọng. Tương tự, các nhà phát triển muốn khiến cho bố cục tiên tiến dễ tiếp cận hơn với người dùng WordPress trung bình.

Trọng tâm của Gutenberg là bộc lộ mọi thứ các nội dung như các blocks và định vị layouts bài viết trực tiếp trong trình soạn thảo. Trình soạn thảo bài viết hiện tại của WordPress chạy tự do giống như bất kỳ ứng dụng giải quyết văn bản nào, và các layouts nội dung được định nghĩa trong các templates sử dụng HTML và CSS.

Với Gutenberg, bạn sẽ không càng phải biết về HTML hoặc CSS để tạo 2 blocks nội dung bên cạnh nhau, khiến cho người sử dụng bình thường cũng có thể có thể tiếp cận với các layouts phức tạp hơn. Bạn chỉ cần dễ dàng bấm Align Left trên 1 block và Align Right trên block còn sót lại hoặc bạn cũng có thể có thể một block được tạo sẵn với tối đa 4 cột cạnh nhau. Bạn cũng cũng đều có thể đơn giản di chuyển block lên hoặc xuống dưới khối văn bản.

Soạn thảo văn bản của Gutenberg

Các nhà phát triển cũng muốn thay thế việc sử dụng shortcodes khi thêm các nội dung phong phú vào bài viết và trang. Điều này có tức là việc nhúng nội dung bên ngoài trở nên đơn giản hơn, với những tùy chọn cụ thể để thêm video trên YouTube, bài viết Reddit, Tweets, Spotify và nhiều hơn thế nữa. Điều này đơn giản hóa các quá trình mà thường thì sẽ yêu cầu plugin hoặc tạo mã nhúng cụ thể trên trang web bạn đang nhúng. Hiện tại có 34 trang web được hỗ trợ.

Các lựa chọn khác của Gutenberg

Nếu bạn không tìm thấy tùy chọn để nhúng vào liên kết của một website nào đó, hãy dễ dàng là “dán” URL của nó vào trình soạn thảo và Gutenberg sẽ làm điều còn lại cho bạn. Thật đơn giản phải không?!

Gutenberg đang nằm ở phía trong thời kì phát triển và hoàn thiện, tất nhiên sẽ được rất nhiều lỗi thậm chí là hiện cảnh báo chưa nên dùng cho website đang chạy. Tuy nhiên, nó 15 bản dịch không trùng lặp (kể cả tiếng Anh) sẽ giúp bạn đơn giản lựa chọn sử dụng và giúp tìm các lỗi.

Cài đặt Gutenberg

Tuy đang còn trong thời kì phát triển nhưng Gutenberg đã được đưa lên thư viện Plugins của WordPress. Bạn có thể cài đặt chúng một cách dễ dàng như những plugins khác thông qua trang quản lý Admin.

Tải gutenberg từ WordPress Plugin Directory

Phiên bản hiện tại là 1.7.0, tương thích với WordPress từ 4.8 trở lên. Chúng mình đã thử nghiệm trên WordPress bản 4.8.3.

Thử nghiệm Gutenberg

Sao khi cài đặt và kích hoạt Gutenberg, bấm Add New ở mục Posts bạn sẽ vấn thấy trình soạn thảo cũ của WordPress. Tuy nhiên, bạn sẽ thấy thêm một menu mới Gutenberg ở phía trái màn hình. Do vẫn còn đang nằm ở trong giai đoạn phát triển, các nhà lập trình chưa muốn thay thế hẳn trình soạn thảo cũ cho đến khi Gutenberg thật sự sẵn sàng, tất cả các lỗi đã được sửa, và nó đã được 1 lượng lớn người sử dụng tham gia thử nghiệm.

Gần đây, các nhà phát triển Gutenberg đã sửa đổi thời gian để chuyển đổi từ plugins thành trình soạn thảo mặc định. Bản phát hành chánh tiếp theo của plugin được thiết lập cho tháng 11 trùng với việc ban hành WordPress 4.9. Trước khi trở phần tử nào của WordPress Core, các nhà phát triển sẽ đưa ra một đề xuất để sáp nhập vào 12/2017 nơi mà các trình soạn thảo sẽ có xem xét kỹ hơn. Việc chuyển đổi cuối cùng dự kiến sẽ là một phần của bản cập nhật WordPress 5.0, có khả năng vào năm 2018.

Khi chọn vào menu Gutenberg ở phần điều hướng admin bạn sẽ thấy có thêm 2 menu phụ là New Post Demo . Khi chọn vào menu Demo , bạn sẽ có mở ra một bài viết mới với tất cả các tính năng của trình soạn thảo mới: văn bản, hình ảnh, căn chỉnh blocks, các nội dung nhúng,…

Trang mẫu Gutenberg

 

Bạn cũng sẽ thấy thêm một nút Gutenberg ở danh sách các bài viết hoặc trang để cũng đều có thể chọn lựa sử dụng trình soạn thảo mới.

Nút Gutenberg bên dưới trang đã tồn tại

Một điều cần lưu ý là nếu bạn chỉnh sửa bài viết hoặc trang đã được tạo bằng trình chỉnh sửa thông thường, tất cả nội dung của bạn sẽ xuất hiện trong block, nhưng các block hình như chưa được gán các vai trò chính xác. Nhấp vào văn bản này cho biết đường viền màu xám bao quanh nó cho biết đó là một block, nhưng slidebar không cho bất kỳ lựa chọn nào cho đoạn văn bản và không chỉ vậy là trình biên tập TinyMCE đầy đủ sẽ xuất hiện phía trên block.

Thật thú vị lúc không có liên kết để tạo một trang mới, nhưng bạn có thể chỉnh sửa các trang hiện có. Tham khảo trang dự án trên Github của plugin cho thấy họ hiện không làm việc để thêm một liên kết tạo một trang vào bây giờ nhưng nó được lên kế hoạch cho những bản phát hành trong tương lai.

Hiện tại, không có trang cài đặt nào để đặt bất kỳ giá trị mặc định cho các bài viết mới. Bạn sẽ thật cần nhấp vào Pending review trước khi xuất bản bất kỳ bài viết nào.

Trình Editor mới

Trình soạn thảo mới rất trực quan, có thể sẽ gây nhiều nhầm lẫn lúc đầu do tất cả đều được ẩn đi cho tới khi nào bạn thật sự cần nó. Sẽ không có thanh công cụ TinyMCE trong Gutenberg, nội dung của bài viết sẽ hiển thị được không ít hơn trên màn hình. Điều này giúp tạo bản xem trước của bài viết tốt hơn trình soạn thảo cũ. Tất cả nội dung trong cửa sổ soạn thảo được tập trung với nhiều khoảng trống ở hai bên. Nội dung hầu như giống hệt nhau trong trình soạn thảo và khi đã xuất bản.

Ở thanh slidebar bên phải, có một tab Block liệt kê tất cả các lựa chọn có thể có cho block hiện đang được chọn. Các tuỳ chọn cho 1 block văn bản gồm có chữ in hoa, kích cỡ font chữ (có thể gõ bất kỳ số nào vào, trình biên soạn hiện tại chỉ có chọn lựa thả xuống), màu nền cho khối văn bản (tự động áp dụng cho thẻ p trong mã HTML) và bố trí blocks.

Gutenberg Block Section and all it's optons

Khi sử dụng trình soạn thảo mặc định của WordPress trên một màn hình nhỏ, tất cả các tùy chọn thiết lập văn bản sẽ được hiển thị làm chiến gần hết nội dung, đòi hỏi bạn cần tốn rất nhiều thao tác kéo lên xuống.

Editor thêm block mới cho Hostinger

Ở trình soạn thảo Gutenberg, các thiết lập meta và blocks (slidebar bên phải) sẽ có ẩn đi và sẽ xuất hiện ở trên khung soạn thảo lúc bấm vào nút Thiết lập. Sau khi sử dụng một thời gian, các thanh công cụ sẽ xuất hiện theo ngữ cảnh tương ứng với thao tác bạn có thể thực hiện.

Thêm Blocks mới

Để thi hành thêm block mới hoặc nhúng các nội dung vào, sẽ có một biểu trưng + bên dưới tất cả những blocks hiện đang tồn tại. Đồng thời cũng sẽ có 1 nút Chèn ở phần bên trên của mỗi trang. Thanh trên cùng được dán vào đầu trình soạn thảo, do đó nút Chèn luôn luôn được nhìn thấy. DI chuyển chuột đến + sẽ hiện nhanh các tùy chọn cho đoạn văn bản, hình ảnh thường sử dụng nhất cho blocks.

Nút thêm của Gutenberg

Menu điều hướng mới có dạng tab gồm các trang Recent , Blocks Embeds . Menu này cũng có 1 ô tìm kiếm luôn được hiển thị để hỗ trợ tìm kiếm các tác vụ cần thiết. Các nhà phát triển đang nỗ lực để hoàn thiện thêm các tác vụ này theo bối cảnh dựa trên menu.

  • Recents : lúc bấm nút + hoặc nút Chèn, một bản kê 8 tác vụ gần nhất cho blocks và nội dung nhúng sẽ có hiển thị
  • Blocks : một danh sách các blocks được chia làm bốn headings
    • Common Blocks – heading, paragraph, image,…
    • Formatting – table, preformatted text, code,…
    • Layout – seperators, buttons,…
    • Widgets – latest posts, categories, shortcodes.
  • Embeds : bạn có thể nhúng nội dung từ một danh sách dài các trang web thông dụng như Reddit, YouTube, Instagram và có nút Nhúng chung, nơi bạn chỉ cần nhập URL hợp thức và trình biên tập sẽ thực hành phần còn lại, nó hoạt động như một tính năng tự động phát hiện.

Di chuyển & Căn chỉnh Blocks

Để di chuyện block lên hoặc xuống văn bản, di chuyển chuột sang phía bên trái của block, bạn sẽ có chọn lựa bấm di chuyển.

di chuyển block lên và xuống

 

Khi tab Block được chọn, bạn sẽ thấy tùy chọn bên dưới sidebar cấp phép di chuyển sang trái, phải hoặc canh giữa. Như bạn thấy trong ảnh chụp màn hình bên dưới, việc căn chỉnh chưa làm việc chính xác so với việc bạn tạo bằng HTML và CSS của riêng bạn. Nếu văn bản trong 1 block dài hơn các block khác, nó có khuynh hướng quấn theo một số cách khác thường.

Căn chỉnh blocks

Visual Editor và Text Editor

Khi sử dụng trình soạn thảo văn bản cũ, bạn sẽ có tùy chọn giữa Visual Editor và Text Editor dùng liên kết ở phía trên bên phải khung soạn thảo. Với trình Visual Editor, sẽ có một thanh công cụ hiển thị các tính năng liên quan đến block đang được chọn. Chuyển sang Text Editor bạn sẽ thấy được các cách lập trình được dùng thực hiện được hiệu ứng.

Gutenberg Text Editor Look

 

Từng block được tạo bởi Gutenberg đều được đánh dấu bằng các đoạn chú giải HTML. Điều này giúp bạn tận dụng được lợi ích khi sử dụng Gutenberg để tạo layouts nhưng vẫn muốn sử dụng trình soạn thảo cũ.

Tính năng bổ sung của Gutenberg

Gutenberg thêm một số tính năng mới cho các bài viết của bạn, bao gồm các blocks hoàn toàn mới và các tùy chọn bổ sung thêm cho những tính năng hiện có của WordPress.

Mục lục

Gutenberg sẽ xác định tất cả những blocks heading (

Từ khóa bài viết: dinhthuanit.com,

Bài viết Đánh giá Gutenberg: Điểm mạnh và điểm yếu của WordPress Editor Mới được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

Bài Viết Liên Quan


Bài Viết Khác


Quảng cáo
Ads_ngang