[Gutenberg ] Tổng quan về Gutenberg trong WordPress
https://wolfactive.dev/gutenberg-tong-quan-ve-gutenberg-trong-wordpress/
[Gutenberg ] Tổng quan về Gutenberg trong WordPress
Chào mọi người đến với Series lập trình block Gutenberg trong WordPress. Series này giành cho những bạn thích Wordpess nhưng muốn tìm cảm giác làm theme, giao diện WordPress theo hướng mới mẻ không bị nhàm chán, thích làm giao diện trong CMS và trang web với React.
Tổng quan về Gutenberg
Gutenberg là gì ?
Gutenberg là trình soạn thảo văn bản mới ở dạng khối của WordPress và trở thành Editor mặc định từ phiên bản WordPress 5.0. JavaScript được tạo ra nhằm để người dùng có thể tạo một trang web bằng cách thêm các khối (block) để ghép thành 1 trang web hoàn chỉnh. Các bạn có thể trải nghiệm tại đây: https://wordpress.org/gutenberg/
Gutenberg được phát triển nền React JS nên cũng khá hợp cho nhưng bạn nào thích React và WordPress. Để có thể lập trình các block xài trong trình soạn thảo thì chúng ta cần biết sơ qua webpack hoặc gulp js để có thể cấu hình 1 base source hỗ trợ complie code từ React sang JS.
Tại sao nên dùng Gutenberg ?
Tăng trải nghiệm người dùng
Được tích hợp sẵn trong WordPress
Có thể cài thêm plugin hoặc phát triển thêm các block hỗ trợ ngoài các block mặc dịnh.
Nhẹ giao diện trang web vì không cần cài nhiều plugin hỗ trợ ngoài Frontend
Có thể di chuyển các block bằng cách kéo thả không cần dùng thêm plugin nào hỗ trợ
Lưu ý trước khi tìm hiểu series.
Nghe về Gutenberg là thấy hay đó nhưng để tìm hiểu về series này các bạn cần lưu ý nhưng điều sau:
Có kiến thức cơ bản về HTML, CSS
Có kiến thức cơ bản về PHP WordPress
Có kiến thức cơ bản về webpack, gulp. (Có thể xem trước bài viết này)
Có kiển thức cớ bản vể JavaScript nói chung và JavaScript ES6 nói riêng đặc biệt là React.
Nội dung về series.
Nội dung bài viết còn sẽ được cập nhật liên tục
Phần 1: Cấu hình React vào plugin hỗ trợ viết block Gutenberg Phần 2: Tạo Block Gutenberg đầu tiên Phần 3: Thêm vào Gutenberg vào Theme Support Phần 4: Tìm hiểu thêm vể các tính năng WordPress hỗ trợ cho Gutenberg Block Phần 5: Tạo Complex Nested Block (không biết dịch sao cho hay 😀 😀 ) trong Gutenberg Phần 6: Làm Dynamic Blocks Phần 7: Sử dụng Redux trong Gutenberg Phần 8: Cấu hình template tích hợp các khổi đã làm vào trang hay post type. Phần 9: Tổng kết
Tổng kết
Như vậy mình đã giới thiệu cho các bạn sơ lược về series Gutenberg trong WordPress. Những bài viết sau mình sẽ đi sâu vào từng phần nhé. Hẹn các bạn ở bài sau.
Cảm ơn các bạn !
Last updated
