Cách dùng More Block WordPress

4 tháng ago, Hướng dẫn người mới, Views
Cách dùng More Block WordPress

Giới thiệu về More Block WordPress

Trong thế giới WordPress, việc trình bày nội dung một cách hiệu quả là vô cùng quan trọng để giữ chân độc giả và tối ưu hóa trải nghiệm người dùng. More Block (khối “Đọc Tiếp”) là một công cụ đơn giản nhưng mạnh mẽ, cho phép bạn cắt ngắn bài viết hiển thị trên trang chủ, trang lưu trữ và các trang danh mục, chỉ hiển thị một đoạn giới thiệu ngắn gọn, khuyến khích người đọc nhấp vào để xem toàn bộ bài viết.

Sử dụng More Block không chỉ cải thiện tốc độ tải trang (do chỉ tải một phần nội dung ban đầu) mà còn giúp trang web của bạn trông gọn gàng và chuyên nghiệp hơn. Nó đặc biệt hữu ích cho các trang web có nhiều bài viết, nơi mà việc hiển thị toàn bộ nội dung của tất cả các bài viết trên một trang duy nhất sẽ khiến trang web trở nên quá tải và khó điều hướng.

Bài viết này sẽ hướng dẫn bạn cách sử dụng More Block một cách chi tiết, từ cách chèn More Block vào bài viết đến cách tùy chỉnh giao diện của nút “Đọc Tiếp” để phù hợp với thiết kế tổng thể của trang web.

Cách Chèn More Block vào Bài Viết WordPress

Việc chèn More Block vào bài viết WordPress rất đơn giản và trực quan, đặc biệt là với trình soạn thảo Gutenberg.

  1. Mở bài viết cần chỉnh sửa: Truy cập vào bảng điều khiển WordPress, chọn “Bài viết” và chọn bài viết bạn muốn thêm More Block.
  2. Xác định vị trí: Trong trình soạn thảo Gutenberg, xác định vị trí bạn muốn cắt bài viết. Đây thường là sau đoạn giới thiệu đầu tiên hoặc sau một vài đoạn văn.
  3. Thêm More Block:
    • Nhấp vào biểu tượng dấu cộng (+) để thêm một khối mới.
    • Tìm kiếm “More” trong ô tìm kiếm.
    • Chọn khối “More”.
  4. Lưu hoặc đăng bài viết: Sau khi chèn More Block, hãy lưu hoặc đăng bài viết của bạn.

Vậy là xong! Bây giờ, khi bạn xem bài viết trên trang chủ hoặc trang lưu trữ, bạn sẽ thấy chỉ có nội dung trước More Block được hiển thị, cùng với nút “Đọc Tiếp” để xem toàn bộ bài viết.

Tùy Chỉnh Giao Diện More Block

Mặc dù More Block mặc định hoạt động tốt, nhưng bạn có thể muốn tùy chỉnh giao diện của nó để phù hợp hơn với thiết kế trang web của bạn. Có nhiều cách để thực hiện điều này, từ sử dụng các tùy chọn có sẵn trong trình soạn thảo Gutenberg đến sử dụng CSS tùy chỉnh.

Sử dụng Tùy Chọn trong Gutenberg

Trình soạn thảo Gutenberg cung cấp một số tùy chọn cơ bản để tùy chỉnh More Block:

  • Hiển thị đoạn trích: Bật hoặc tắt tùy chọn hiển thị đoạn trích (excerpt) của bài viết.
  • Tùy chỉnh văn bản nút “Đọc Tiếp”: Thay đổi văn bản mặc định của nút “Đọc Tiếp” thành một cụm từ khác, ví dụ như “Xem Thêm” hoặc “Tìm Hiểu Thêm”.

Để truy cập các tùy chọn này, hãy nhấp vào More Block trong trình soạn thảo Gutenberg. Bạn sẽ thấy các tùy chọn xuất hiện trong bảng điều khiển bên phải.

Sử dụng CSS Tùy Chỉnh

