Chúng là gì và cách sử dụng chúng trong WordPress

Chưa được phân loại

Dự kiến phát hành vào ngày 6 tháng 2018 năm XNUMX, WordPress 5,0 mang đến một bản cập nhật lớn – trình chỉnh sửa Gutenberg mới. Nếu bạn muốn tận dụng tối đa công cụ này, bạn sẽ cần tìm hiểu về hệ thống khối Gutenberg.

Gutenberg giúp bạn tạo nội dung một cách trực quan hơn so với trình chỉnh sửa TinyMCE trước đây. Để làm điều này, nó cung cấp một thư viện các phần tử được tạo sẵn hoặc ‘khối’. Mỗi khối có thể được thêm vào một trang hoặc bài đăng và tùy chỉnh. Có các khối để xử lý các thành phần cơ bản như văn bản và hình ảnh, cũng như một số khối cung cấp các tính năng nâng cao (chẳng hạn như các nút và bảng).

Trong hướng dẫn này, chúng tôi sẽ giới thiệu hệ thống khối Gutenberg và chỉ cho bạn cách sử dụng nó. Trên đường đi, chúng tôi sẽ giới thiệu cho bạn một số khối hữu ích nhất có trong trình chỉnh sửa mới. Hãy bắt đầu làm việc!

Cách sử dụng khối Gutenberg để tạo bài đăng wordPress (trong 3 bước)

Giả sử bạn đã đã cập nhật trang web của bạn đến WordPress 5,0, trang web của bạn nên sử dụng trình chỉnh sửa Gutenberg mới theo mặc định.

Tất cả những gì còn lại là học cách áp dụng hệ thống khối Gutenberg mới!

Chúng tôi sẽ minh họa các tính năng chính của trình chỉnh sửa bằng cách hướng dẫn bạn cách tạo một bài đăng WordPress cơ bản, nhưng bạn có thể sử dụng cùng một cách tiếp cận bất kể bạn đang tạo loại nội dung nào với Gutenberg.

Bước 1: Thêm chặn vào bài đăng của bạn

Điều đầu tiên bạn sẽ muốn làm là đặt tiêu đề cho bài đăng của mình, sử dụng trường chuyên dụng ở đầu trình chỉnh sửa:

Thêm một tiêu đề trong Gutenberg.

Điều này hoạt động giống hệt như cách nó đã làm trong trình chỉnh sửa cổ điển. Tuy nhiên, sau đó, mọi thứ bắt đầu thay đổi.

Nếu bạn di chuột qua khu vực ngay bên dưới tiêu đề bài viết của mình, bạn sẽ thấy một vài biểu tượng:

Các biểu tượng trong trình chỉnh sửa Gutenberg.

Các Cộng biểu tượng cho phép bạn chọn các khối Gutenberg và thêm chúng vào bài đăng của bạn. Ở bên phải, cũng có các tùy chọn để nhanh chóng thêm các khối được sử dụng phổ biến nhất – các tùy chọn văn bản, hình ảnh và thư viện.

Bây giờ, hãy nhấp vào Cộng và bạn sẽ thấy một menu mới:

Một lựa chọn các khối Gutenberg.

Menu này liệt kê tất cả các khối Gutenberg mà trình chỉnh sửa hiện đang bao gồm. Có một phần ở trên cùng với phần của riêng bạn Được sử dụng nhiều nhất tùy chọn, một số danh mục có tổ chức bên dưới và thậm chí là thanh tìm kiếm để giúp bạn tìm thấy những gì bạn cần một cách nhanh chóng.

Để thêm một khối vào bài đăng của bạn, bạn chỉ cần tìm và nhấp vào nó. Hãy bắt đầu đơn giản, với một Đoạn khối. Đặt khối trong bài đăng của bạn, sau đó chuyển sang bước tiếp theo (bạn cũng có thể tạo một khối đoạn văn bằng cách chỉ cần nhập vào trình chỉnh sửa).

Bước 2: Tùy chỉnh khối của bạn

Khi bạn thêm một khối đoạn văn, nó trông không giống lắm ngay lập tức. Tuy nhiên, khi bạn bắt đầu nhập vào trường, các tùy chọn mới sẽ xuất hiện:

Một khối đoạn Gutenberg.

Bạn sẽ thấy một số cài đặt định dạng cơ bản, chẳng hạn như căn chỉnh, in đậm và in nghiêng. Ngoài ra, hãy xem thanh bên phải của màn hình trình chỉnh sửa:

Cài đặt cho khối đoạn Gutenberg.

