Giới thiệu

Hôm nay, chúng ta sẽ đi sâu vào trung tâm của việc tạo nội dung, sử dụng trình chỉnh sửa khối mạnh mẽ của WordPress Block Editor.

Kết quả học tập

Sau bài học này, bạn sẽ có thể:

Định nghĩa trình chỉnh sửa khối.
Điều hướng giao diện Block Editor.
Phân biệt giữa khu vực chỉnh sửa nội dung và thanh bên cài đặt.
Tạo một trang và một bài viết.
Sử dụng các khối, mẫu khối và List View.

Giới thiệu về Block Editor

WordPress Block Editor cho phép bạn xây dựng trang web của mình bằng các khối, mà không cần mã hóa. Đầu tiên, đăng nhập vào bảng điều khiển WordPress của bạn để tạo một bài viết hoặc trang. Từ bảng điều khiển, điều hướng đến phần bài viết hoặc trang trong menu bên trái. Hãy tạo một trang mới để xem kỹ giao diện Block Editor. Sau khi thêm một trang mới, chúng ta cũng có thể cung cấp tiêu đề phù hợp cho trang. Khi bạn nhấp vào trình chèn (Inserter), bạn có thể thêm nhiều loại khối khác nhau để xây dựng trang của mình.

Các khối có thể là đoạn văn, hình ảnh, cột, thư viện, bảng giá, và nhiều hơn nữa. Mẫu khối là một tính năng tuyệt vời khác. Đây là các nhóm khối được thiết kế sẵn mà bạn có thể nhanh chóng thêm để xây dựng toàn bộ phần và sau đó chỉnh sửa nó để phù hợp với nhu cầu của bạn.

Bên phải, cạnh mẫu khối, chúng ta có thể thêm media. Đầu tiên, từ Thư Viện Media của chúng ta, hoặc từ Openverse. Openverse cung cấp media có giấy phép mở mà bạn có thể sử dụng miễn phí.

Thêm khối

Có nhiều cách để thêm một khối. Đầu tiên, bạn có thể nhấp vào trình chèn ở góc trên bên trái hoặc trên trình chèn trong trang. Sáu khối xuất hiện dưới khối tìm kiếm sẽ là các khối được sử dụng gần đây nhất của bạn. Hoặc bạn có thể sử dụng lệnh gạch chéo (/). Ví dụ, gõ “/image” và thêm một hình ảnh từ Thư Viện Media của chúng ta, mà tôi đã tải lên. Tiếp theo, tôi sẽ nhấn Enter và sau đó thêm một số văn bản vào khối đoạn văn của tôi. Sau đó, thêm một đoạn văn khác.

Giao diện Block Editor: Khu vực chỉnh sửa nội dung, Thanh bên cài đặt và List View

Giao diện được chia thành ba phần chính: Khu vực Chỉnh sửa Nội dung, thanh bên trái để chọn khối hoặc List View, và thanh bên cài đặt ở bên phải. Thanh bên cài đặt ở bên phải cung cấp các cài đặt và tùy chọn bổ sung cho khối đã chọn, cho phép bạn thêm kiểu cho khối đó. Mỗi khối sẽ có các cài đặt khác nhau.

Khi bạn chọn một khối, bạn cũng sẽ thấy thanh công cụ khối liên quan đến khối cụ thể đó. Ví dụ, thanh công cụ của khối đoạn văn. Bắt đầu từ bên trái, thanh công cụ khối cho phép bạn chuyển đổi khối này thành một loại khối khác, kéo và thả khối đến vị trí mới, hoặc sử dụng mũi tên để di chuyển khối, thay đổi căn chỉnh văn bản, chọn in đậm, in nghiêng, hoặc cho phép bạn thêm liên kết. Mũi tên thả xuống cho phép đánh dấu, thêm chú thích cuối trang, và các tùy chọn định kiểu khác. Bạn sẽ thấy nhiều tùy chọn hơn khi nhấp vào ba dấu chấm dọc.

