Kể từ khi phát hành WordPress 5.0 vào ngày 6 tháng 12 năm 2018, WordPress có một trình chỉnh sửa nội dung mặc định mới. Được gọi là trình chỉnh sửa WordPress Gutenberg khi đang trong quá trình phát triển, “Gutenberg” giờ chỉ là “trình chỉnh sửa WordPress” hoặc “trình chỉnh sửa khối” nếu bạn muốn cụ thể hơn.
Trình chỉnh sửa khối mang đến một cách tiếp cận hoàn toàn khác để tạo nội dung dưới dạng khối (do đó có tên là…). Và trong bài đăng này, bạn sẽ tìm hiểu chính xác cách tạo một trang web WordPress bằng cách sử dụng các khối đó và các tính năng khác của trình chỉnh sửa để tạo nội dung trên trang web của bạn.
Cho dù bạn đã cập nhật trang web của mình lên WordPress 5.0 hay chưa, hãy tiếp tục đọc để tìm hiểu cách sử dụng trình chỉnh sửa khối Gutenberg để xây dựng nội dung và bố cục trên trang web của bạn.
Các bài viết liên quan:
Gutenberg là gì?
Gutenberg là tên dự án cho trình chỉnh sửa khối WordPress, đã thay thế trình chỉnh sửa WordPress TinyMCE làm trình chỉnh sửa WordPress mặc định trong WordPress 5.0.
Mặc dù Gutenberg là tên chính thức trong khi trình chỉnh sửa đang được phát triển, nhưng giờ đây nó chỉ là “trình chỉnh sửa khối WordPress” hoặc “trình chỉnh sửa WordPress” vì nó chính thức là một phần của phần mềm cốt lõi. Do đó, bạn sẽ thường thấy tôi gọi nó là “trình chỉnh sửa khối” trong bài đăng này, thay vì “Gutenberg”.
Như một bản cập nhật nhanh, đây là giao diện của trình chỉnh sửa WordPress TinyMCE cũ. Trình chỉnh sửa này hiện được gọi là trình chỉnh sửa cổ điển:
Và đây là những thứ trông như thế nào trong trình chỉnh sửa khối WordPress, AKA Gutenberg:
Tuy nhiên, nó không chỉ là một bản cập nhật thẩm mỹ. Gutenberg thay đổi hoàn toàn trải nghiệm chỉnh sửa bằng cách chuyển sang cách tiếp cận dựa trên khối đối với nội dung (tìm hiểu thêm về chính xác khối là gì trong một giây!).
Mặc dù trọng tâm hiện tại là sáng tạo nội dung, nhưng mục tiêu cuối cùng là để trình chỉnh sửa khối Gutenberg “vượt ra ngoài bài đăng thành các mẫu trang và cuối cùng là tùy chỉnh toàn bộ trang web”. Tên chính thức của thay đổi này là chỉnh sửa toàn trang.
Điều đó có nghĩa là, ở một nơi nào đó trong tương lai gần, bạn sẽ có thể xây dựng toàn bộ trang web của mình bằng cách sử dụng các khối, bao gồm các trang đích và nội dung quan trọng khác. Thậm chí có một số chủ đề đã bắt đầu cung cấp kiểu chỉnh sửa toàn trang này, mặc dù những chủ đề này hiện đang ở giai đoạn “bằng chứng về khái niệm” hơn là chủ đề.
Các bài viết liên quan:
Gutenberg là bước đầu tiên cho một tương lai mới tươi sáng cho WordPress
Đó là điều mà nhiều người thường nhắc đến, nhưng Gutenberg không chỉ là một trình soạn thảo mới cho WordPress. Đó là khởi đầu của một thứ gì đó lớn hơn nhiều. Gutenberg đặt nền tảng cho những phát triển vô cùng thú vị. Gutenberg là giai đoạn một trong chiến lược triển khai ba mũi nhọn. Đầu tiên, WordPress sẽ có một trình chỉnh sửa khối được phát triển lại, sau đó dự án sẽ tập trung vào các mẫu trang và trong giai đoạn cuối cùng WordPress sẽ trở thành một công cụ tùy chỉnh trang web đầy đủ. Bạn có thể tưởng tượng, điều này mang lại cho chúng ta khả năng vô tận và đó là bước cần thiết để giữ cho WordPress CMS số 1 trong nhiều năm tới.
Xem thêm dữ liệu cấu trúc
Hôm nay, chúng tôi đang tập trung vào giai đoạn 1. Trình chỉnh sửa khối WordPress mới đã release trong WordPress 5.0 đến vào ngày 6 tháng 12 năm 2018. Rất nhiều người đã làm việc suốt ngày đêm để biến trình chỉnh sửa khối này thành một sản phẩm ổn định và vững chắc. Chúng tôi có một đội làm việc với nó, cả trên chính trình soạn thảo và tích hợp của chúng tôi với nó.
Tất nhiên, có những trường hợp mà việc cập nhật lên WordPress 5.0 và Gutenberg vào ngày nó ra mắt là không khả thi. Hoặc, một số người có thể chỉ muốn chờ một chút. Đừng lo lắng, vì plugin Classic Editor có thể khôi phục trình chỉnh sửa cũ Hiện tại, plugin Classic Editor có sẵn cho đến ngày 31 tháng 12 năm 2021.
Mở Gutenberg lần đầu tiên
Khi bạn mở trình chỉnh sửa WordPress mới lần đầu tiên, có thể bạn đang tìm kiếm giao diện mà tất cả chúng ta đã quen thuộc. Tuy nhiên, điều đó đã biến mất. Giờ đây, chúng ta có một môi trường viết rất sạch sẽ, với kiểu chữ tuyệt vời và nhiều không gian cho Ở phía bên phải, bạn có thể mở cài đặt – trên mỗi tài liệu hoặc trên mỗi khối – bằng cách nhấp vào biểu tượng bánh răng cưa.
Xem thêm cách sử dụng wordpress
Nhấp vào ba dấu chấm bên cạnh bánh răng đó cho phép bạn chuyển sang trình chỉnh sửa mã để bạn có thể thực hiện các chỉnh sửa của mình trên mã Bây giờ, nhìn thấy màn hình này có thể khiến bạn nhướng mày. Tuy nhiên, không cần thiết phải như vậy. Chúng ta đều biết mọi người gặp khó khăn khi thay đổi từ một thứ mà họ biết rõ sang một thứ mới. Cả Marieke và Willemien đều có đặt trước liên quan đến viết và chỉnh sửa trong Gutenberg. Chúng tôi thậm chí đã thu thập một số câu hỏi cấp bách về trình chỉnh sửa mới trong WordPress 5.0 để giúp bạn vượt qua một số nỗi sợ hãi đó.
Xem thêm wordpress seo
Mọi người cảm thấy khó chấp nhận sự thay đổi khi họ không hiểu tại sao cần phải thay đổi thứ gì đó đang hoạt động tốt. Chà, trong trường hợp này, tương đối dễ hiểu: để sẵn sàng cho tương lai, WordPress cần phải thích nghi. Gutenberg giới thiệu các khái niệm và công nghệ giúp tạo ra bằng chứng trong tương lai cho WordPress. Bạn có thể thấy rõ nhất ngay bây giờ? Khái niệm về khối.
Trong Gutenberg, mọi thứ đều là một khối
Trình chỉnh sửa WordPress mới giới thiệu các khối. Trước đây, nội dung của bạn nằm bên trong một tệp HTML lớn và đối với mọi cải tiến phải có một cái gì đó mới: mã ngắn, loại bài đăng tùy chỉnh, nhúng, tiện ích và những thứ tương tự. Tất cả đều có giao diện kỳ quặc và hành vi kỳ lạ của chúng. Giờ đây, bạn có thể xây dựng nội dung của mình giống như bạn tạo một bộ LEGO: tất cả từ một hộp, tuân theo một bộ hướng dẫn được tiêu chuẩn hóa và đơn giản.
Bằng cách sử dụng khái niệm khối này, giờ đây bạn có thể xác định mọi phần nội dung của mình là gì. Không chỉ vậy, bạn có thể xác định thông số kỹ thuật của chúng cho mỗi khối. Vì vậy, ví dụ: bạn có thể biến một dòng văn bản thành một trích dẫn bằng cách thay đổi khối của nó Sau đó, nó sẽ nhận được một tập hợp các tùy chọn mới mà bạn có thể đặt. Bạn có thể thay đổi loại trích dẫn, vị trí của nó, trang trí văn bản, v.v. Điều này áp dụng cho tất cả các khối. Có các khối, trong số những thứ khác:
- Paragraphs
- Lists
- Quotes
- Headings
- Code
- Images
- Galleries
- Shortcodes
- Columns
- Buttons
- Widgets
- And a ton of embeds
Mỗi khối bạn tạo có thể có bố cục và cài đặt riêng. Và bạn có thể lưu chúng dưới dạng khối có thể tái sử dụng!
Xem thêm các plugin wordpress cho seo
Các khối có thể tái sử dụng
Một trong những điều thú vị nhất về trình chỉnh sửa WordPress mới là các khối có thể tái sử dụng. Hãy coi đây là một khối đã hoàn chỉnh mà bạn có thể lưu cùng với cài đặt của nó. Ví dụ: nếu bạn đã tạo một bố cục đẹp mắt cho phần giới thiệu các bài viết blog của mình, Bạn có thể lưu khối này dưới dạng một khối có thể tái sử dụng. Sau đó, bạn chỉ cần đi tới Thêm khối-> Có thể sử dụng lại để chọn khối giới thiệu có thể sử dụng lại của mình. Thật tuyệt làm sao!
Đây là một ví dụ cực kỳ cơ bản, nhưng bạn có thể nghĩ ra nhiều cách sử dụng phức tạp hơn cho việc này! Còn về một mẫu bài viết nhiều cột với kiểu chữ tuyệt vời cho các bài đăng trên blog tuyệt vời. Hoặc có thể là một bài viết hoàn chỉnh thư viện nơi bạn chỉ phải thả hình ảnh vào. Và nếu bạn muốn thay đổi một trong những hình ảnh, bạn sẽ phải thực hiện một lần vì mọi phiên bản sẽ được cập nhật khi bạn nhấn nút Lưu.
Tất nhiên, các nhà phát triển cũng có thể tham gia vào điều này, vì vậy nhất định phải đến một số khối tuyệt vời sẽ giúp cuộc sống của chúng ta dễ dàng hơn rất nhiều. Không có giới hạn cho điều này. Tất cả đều có thể thực hiện được vì trình chỉnh sửa khối mới trong WordPress 5.0 cung cấp cho chúng tôi toàn quyền kiểm soát đối với tất cả các khối riêng lẻ.
Xem thêm bảo mật wordpress cho người mới
Gutenberg có phải là một phần của WordPress không?
Gutenberg chính thức được phát hành như một phần của WordPress 5.0 vào ngày 6 tháng 12 năm 2018. Nếu bạn đã cập nhật trang web của mình lên WordPress 5.0, bây giờ bạn sẽ thấy trình chỉnh sửa khối theo mặc định.
Tuy nhiên, do mức độ lớn của bản phát hành, một số máy chủ lưu trữ WordPress được quản lý đã chọn không cập nhật trang web của mọi người ngay lập tức. Vì lý do đó, có khả năng trang web của bạn chưa chạy WordPress 5.0. Trong trường hợp đó, bạn có muốn cập nhật hay không (mặc dù bạn không nên đợi quá lâu vì lý do hiệu suất và bảo mật).
Cách hoạt động của trình soạn thảo WordPress Gutenberg
Một giây trước, tôi đã nói với bạn rằng Gutenberg là một trình soạn thảo dựa trên khối. Thật là thô lỗ khi để bạn bị treo cổ vì, nếu bạn giống như hầu hết mọi người, bạn có thể không biết điều đó có nghĩa là gì.
Vì vậy, đây là chỉnh sửa dựa trên khối:
Về cơ bản, Gutenberg thay thế trường chỉnh sửa duy nhất của trình chỉnh sửa WordPress TinyMCE hiện tại bằng rất nhiều “khối” riêng lẻ.
Sau đó, các khối này cho phép bạn xây dựng các thiết kế phức tạp hơn những thiết kế được phép trong trình chỉnh sửa WordPress cổ điển cũ.
Vậy khối là gì?
Chà, một khối có thể là bất cứ thứ gì. Ví dụ: bạn có thể có các khối cho:
- Văn bản thông thường
- Hình ảnh
- Video nhúng
- nút
- Tiện ích (vâng, chính những tiện ích bạn sử dụng trong thanh bên của mình)
- Những cái bàn
- Vân vân.
Và điều thú vị là các nhà phát triển sẽ có thể tạo các khối bên thứ ba của riêng họ mà bạn có thể truy cập thông qua các plugin để linh hoạt hơn nữa.
Mỗi khối là thực thể riêng của nó mà bạn có thể thao tác trên cơ sở cá nhân. Ví dụ: đây là một bài đăng nhanh trên Gutenberg chứa ba khối:
- 2 khối văn bản
- 1 khối hình ảnh
Xem tôi có thể sắp xếp lại các khối đó dễ dàng như thế nào chỉ bằng cách kéo và thả chúng:
Và bởi vì mỗi khối là “riêng biệt”, bạn cũng có thể thêm những thứ như hình nền tùy chỉnh chỉ cho các khối cụ thể.
Nói chung, nó mang lại cho bạn khả năng kiểm soát linh hoạt và chuyên sâu hơn.
Vì vậy, Gutenberg là một người xây dựng trang, phải không?
Ehh, không hoàn toàn. Ít nhất là không phải ở dạng hiện tại.
Gutenberg sẽ giúp việc tạo kiểu nội dung thông thường như các bài đăng trên blog hoặc các trang tiêu chuẩn trở nên dễ dàng hơn rất nhiều, nhưng nó không phải là sự thay thế 1: 1 cho các trình tạo trang ở dạng hiện tại.
Chỉ ở mức độ bề nổi, Gutenberg đã thiếu hai thứ thiết yếu:
Các cột linh hoạt, mặc dù có một khối cột cơ bản và một số nhà phát triển bên thứ ba đã tạo ra các khối thú vị.
Kéo và thả thực sự – phiên bản mới hơn của Gutenberg cho phép bạn sắp xếp lại các khối bằng cách kéo và thả, nhưng nó vẫn không ở dạng tự do như hầu hết các trình tạo trang.
Như đã nói, trình chỉnh sửa khối Gutenberg sẵn sàng loại bỏ nhu cầu về trình tạo trang cho hầu hết các nội dung “chuẩn” và nó cũng tạo ra một phương pháp thống nhất duy nhất để tạo bố cục bài đăng phức tạp hơn trong WordPress.
Nhưng khi nói đến việc xây dựng các trang phức tạp hơn, chẳng hạn như trang đích, bạn có thể sẽ đánh giá cao tính linh hoạt cao hơn do các nhà tạo trang cung cấp (ít nhất là trong lần phát hành đầu tiên của Gutenberg).
Ví dụ: trong so sánh của chúng tôi giữa Elementor vs Divi Builder và Beaver Builder, bạn có thể thấy cách các nhà xây dựng trang hàng đầu cung cấp những thứ như:
- Chỉnh sửa kéo và thả dạng tự do
- Hỗ trợ nhiều cột thực sự, nơi bạn có thể tạo bất kỳ số lượng cột nào để kéo các phần tử riêng lẻ vào
- Hàng tấn mẫu tạo sẵn
- Các tùy chọn tạo kiểu nâng cao, với các điểm cho lề / đệm tùy chỉnh và nhiều hơn nữa
- Cài đặt thiết kế đáp ứng
Trình chỉnh sửa khối có thể đến đó vào một ngày nào đó. Nhưng ít nhất ở dạng phát hành ban đầu, trình tạo trang vẫn sẽ cung cấp cho bạn sự linh hoạt để thiết kế các trang độc lập phức tạp hơn.
Bạn có phải sử dụng trình chỉnh sửa khối không? Bạn có thể giữ lại trình soạn thảo WordPress trước đó không?
Không, bạn không phải sử dụng trình chỉnh sửa khối và có, bạn có thể tiếp tục sử dụng trình chỉnh sửa WordPress trước đó. Để hủy kích hoạt trình chỉnh sửa khối Gutenberg và đưa trang web của bạn về trình chỉnh sửa cổ điển sau khi nâng cấp lên WordPress 5.0, bạn có thể sử dụng plugin Trình chỉnh sửa cổ điển chính thức.
Đọc hướng dẫn của chúng tôi về cách tắt trình chỉnh sửa khối Gutenberg để tìm hiểu thêm.
Bạn có cần một chủ đề đặc biệt để sử dụng trình chỉnh sửa khối Gutenberg không?
Bởi vì nó hiện là trình chỉnh sửa WordPress mặc định, trình chỉnh sửa khối được xây dựng để hoạt động với bất kỳ chủ đề WordPress nào. Tuy nhiên, việc chọn một chủ đề đặc biệt cung cấp khả năng tương thích với Gutenberg sẽ mang lại một số lợi ích rất thực tế.
Đầu tiên, các chủ đề có thể cung cấp kiểu dáng tích hợp cho tất cả các khối mới đó. Tốt hơn, các chủ đề thực sự có thể tải các kiểu này bên trong trình chỉnh sửa. Điều đó có nghĩa là bạn có thể thấy kiểu dáng thực sự cho các khối của mình khi bạn xây dựng nội dung của mình để có trải nghiệm WYSIWYG tốt hơn (xem phiên bản cơ bản của điều này đang hoạt động tại đây)
Các chủ đề của Gutenberg cũng sẽ có thể cung cấp các mẫu tạo sẵn bao gồm các khối khác nhau để tất cả những gì bạn cần làm là cắm nội dung của mình vào các khối hiện có và nhấn Xuất bản.
Ngoài ra, có một số lợi ích nhỏ khác như căn chỉnh hình ảnh toàn chiều rộng. Vì vậy – bạn có thể sử dụng bất kỳ chủ đề nào bạn muốn, nhưng bạn nên kiểm tra kỹ để đảm bảo rằng nhà phát triển chủ đề của bạn đang có kế hoạch thêm hỗ trợ.
Nếu bạn chỉ muốn sử dụng một chủ đề để thử nghiệm, tất cả các chủ đề này đều có hỗ trợ cho trình chỉnh sửa khối:
Xây dựng bố cục đầu tiên của bạn với trình chỉnh sửa khối WordPress Gutenberg
Giả sử bạn đang sử dụng WordPress 5.0 và trình chỉnh sửa khối, bạn đã sẵn sàng tìm hiểu nội dung của bài viết này. Dưới đây, tôi sẽ chỉ cho bạn cách thực sự sử dụng trình chỉnh sửa khối WordPress Gutenberg để tạo bố cục trang hoàn chỉnh.
Tham quan nhanh giao diện trình chỉnh sửa khối WordPress
Trước khi bạn bắt đầu thêm một số khối, hãy xem nhanh các phần tử của giao diện trình chỉnh sửa khối chính:
- (A) – cho phép bạn thêm các khối mới.
- (B) – nút hoàn tác / làm lại
- (C) – xem dạng xem danh sách (phác thảo) của tất cả các khối của bạn – hữu ích để điều hướng nhanh chóng giữa các khối
- (D) – cung cấp cho bạn quyền truy cập vào cài đặt tài liệu, bao gồm những thứ như danh mục & thẻ, hình ảnh nổi bật, v.v. Điều này tương tự như thanh bên hiện tại trong trình chỉnh sửa WordPress
- (E) – khi bạn đã chọn một khối riêng lẻ, điều này cho phép bạn truy cập vào các cài đặt dành riêng cho khối đó
- (F) – cho phép bạn truy cập bản xem trước trực tiếp của bài đăng của bạn hoặc xuất bản / cập nhật bài đăng của bạn
- (G) – sau khi bạn thêm một số khối, đây là nơi bạn sẽ thực sự làm việc với nội dung bài đăng của mình
Thêm khối mới
Như tôi đã thảo luận trong phần giới thiệu, bạn sẽ sử dụng các “khối” riêng biệt để xây dựng bố cục của mình bằng trình chỉnh sửa.
Để thêm một khối mới, tất cả những gì bạn cần làm là nhấp vào biểu tượng + Dấu cộng và chọn loại nội dung bạn muốn thêm:
Trong ví dụ trên, tôi đã hướng dẫn bạn cách thêm một khối đoạn văn bản cơ bản. Nhưng Gutenberg thực sự bao gồm rất nhiều khối khác nhau, được chia thành các phần khác nhau:
- Văn bản – những thứ như đoạn văn, tiêu đề, danh sách, dấu ngoặc kép, v.v.
- Phương tiện – chèn hình ảnh, thư viện, video, tệp âm thanh và các phương tiện khác.
- Thiết kế – thêm các nút, cột, phần, dấu cách và hơn thế nữa.
- Widget – chèn các widget WordPress, chẳng hạn như danh sách các danh mục hoặc các bài đăng mới nhất của bạn.
- Nhúng – nhúng nội dung từ các nguồn của bên thứ ba như Twitter, YouTube, Spotify, Vimeo và các nguồn khác.
Xây dựng bố cục cơ bản với Gutenberg
Hãy bắt đầu đơn giản. Giả sử bạn chỉ muốn xây dựng bố cục bài đăng trên blog cơ bản bao gồm:
- Văn bản thông thường
- Một tấm ảnh
- Một câu trích dẫn
- Một video YouTube được nhúng
Đây là cách bạn sẽ làm điều đó với Gutenberg:
Trước tiên, bạn sẽ viết toàn bộ bài đăng của mình trong trình chỉnh sửa. Hoặc, nếu bạn giống tôi và thích viết trong Google Tài liệu, bạn có thể dán tất cả vào và sau đó Gutenberg sẽ tự động chuyển nó thành các khối.
Thêm các khối không phải văn bản
Giờ đây, nội dung của bạn đã được chia thành các khối, bạn có thể di chuột qua vị trí bạn muốn chèn hình ảnh đầu tiên của mình và nhấp vào biểu tượng dấu cộng. Điều đó sẽ tạo ra sự phá vỡ. Sau đó, nhấp lại vào biểu tượng dấu cộng để chèn khối hình ảnh:
Điều này sẽ cho phép bạn chèn một khối hình ảnh, từ đó bạn có thể tải lên hoặc chọn hình ảnh theo cách tương tự như trình chỉnh sửa WordPress hiện tại:
Khi bạn chọn hình ảnh của mình, bạn sẽ thấy nó ngay tại đó trong bố cục trang của bạn:
Tiếp theo, di chuột qua vị trí bạn muốn chèn dấu ngoặc kép và sử dụng cách tiếp cận tương tự để chèn một khối khác. Bạn có thể tìm kiếm “trích dẫn” hoặc nhấp để mở rộng trình chèn khối đầy đủ và tìm kiếm nó trong phần Văn bản:
Sau đó, bạn sẽ thấy khối báo giá kéo mới của mình. Để tạo báo giá của bạn, tất cả những gì bạn cần làm là nhấp vào khối và nhập:
Để chèn video YouTube, bạn có thể thêm một khối YouTube mới từ phần Nhúng (hoặc bạn chỉ có thể tìm kiếm trên YouTube). Để chèn video, tất cả những gì bạn cần làm là nhập URL và nhấp vào Nhúng:
Tùy chọn – tạo column
Bạn muốn sáng tạo hơn nữa? Gutenberg bao gồm một khối Cột tích hợp cho phép bạn nhanh chóng tạo nhiều cột. Tất cả những gì bạn cần làm là thêm khối Cột từ phần Thiết kế. Sau đó, bạn có thể chèn các khối khác vào bên trong nó. Nếu bạn muốn các cột linh hoạt hơn nữa, bạn cũng có thể tìm thấy các plugin Gutenberg của bên thứ ba bổ sung những thứ đó – nhiều hơn nữa trên các plugin khối sau này.
Sau khi hoàn tất, tất cả những gì bạn cần làm là nhấp vào nút Xuất bản:
Và bạn sẽ có bài đăng trên blog được định dạng của mình trên giao diện người dùng.
Phương pháp điều chỉnh những khối lẻ
Vì trình chỉnh sửa Gutenberg của WordPress bao gồm rất nhiều khối khác nhau, nên tôi không thể chỉ cho bạn cách sử dụng từng khối riêng lẻ.
Nhưng tôi có thể cung cấp cho bạn một khuôn khổ cơ bản áp dụng cho tất cả các khối.
Về cơ bản, bạn kiểm soát nội dung trong phần thân thực của trình chỉnh sửa:
Để căn chỉnh và tạo kiểu văn bản cơ bản, bạn có thể sử dụng thanh menu xuất hiện khi bạn di chuột qua một khối:
Và để tạo kiểu nâng cao hơn, bạn thường sẽ tạo kiểu cho khối trong tab Cài đặt chặn.Để truy cập tab đó, hãy chọn khối bạn muốn chỉnh sửa và duyệt đến tab Chặn:
Cách sắp xếp lại các khối riêng lẻ
Để sắp xếp lại các khối, bạn có hai tùy chọn. Bạn có thể sử dụng mũi tên Lên hoặc Xuống khi di chuột qua một khối để di chuyển khối theo hướng tương ứng:
Hoặc, bạn có thể kéo và thả các khối. Để kích hoạt chức năng kéo và thả, bạn cần di chuột qua sáu dấu chấm giữa mũi tên lên và xuống
Để tất cả chúng cùng nhau
Khi bạn nắm bắt được quy trình hoạt động của mọi thứ với trình chỉnh sửa khối, việc này khá dễ dàng và trực quan.
Lúc đầu, bạn có thể gặp một số khó khăn ngày càng tăng và khó thực hiện các hành động cơ bản mà bạn đã cho là đương nhiên.
Nhưng một khi bạn nắm bắt được mọi thứ – bạn nên lướt qua các bố cục của tòa nhà. Và với các khối nâng cao hơn mà Gutenberg đi kèm, bạn sẽ linh hoạt hơn so với TinyMCE WordPress Editor.
Một số thủ thuật Gutenberg gọn gàng nhưng nâng cao hơn
Khi bạn trở nên quen thuộc hơn với trình chỉnh sửa khối WordPress Gutenberg, bạn có thể thấy một số thủ thuật này giúp tiết kiệm thời gian.
Chèn một khối thông qua phương pháp nhập
Trên đây mình đã hướng dẫn các bạn cách tạo khối bằng nút insert. Nhưng để tiết kiệm thời gian, bạn thực sự có thể tạo khối bằng cách gõ cú pháp sau:
/ BLOCK-NAME
Một hộp gợi ý tự động sẽ xuất hiện để giúp bạn tìm khối có liên quan.
Ví dụ: đây là cách tạo khối hình ảnh chỉ bằng bàn phím của bạn:
Khá tiện lợi và tiết kiệm thời gian!
Edit mã nguồn
Click vào ba chấm trên cùng để tiến hành chỉnh sửa bất cứ lúc nào
Kích hoạt chế độ toàn màn hình, thanh công cụ cố định, v.v.
Trình chỉnh sửa khối bao gồm một số chế độ khác nhau cho phép bạn thay đổi trải nghiệm chỉnh sửa. Bạn có thể:
- Thêm một thanh công cụ cố định như trình soạn thảo TinyMCE
- Đi toàn màn hình
- Đặt một “tiêu điểm” vào khối đang hoạt động
Để sử dụng các “Chế độ xem” này, hãy nhấp vào biểu tượng ba chấm ở góc trên cùng bên phải.
Tiết kiệm thời gian thông qua việc dùng hot keys Gutenberg
Ngoài các phím tắt định dạng tiêu chuẩn, trình chỉnh sửa khối có một số phím tắt chuyên dụng có thể giúp bạn:
- Chèn các khối mới vào dưới những khối chọn
- Xóa một khối
- Nhân bản một khối
- Vân vân.
Để mở danh sách phím tắt đầy đủ, hãy sử dụng phím tắt Shift + Alt + H.
Sử dụng đường viền để nhanh chóng điều hướng đến các khối cụ thể
Đường viền khối cung cấp cho bạn cái nhìn cấp cao về tất cả các khối trong thiết kế của bạn và cho phép bạn nhanh chóng chọn cài đặt của một khối cụ thể bằng cách nhấp vào nó trong chế độ xem danh sách. Nó đặc biệt hữu ích khi bạn có nhiều khối được lồng vào nhau, chẳng hạn như các khối nội dung bên trong một cột.
Để mở đường viền khối, hãy nhấp vào biểu tượng trên thanh công cụ trên cùng. Sau đó, nhấp vào khối mà bạn muốn chuyển đến.
Sử dụng các mẫu khối làm mẫu
“Mẫu khối” về cơ bản là một mẫu mà bạn có thể sử dụng làm điểm bắt đầu cho các thiết kế của mình. Theo mặc định, WordPress đi kèm với các mẫu được tạo sẵn cho những thứ như bố cục nhiều cột, tiêu đề, v.v. Nhưng các plugin cũng có thể thêm các mẫu khối của riêng chúng.
Để chèn một mẫu khối:
- Nhấp vào trình chèn khối chính ở góc trên cùng bên trái (biểu tượng dấu cộng).
- Chọn tab Mẫu.
- Chọn mẫu mà bạn muốn chèn
Tạo các mẫu khối có thể sử dụng lại
Nếu bạn có một bộ sưu tập / sắp xếp các khối cụ thể mà bạn cần sử dụng lại ở nhiều vị trí, bạn có thể lưu một nhóm khối làm mẫu có thể sử dụng lại. Bạn sẽ có thể đặt tên cho mẫu của mình. Sau đó, bạn có thể chèn nó giống như bạn làm với một khối thông thường.
Để tạo mẫu của bạn:
- Chọn các khối mà bạn muốn bao gồm
- Nhấp vào biểu tượng ba chấm
- Chọn Thêm vào khối có thể tái sử dụng
Chỉnh sửa nội dung khối có thể sử dụng lại
Ngoài việc giúp bạn dễ dàng nhanh chóng chèn nội dung đã định dạng, các khối có thể tái sử dụng còn cho phép bạn cập nhật nhanh chóng tất cả các phiên bản của khối có thể tái sử dụng đó.
Có nghĩa là, một khi bạn chỉnh sửa nội dung khối có thể sử dụng lại, mọi bài đăng sử dụng khối có thể tái sử dụng đó cũng sẽ nhận được nội dung mới.
Để chỉnh sửa khối có thể tái sử dụng, hãy cuộn đến phần Có thể sử dụng lại trong trình chèn khối và nhấp vào nút Quản lý tất cả các khối có thể tái sử dụng. Hoặc, bạn có thể truy cập trang web của bạn.com/wp-admin/edit.php?post_type=wp_block (đảm bảo thay thế trang web của bạn bằng URL thực của bạn).
Mở rộng trình chỉnh sửa khối với các plugin
Nếu bạn muốn trở nên lạ mắt, bây giờ bạn có thể tìm thấy rất nhiều plugin mở rộng Gutenberg có thêm các khối riêng của chúng.
Otter Blocks là một lựa chọn tốt để giúp bạn bắt đầu. Nó cung cấp cho bạn các khối bổ sung cho những thứ như giá cả, lời chứng thực, Google Maps, biểu tượng chia sẻ, nút “nhấp để tweet” và hơn thế nữa.
Kiểm soát sự lộn xộn với Trình quản lý khối
Trình chỉnh sửa thêm rất nhiều khối, đặc biệt nếu bạn đang sử dụng một số plugin chặn mà chúng tôi đã đề cập ở trên. Điều này có thể khiến mọi thứ trở nên lộn xộn và khiến bạn chậm lại. Nếu có một số khối mà bạn không bao giờ định sử dụng, bạn có thể sử dụng Trình quản lý khối để vô hiệu hóa chúng.
Để sử dụng Trình quản lý khối:
- Nhấp vào biểu tượng ba chấm ở góc trên bên phải
- Chọn Trình quản lý khối
- Sử dụng các hộp kiểm để vô hiệu hóa các khối nếu cần
Sử dụng Điều hướng khối để nhanh chóng điều hướng nội dung
Đối với nội dung dài hoặc nội dung mà bạn sử dụng nhiều khối lồng nhau, có thể khó tìm nhanh khối mà bạn đang tìm kiếm.
Để trợ giúp, trình chỉnh sửa khối bao gồm công cụ Điều hướng khối, bạn có thể mở công cụ này bằng cách nhấp vào thanh công cụ hoặc sử dụng phím tắt Shift + Alt + O.
Nếu bạn đang ở bên trong một khối lồng nhau (chẳng hạn như cột), công cụ Điều hướng khối sẽ hiển thị tất cả các khối lồng nhau. Để chọn một khối cụ thể, bạn có thể nhấp vào khối đó trong danh sách.
Chuyển đổi giữa các chế độ Chỉnh sửa và Chọn
Với WordPress 5.4, bạn có quyền truy cập vào hai chế độ khác nhau, bạn có thể chuyển đổi giữa các chế độ này bằng cách sử dụng thanh công cụ trên cùng:
- Chỉnh sửa – đây là những gì bạn sẽ làm trong hầu hết thời gian. Nó cho phép bạn chỉnh sửa nội dung của tất cả các khối của bạn. Đây là chế độ soạn thảo mặc định.
- Chọn – điều này giúp bạn dễ dàng chọn các khối cụ thể hơn, đặc biệt khi làm việc với các khối lồng nhau (ví dụ: các khối bên trong một cột). Khi bạn nhấp vào một khối, bạn sẽ tự động chuyển về chế độ Chỉnh sửa.
Thử nghiệm với các tính năng của trình chỉnh sửa khối mới
Kể từ khi trình chỉnh sửa khối được hợp nhất vào lõi, thực tế có hai phiên bản của trình chỉnh sửa khối:
- Phiên bản gốc trong phần mềm WordPress cốt lõi (đây có thể là những gì bạn đang sử dụng)
- Plugin Gutenberg
Phiên bản plugin Gutenberg về cơ bản là nền tảng thử nghiệm cho trình soạn thảo cốt lõi. Phiên bản plugin chứa các tính năng mới đang được phát triển. Cuối cùng, những tính năng đó sẽ được hợp nhất thành cốt lõi. Nhưng nếu bạn muốn chơi với họ sớm, tất cả những gì bạn cần làm là cài đặt plugin Gutenberg từ WordPress.org.
Điều gì xảy ra với tất cả nội dung cũ của bạn?
Trước khi hoàn thành mọi việc, hãy để tôi trình bày nhanh những gì sẽ xảy ra với tất cả nội dung cũ của bạn sau khi bạn cập nhật lên WordPress 5.0 (nếu bạn chưa cập nhật).
Đừng lo lắng – nó sẽ không biến mất! Nhưng trải nghiệm hơi khác một chút:
Khi bạn cập nhật trang web của mình lên WordPress 5.0 và bạn có nội dung hiện có được xây dựng bằng trình chỉnh sửa TinyMCE ban đầu, trình chỉnh sửa khối sẽ đặt tất cả nội dung cũ của bạn vào một khối Cổ điển duy nhất. Khối Cổ điển này về cơ bản là trình soạn thảo TinyMCE… nhưng được nhúng bên trong trình chỉnh sửa khối.
Để làm việc với nội dung cũ của mình, bạn có thể:
- Để nó trong khối Cổ điển và chỉnh sửa nó giống như bạn làm với trình chỉnh sửa WordPress cũ
- Sử dụng biểu tượng ba chấm và chọn Chuyển đổi thành Khối. Điều đó sẽ phá vỡ mọi thứ thành các khối riêng lẻ. Sau đó, bạn có thể làm việc với nội dung của mình giống như thể bạn đã tạo nó ban đầu bằng trình chỉnh sửa khối Gutenberg.
Điều gì tiếp theo cho trình chỉnh sửa khối Gutenberg?
Mặc dù trình chỉnh sửa khối hiện đã chính thức là một phần cốt lõi (nhờ vào việc phát hành WordPress 5.0), nhưng nhóm WordPress vẫn chưa hoàn thành dự án Gutenberg.
Hiện tại, nhóm cốt lõi đang làm việc để có trình chỉnh sửa khối thay thế các tiện ích WordPress, cũng như cho phép bạn tạo menu điều hướng với các khối.
Mặc dù các tính năng này vẫn chưa có ở đây, nhưng chúng đang được phát triển. Vì lý do đó, bạn sẽ phải trả tiền để bắt đầu học giao diện trình chỉnh sửa khối càng sớm càng tốt!
Đối với hầu hết người dùng thông thường, sau một số khó khăn ngày càng tăng, nó sẽ mang lại trải nghiệm tạo nội dung linh hoạt hơn.
Những người không phải là nhà phát triển sẽ có thể tạo các bố cục phức tạp hơn một cách trực quan với các yếu tố bổ sung như nút, nhúng nội dung và nhiều thứ khác. Và điều đó hy vọng sẽ giúp WordPress tiếp tục phát triển.
Kết luận cho Gutenberg là gì?
Không có gì đánh bại xung quanh bụi rậm: một trình chỉnh sửa WordPress mới đã đến. Chúng tôi đã sẵn sàng cho nó và bạn cũng nên như vậy. Trình chỉnh sửa khối mới có thể sẽ làm quen và nó có thể phá vỡ một số thứ, nhưng cuối cùng, Chúng tôi sẽ có được một môi trường được sắp xếp hợp lý hơn với nhiều khả năng thú vị. Đọc thêm về cách chuyển sang trình chỉnh sửa khối từ trình chỉnh sửa cổ điển.
Bạn chưa sẵn sàng cài đặt WordPress 5.0? Hoặc bạn muốn có WordPress 5.0 nhưng không phải là trình chỉnh sửa khối mới cho đến khi nó ổn định hơn? Không sao, hãy cài đặt plugin Classic Editor. Nhưng hãy bắt đầu với WordPress 5.0 khi cài đặt thử nghiệm – đây là cách kiểm tra WordPress. Chơi với nó, xem trang web của bạn hoạt động như thế nào. Thêm mọi vấn đề bạn tìm thấy vào GitHub của Gutenberg: những thứ không hoạt động hoặc sẽ hoạt động tốt hơn. Cảm ơn bạn đã đóng góp!
Xem thêm sử dụng blocks cho seo