Ở đó, bạn sẽ tìm thấy nhiều tùy chọn khối cụ thể hơn. Trong trường hợp này, bạn có thể thay đổi kích thước phông chữ và màu sắc của văn bản, thêm chữ hoa đầu đoạn và thậm chí bao gồm một số CSS tùy chỉnh (trong trang Tiên tiến thực đơn). Bất kỳ thay đổi nào bạn thực hiện, ở đây hoặc trên chính khối, sẽ hiển thị ngay lập tức.

Mỗi một trong những khối Gutenberg được cung cấp đi kèm với các cài đặt độc đáo của riêng nó.

Ví dụ: nếu bạn nhấn Vào bạn sẽ thêm một khối mới bên dưới khối đoạn văn của mình. Tuy nhiên, lần này bạn có thể thử thêm một khối hình ảnh bằng cách sử dụng cùng một khối hình ảnh đó Cộng dấu:

Một khối hình ảnh Gutenberg.

Như bạn có thể thấy, bạn có thể tải lên một hình ảnh hoặc thêm một hình ảnh đã có trong Thư viện phương tiện của bạn. Bạn có thể chỉnh sửa hình ảnh, thay đổi căn chỉnh của nó và thêm CSS vào thanh bên.

Mẹo năng suất: Như một giải pháp thay thế cho việc đánh Cộng , bạn có thể nhập dấu “/” vào một khối trống theo sau là tên của khối mà bạn muốn chèn. Khi bạn tìm hiểu những khối nào có sẵn, đây là một cách nhanh hơn nhiều để thêm các khối mới.

Không có nghi ngờ rằng you’ll sử dụng nhiều đoạn văn và khối hình ảnh. Tuy nhiên, Gutenberg có nhiều thứ để cung cấp. Ngoài ra còn có một số khối Gutenberg cung cấp các tùy chọn mới không có sẵn trong trình chỉnh sửa cổ điển.

Ví dụ: bạn có thể thêm một Nút chặn bài đăng của bạn:

Một khối nút Gutenberg.

Này tạo một nút có thể nhấp vào để du khách tương tác. Bạn có thể chỉnh sửa văn bản của chính nút và bao gồm URL mà nút sẽ liên kết đến ngay bên dưới:

Chỉnh sửa khối nút Gutenberg.

Bằng cách chọn biểu tượng ở góc trên cùng bên trái của khối, bạn có thể thay đổi kiểu nút của mình:

Thay đổi kiểu nút Gutenberg của bạn.

Ngoài ra, bạn có thể thay đổi cả màu nền và màu văn bản trong thanh bên. Mặc dù đây không phải là một loạt các tùy chọn, nhưng nó đủ để tạo ra một nút tùy chỉnh tiện dụng, mà bạn có thể sử dụng để khuyến khích khách truy cập đăng ký một danh sách email, hãy mua một sản phẩm hoặc bất cứ thứ gì khác khiến bạn thích thú.

Bước 3: Hoàn thiện bài đăng của bạn

Khi bạn đã thêm một vài khối, bạn có thể thấy mình muốn thực hiện một số thay đổi. May mắn thay, trình chỉnh sửa Gutenberg khá linh hoạt trong việc cho phép bạn sửa đổi bố cục nội dung của mình.

Ví dụ: nếu bạn muốn xóa một khối, bạn có thể chọn nút Tùy chọn phía trên nó và nhấp vào Xóa khối:

Xóa một khối trong Gutenberg.

Bằng cách di chuột qua một khối, bạn có thể sử dụng các mũi tên lên và xuống để sắp xếp lại các khối của mình theo ý muốn. Hoặc, bạn cũng có thể nhấp vào sáu dấu chấm giữa các mũi tên để sử dụng kéo và thả để di chuyển một khối:

Sắp xếp lại các khối trong Gutenberg.

Mẹo năng suất: Gutenberg bao gồm một số phím tắt có thể giúp bạn nhanh chóng xóa các khối hoặc chèn các khối mới. Kiểu Shift + Alt + H để xem tất cả các phím tắt Gutenberg.

Cũng cần lưu ý rằng bạn có thể tạo bố cục nhiều cột. Đây là một tính năng thú vị, mặc dù nó vẫn đang trong giai đoạn thử nghiệm tại thời điểm viết bài này. Bạn có thể truy cập nó bằng cách đặt một Cột chặn trong bài đăng của bạn:

Sử dụng các cột trong Gutenberg.

