HomeHướng dẫn WordPress

Khám phá Gutenberg Block Collection giúp bạn thiết kế nội dung tốt hơn

Like Tweet Pin it Share Share Email

Chắc bạn đã nghe tới cái tên Gutenberg. Đó chính là editor mới sẽ thay thế editor bạn đang dùng trong WordPress. 

Theo kế hoạch việc này sẽ xảy ra ở bản WordPress 5.0. Còn hiện tại Gutenberg vẫn đang được phát triển ở plugin riêng.

Do vậy để trải nghiệm editor này bạn cần cài đặt và active plugin này.

Trước mình đã có bài hướng dẫn Gutenberg để giúp bạn có được những trải nghiệm cơ bản về editor mới này.

Về cơ bản, Gutenberg dựa trên khái niệm block. Ý tưởng này cũng không có gì xa lạ nếu bạn từng sử dụng bất kỳ một page builder nào ngoài kia.

Việc của bạn chỉ là lắp ghép block lại thôi.

Các page builder đều có những module cơ bản bản đáp ứng nhu cầu phổ biến. Ngoài ra bạn có thể bổ sung thêm module cho phù hợp với nhu cầu thông qua plugin, extension bên thứ ba hoặc trực tiếp từ nhà phát triển page builder.

Gutenberg cũng như vậy.

Bài viết này cung cấp cho bạn thông tin về một vài block collection hữu ích. Block collection ở đây có thể là một tập hợp block có liên hệ với nhau.

Khi bạn bổ sung thêm block collection thì phần editor sẽ có nhiều thêm block mới bên cạnh những block mặc định mà Gutenberg cung cấp. Do vậy nội dung mà bạn thiết kế sẽ chuyên nghiệp hơn. 

Bên dưới bạn sẽ biết được 3 Block Collection ngon nhất của Gutenberg. 

1. Atomic Blocks

Trong số các block collection của Gutenberg hiện nay, Atomic Block vẫn là tùy chọn trông tinh tế nhất.

Bạn sẽ cảm nhận được điều đấy ngay khi bạn cài đặt. Bởi vì bạn sẽ nhìn thấy một trang welcome trông khá đẹp mắt như thế này:

atomic blocks 1

​Hiện tại Atomic Blocks có 11 block tất cả ví dụ như post grid, container, testimonial, inlince notice vân vân. 

Ngay khi bạn cài đặt và kích hoạt Atomic Blocks bạn sẽ nhìn thấy một tab mới có tên gọi là Atomic Blocks khi bạn add mới một block mới trong Gutenberg editor. ​

atomic blocks 2

Nhìn chung Atomic Blocks là một phần mở rộng tuyệt vời cho Gutenberg. Tập hợp block của nó giúp bạn dễ dàng thiết kế nội dung cho nhiều tình huống khác nhau. 

2. Stackable

Ngay sau khi cài đặt và kích hoạt Stackable bạn sẽ có 17 block mới được bổ sung vào editor. Trong đó có một số block giống như những block mà Atomic Blocks cung cấp. 

stackable 1

Nói về số lượng block Stackable vẫn vô đối ở thời điểm này. Nó chính là collection lớn nhất trên thị trường. 

Quan trọng hơn, tất cả các block của thằng này trông rất ngon.

Thậm chí nhà phát triển còn bổ sung thêm nhiều tùy chọn tùy biến nâng cao, chẳng hạn như cho phép bạn thay đổi ảnh nền, hoạt hình và nhiều thứ hay ho khác.

Atomic Blocks và Stackable có hai cách tiếp cận khác nhau với việc phát triển block cho Gutenberg. Thằng đầu tiên Atomic Blocks theo triết lý đơn giản mà Gutenberg đang hướng tới. Trong khi đó Stackable là tùy chọn ngon hơn vì nó bắt chước những thứ bạn từng thấy ở các page builder bây giờ.

3​. Editor Blocks

Editor Block tương đối mới mẻ trong mảng Block Collection của Gutenberg. Plugin này chưa có nhiều lượt cài đặt cũng như đánh giá.

Tuy nhiên, sau khi trải nghiệm với block collection này, nó cũng có nhiều tính năng hay ho mà bạn nên trải nghiệm.

editor block 1

Ở thời điểm này, Editor Block có 10 block trong đó nổi bật như pricing table, team member hay hero section. 

Địa chỉ bạn có tìm những block riêng lẻ của Gutenberg

Nhược điểm của những collection như trên là:

Bạn có thể chỉ xài một vài block mà nó cung cấp. Trong khi nhiều block khác bạn chẳng động tới.

Nói cách khác, nhiều khi bạn chỉ muốn bổ sung những block mà mình thật sự cần.

Trong tình huống này bạn nên ghé thăm Gutenberg Block Library. Đây là nơi tốt nhất giúp bạn tìm kiếm block bạn cần.

gutenberg block library

​Thư viện này chỉ là nơi lưu trữ thông tin về block. Khi bạn click nút Download bạn sẽ chuyển sang trang plugin bên WordPress.org. 

5
Để lại bình luận

2 Comment threads
3 Thread replies
2 Followers
 
Most reacted comment
Hottest comment thread
3 Comment authors
Recent comment authors
newest oldest
Guest

cái này mới nhìn khó thế nhỉ, đang quen giao diện cũ thấy khá ok rồi mà nhỉ

Guest

Thinh ơi cho mình hỏi chút, theme beginer mình việt hóa cái nút “read more” thành “xem thêm”… ở chỗ nào vậy thịnh

Scroll Up
Share This