Để có nhiều quyền kiểm soát hơn đối với giao diện của More Block, bạn có thể sử dụng CSS tùy chỉnh. Điều này cho phép bạn thay đổi mọi thứ, từ màu sắc và phông chữ đến kích thước và căn chỉnh của nút “Đọc Tiếp”.

Để thêm CSS tùy chỉnh, bạn có thể sử dụng các cách sau:

  • Trong trình tùy biến WordPress: Truy cập vào “Giao diện” > “Tùy biến” > “CSS bổ sung”.
  • Trong tệp style.css của theme: Chỉnh sửa trực tiếp tệp style.css của theme. (Lưu ý: nên sử dụng child theme để tránh mất các tùy chỉnh khi cập nhật theme).
  • Sử dụng plugin CSS tùy chỉnh: Có nhiều plugin cho phép bạn thêm CSS tùy chỉnh vào trang web của mình.

Dưới đây là một số ví dụ về CSS tùy chỉnh bạn có thể sử dụng:

/* Thay đổi màu nền và màu chữ của nút "Đọc Tiếp" */
.wp-block-more a {
    background-color: #007bff;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
}

.wp-block-more a:hover {
    background-color: #0056b3;
}

/* Thay đổi phông chữ và kích thước chữ của nút "Đọc Tiếp" */
.wp-block-more a {
    font-family: Arial, sans-serif;
    font-size: 16px;
}

/* Căn giữa nút "Đọc Tiếp" */
.wp-block-more {
    text-align: center;
}

Hãy nhớ thay đổi các giá trị CSS cho phù hợp với thiết kế trang web của bạn.

More Block và SEO

Sử dụng More Block có thể ảnh hưởng đến SEO (tối ưu hóa công cụ tìm kiếm) của trang web của bạn. Dưới đây là một số điều cần lưu ý:

  • Nội dung quan trọng nên nằm phía trên More Block: Đảm bảo rằng nội dung quan trọng nhất của bài viết, bao gồm từ khóa chính, nằm phía trên More Block. Điều này giúp các công cụ tìm kiếm hiểu rõ hơn về chủ đề của bài viết.
  • Sử dụng đoạn trích (excerpt) hấp dẫn: Đoạn trích (excerpt) là đoạn văn ngắn gọn tóm tắt nội dung của bài viết. Hãy viết đoạn trích hấp dẫn để khuyến khích người đọc nhấp vào để xem toàn bộ bài viết.
  • Đảm bảo tốc độ tải trang nhanh: More Block có thể giúp cải thiện tốc độ tải trang, điều này rất quan trọng cho SEO.

Nhìn chung, sử dụng More Block một cách hợp lý có thể cải thiện trải nghiệm người dùng và gián tiếp giúp cải thiện SEO của trang web của bạn.

Các Plugin Thay Thế More Block

Mặc dù More Block là một công cụ hữu ích, nhưng có một số plugin khác cung cấp các tính năng tương tự hoặc nâng cao hơn:

  • Advanced Excerpt: Plugin này cho phép bạn tùy chỉnh độ dài của đoạn trích, thêm dấu chấm lửng (…) và thay đổi văn bản của nút “Đọc Tiếp”.
  • Excerpt Editor: Plugin này cho phép bạn chỉnh sửa đoạn trích của bài viết một cách dễ dàng.
  • Read More Button: Plugin này cung cấp nhiều tùy chọn tùy chỉnh cho nút “Đọc Tiếp”, bao gồm kiểu dáng, màu sắc và kích thước.

Nếu bạn cần nhiều tính năng hơn so với More Block mặc định, hãy cân nhắc sử dụng một trong các plugin này.

Kết luận

More Block là một công cụ đơn giản nhưng hiệu quả để cải thiện trải nghiệm người dùng và tối ưu hóa trang web WordPress của bạn. Bằng cách sử dụng More Block một cách hợp lý và tùy chỉnh giao diện của nó cho phù hợp với thiết kế trang web, bạn có thể tạo ra một trang web chuyên nghiệp và hấp dẫn hơn cho người đọc.

Hy vọng bài viết này đã cung cấp cho bạn đầy đủ thông tin về cách sử dụng More Block WordPress. Chúc bạn thành công!

Related Topics by Tag
, , , ,

..