Tiếp theo, điều quan trọng là phải làm nổi bật List View. Trong ví dụ này, bạn sẽ nhận thấy rằng tôi đã xây dựng một trang hoàn chỉnh bằng cách sử dụng nhiều khối khác nhau. Khi cuộn lên, chúng ta có thể mở List View ở góc trên bên trái. List View giúp bạn điều hướng giữa các lớp nội dung và các khối lồng nhau. Đây là một tính năng không thể thiếu của trình chỉnh sửa WordPress, giúp bạn dễ dàng làm việc với các khối trên trang web của mình. Bạn có thể xem thứ tự và cấu trúc chính xác của từng khối trên trang, điều này đặc biệt hữu ích nếu bạn có một trang với nhiều nội dung. Bạn có thể chọn các khối có các khối khác lồng bên trong chúng. Bạn có thể nhấp và kéo các khối để di chuyển chúng đến một phần khác của trang. Và khi bạn nhấp vào dấu ba chấm bên cạnh bất kỳ khối nào trong List View, có nhiều tùy chọn hữu ích.

Xây dựng trang

Hãy quay lại trang ban đầu của chúng ta và tiếp tục xây dựng trang bằng cách sử dụng các khối để thấy Block Editor hoạt động. Đầu tiên, hãy thêm một khối thư viện (Gallery) và chọn ba hình ảnh từ Thư Viện Media của chúng ta. Sau khi chèn, tôi sẽ chọn khối thư viện, nhấp vào ba dấu chấm dọc, và chọn "Add after". Sau đó, tôi sẽ nhấp vào trình chèn ở góc trên bên trái và thêm một mẫu khối, một nhóm khối được thiết kế sẵn. Và tôi sẽ chọn một trong những mẫu nổi bật để lên lịch một cuộc hẹn. Sau đó, tôi sẽ mở List View, chọn khối nhóm (Group), và thay đổi căn chỉnh văn bản. Tiếp theo, hãy nhìn vào các cài đặt thanh bên. Sau khi chọn một khối, chúng ta có thể sử dụng các cài đặt thanh bên để thêm kiểu cho khối đó. Trong trường hợp này, chúng ta có thể thêm hiệu ứng bo tròn cho hình ảnh của chúng ta. Tôi sẽ chọn đoạn văn thứ hai của mình và sử dụng thanh công cụ khối để thay đổi văn bản thành in đậm. Sau đó, tôi sẽ chọn List View của mình để đảm bảo rằng tôi chọn khối thư viện cha. Trong cài đặt thanh bên, tôi sẽ thay đổi từ ba cột thành hai. Cuối cùng, tôi sẽ chọn khối nút (Buttons) của mình và thay đổi màu nền thành màu xanh lá cây.

Tôi tin rằng bạn đã thấy cách các mảnh ghép của Block Editor kết hợp với nhau, sử dụng các khối để thêm nội dung, thanh bên cài đặt để chỉnh sửa nội dung, và List View để điều hướng nội dung của bạn.

Tạo và chỉnh sửa trang trong Site Editor

Xin lưu ý rằng bạn cũng có thể tạo và chỉnh sửa trang trong Site Editor. Hãy vào Appearance và nhấp vào Editor. Điều này sẽ dẫn chúng ta đến Site Editor. Sau đó, chúng ta có thể chọn trang và mở trang "Using the Block Editor" và chọn "Edit". Trong Site Editor, chúng ta thêm nội dung vào khối nội dung. Sau đó, nó hoạt động tương tự và chúng ta có thể tiếp tục xây dựng trang của mình bằng cách sử dụng các khối. Trong trường hợp này, tôi sẽ thêm khối nhúng YouTube, thêm URL của mình, và sau đó nhúng video vào trang của mình.

Tạo và chỉnh sửa bài viết

Cuối cùng, việc tạo bài viết cũng giống như việc tạo trang. Chúng ta sử dụng các khối để xây dựng cấu trúc nội dung của mình. Lưu ý rằng chúng tôi đã đề cập đến việc thêm danh mục, thẻ và hình ảnh nổi bật trong bài học khác.

Kết luận

Tôi tin rằng bây giờ bạn đã hiểu rõ hơn về cách điều hướng Block Editor cũng như cách sử dụng các khối, thanh bên cài đặt và List View.

2.3 – Tạo bài viết và trang với WordPress Block Editor

You must be logged in to access this course