Điều này cho phép bạn tạo tối đa sáu cột song song và đặt bất kỳ khối nào bạn muốn trong mỗi cột. Đó là một tùy chọn mang lại nhiều tiềm năng để tạo bố cục độc đáo.

Cuối cùng, điều quan trọng cần lưu ý là bạn vẫn có quyền truy cập vào cài đặt toàn bộ bài đăng (hoặc toàn trang). Trong thanh bên bên phải, hãy nhấp vào biểu tượng Tài liệu để tìm chúng:

Cài đặt trang Gutenberg.

Tại đây, bạn sẽ tìm thấy hầu hết các tùy chọn mà bạn quen thuộc. Bạn có thể xuất bản bài đăng, đặt tác giả, chọn danh mục và thẻ, thêm hình ảnh nổi bật, v.v. Bạn thậm chí có thể sửa đổi các tùy chọn cài đặt bình luận trong trang Sự thảo luận thực đơn. Tuy nhiên, bạn sẽ không cần lưu nội dung của mình, vì nó sẽ tự động lưu theo định kỳ trong khi bạn đang làm việc.

Đây là tất cả những gì bạn cần biết để sử dụng hệ thống khối Gutenberg! Nó nhanh chóng để nhận, nhưng có rất nhiều lựa chọn hơn chúng tôi đã đề cập ở đây. Chúng tôi khuyến khích bạn tiếp tục thử nghiệm với các khối Gutenberg khác nhau có sẵn và trở nên thoải mái với các lựa chọn được cung cấp (vì vậy bạn sẽ sẵn sàng khi trình chỉnh sửa khởi chạy thực sự).

Bạn cũng có thể sử dụng plugin để thêm các khối mới

Một trong những điều mạnh mẽ nhất về Gutenberg là bạn sử dụng các plugin để thêm tất cả các loại khối mới vào trình chỉnh sửa. Trên thực tế, một số plugin yêu thích của bạn có thể đã thêm các khối của riêng chúng.

Ví dụ, một số bộ sưu tập plugin bây giờ cho phép bạn chèn một bộ sưu tập bằng cách sử dụng một khối, thay vì khối cũ phương pháp mã ngắn mà nhiều plugin đã sử dụng.

Ngoài ra, bạn cũng có thể tìm thấy rất nhiều plugin chỉ tập trung vào việc thêm các khối mới. Ví dụ: plugin Otter Blocks cung cấp cho bạn các khối cho:

Có rất nhiều plugin khối Gutenberg khác mà bạn cũng có thể tìm thấy ở WordPress.org.

Một plugin khác đáng nói là plugin Cloud Blocks. Mặc dù nó vẫn đang trong giai đoạn thử nghiệm, nhưng nó cung cấp một cách tiếp cận thú vị cho phép bạn cài đặt các khối Gutenberg từ các nhà phát triển bên thứ ba “từ đám mây”.

Kết thúc

Với release của WordPress 5.0, Gutenberg được thiết lập để trở thành trình soạn thảo mặc định cho tất cả WordPress các trang web (trừ khi bạn đang sử dụng plugin Trình chỉnh sửa cổ điển).

May mắn thay, việc tạo nội dung trong Gutenberg rất đơn giản. Bạn chỉ cần:

  1. Thêm bất kỳ khối Gutenberg nào bạn muốn vào bài đăng hoặc trang của mình.
  2. Tùy chỉnh cài đặt riêng của từng khối.
  3. Sắp xếp lại các khối, xóa chúng và thậm chí sắp xếp chúng thành các cột nếu bạn muốn.

Và nếu bạn muốn nhiều khối hơn nữa để sử dụng trong các thiết kế của mình, hãy cân nhắc thêm một trong nhiều plugin khối Gutenberg.

Nếu bạn muốn hướng dẫn Gutenberg toàn diện hơn, chúng tôi đã viết một bài tổng quát hơn Gutenberg cho người mới đăng bài, cũng như một hướng dẫn biên tập gutenberg chi tiết với một số mẹo năng suất nâng cao.

Bạn có bất kỳ câu hỏi nào về cách hoạt động của các khối Gutenberg hoặc có bất kỳ tùy chọn nào bạn muốn thấy được thêm vào không? Chia sẻ suy nghĩ của bạn trong phần bình luận bên dưới!

Hướng dẫn miễn phí

5 mẹo cần thiết để tăng tốc độ
Trang web WordPress của bạn

Giảm thời gian tải của bạn thậm chí 50-80%
chỉ bằng cách làm theo các mẹo đơn giản.

Bài viết liên quan

Trả lời

Email của bạn sẽ không được hiển thị công khai.