Hiển thị bài viết gần đây trong WordPress

6 tháng ago, Hướng dẫn WordPress, Views
Hiển thị bài viết gần đây trong WordPress

Hiển thị Bài Viết Gần Đây trong WordPress: Hướng Dẫn Chi Tiết

Việc hiển thị bài viết gần đây (recent posts) là một phần quan trọng trong việc thiết kế và tối ưu hóa website WordPress. Tính năng này không chỉ giúp người đọc dễ dàng khám phá nội dung mới mà còn tăng thời gian ở lại trang web, cải thiện trải nghiệm người dùng và thúc đẩy SEO. Bài viết này sẽ cung cấp một hướng dẫn chi tiết về cách hiển thị bài viết gần đây trong WordPress, bao gồm các phương pháp khác nhau và cách tùy chỉnh giao diện để phù hợp với nhu cầu của bạn.

Tại Sao Cần Hiển Thị Bài Viết Gần Đây?

Việc hiển thị bài viết gần đây mang lại nhiều lợi ích cho website của bạn:

  • Tăng khả năng khám phá nội dung: Giúp người dùng dễ dàng tìm thấy các bài viết mới nhất mà họ có thể quan tâm.
  • Cải thiện trải nghiệm người dùng: Tạo điều kiện thuận lợi cho người dùng điều hướng trên trang web của bạn.
  • Tăng thời gian ở lại trang web: Khuyến khích người dùng đọc thêm nhiều bài viết hơn.
  • Thúc đẩy SEO: Cải thiện cấu trúc liên kết nội bộ, giúp công cụ tìm kiếm dễ dàng thu thập thông tin và lập chỉ mục trang web của bạn.

Các Phương Pháp Hiển Thị Bài Viết Gần Đây trong WordPress

Có nhiều cách để hiển thị bài viết gần đây trong WordPress. Chúng ta sẽ xem xét các phương pháp phổ biến nhất, từ việc sử dụng widget tích hợp đến các plugin chuyên dụng và tùy chỉnh code.

Sử Dụng Widget “Bài Viết Gần Đây” (Recent Posts Widget)

Đây là cách đơn giản và nhanh chóng nhất để hiển thị bài viết gần đây. WordPress đã tích hợp sẵn widget “Bài Viết Gần Đây” mà bạn có thể dễ dàng thêm vào sidebar hoặc footer của trang web.

  1. Truy cập Dashboard WordPress: Đăng nhập vào trang quản trị WordPress của bạn.
  2. Đi đến “Appearance” -> “Widgets”: Tìm và nhấp vào mục “Widgets” trong menu “Appearance”.
  3. Tìm Widget “Bài Viết Gần Đây”: Kéo widget “Bài Viết Gần Đây” từ danh sách các widget có sẵn vào vị trí bạn muốn hiển thị (ví dụ: Sidebar, Footer).
  4. Cấu Hình Widget:
    • Title: Nhập tiêu đề cho widget (ví dụ: “Bài Viết Mới Nhất”, “Đọc Thêm”).
    • Number of posts to show: Chọn số lượng bài viết bạn muốn hiển thị.
    • Display post date?: Chọn có hiển thị ngày đăng bài hay không.
  5. Lưu Thay Đổi: Nhấn nút “Save” để lưu các thay đổi.

Sử Dụng Plugin WordPress

Nếu bạn muốn có nhiều tùy chọn tùy chỉnh hơn, bạn có thể sử dụng các plugin WordPress chuyên dụng để hiển thị bài viết gần đây. Có rất nhiều plugin miễn phí và trả phí có sẵn trên kho plugin WordPress. Một số plugin phổ biến bao gồm:

  • Recent Posts Widget With Thumbnails: Cho phép hiển thị ảnh thumbnail của bài viết gần đây.
  • Display Posts: Một plugin linh hoạt cho phép hiển thị bài viết theo nhiều tiêu chí khác nhau (ví dụ: theo category, tag).
  • Advanced Recent Posts: Cung cấp nhiều tùy chọn tùy chỉnh giao diện và chức năng.

Hướng dẫn cài đặt và sử dụng plugin:

  1. Truy cập Dashboard WordPress: Đăng nhập vào trang quản trị WordPress của bạn.
  2. Đi đến “Plugins” -> “Add New”: Tìm và nhấp vào mục “Add New” trong menu “Plugins”.
  3. Tìm Kiếm Plugin: Nhập tên plugin bạn muốn cài đặt vào ô tìm kiếm (ví dụ: “Recent Posts Widget With Thumbnails”).
  4. Cài Đặt và Kích Hoạt Plugin: Nhấp vào nút “Install Now” để cài đặt plugin, sau đó nhấp vào nút “Activate” để kích hoạt plugin.
  5. Cấu Hình Plugin: Truy cập trang cấu hình của plugin (thường nằm trong menu “Appearance” -> “Widgets” hoặc “Settings”) và tùy chỉnh các thiết lập theo ý muốn.
  6. Thêm Widget vào Sidebar/Footer: Kéo widget của plugin vào vị trí bạn muốn hiển thị (ví dụ: Sidebar, Footer) và lưu thay đổi.

Tùy Chỉnh Code (Sử Dụng PHP)

Nếu bạn có kiến thức về PHP và WordPress theme development, bạn có thể tùy chỉnh code để hiển thị bài viết gần đây theo cách bạn muốn. Phương pháp này đòi hỏi kiến thức kỹ thuật nhưng cho phép bạn kiểm soát hoàn toàn giao diện và chức năng.

Ví dụ code (sử dụng WP_Query):


<?php
$args = array(
  'posts_per_page' => 5, // Số lượng bài viết hiển thị
  'orderby' => 'date', // Sắp xếp theo ngày
  'order' => 'DESC' // Sắp xếp giảm dần (mới nhất trước)
);

$the_query = new WP_Query( $args );

if ( $the_query->have_posts() ) {
  echo '<ul>';
  while ( $the_query->have_posts() ) {
    $the_query->the_post();
    echo '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
  }
  echo '</ul>';
  wp_reset_postdata();
} else {
  echo '<p>Không có bài viết nào.</p>';
}
?>

Hướng dẫn sử dụng code:

  1. Truy cập File Theme: Tìm file template mà bạn muốn thêm code (ví dụ: sidebar.php, footer.php). Lưu ý: Nên sử dụng Child Theme để tránh mất thay đổi khi theme được cập nhật.
  2. Chèn Code: Thêm đoạn code PHP trên vào vị trí bạn muốn hiển thị bài viết gần đây.
  3. Tùy Chỉnh Code: Thay đổi các tham số trong mảng `$args` để tùy chỉnh số lượng bài viết, cách sắp xếp, v.v.
  4. Lưu Thay Đổi: Lưu file template.

Sử Dụng Gutenberg Blocks

Nếu bạn đang sử dụng WordPress với trình soạn thảo Gutenberg, bạn có thể sử dụng các block có sẵn hoặc cài đặt plugin bổ sung để hiển thị bài viết gần đây.

  • Recent Posts Block: WordPress có một block “Recent Posts” tích hợp sẵn mà bạn có thể sử dụng. Bạn có thể tùy chỉnh số lượng bài viết hiển thị, hiển thị ngày đăng, và hiển thị trích đoạn (excerpt).
  • Plugin Gutenberg Blocks: Một số plugin cung cấp các block Gutenberg mở rộng với nhiều tùy chọn tùy chỉnh hơn cho việc hiển thị bài viết gần đây (ví dụ: ảnh thumbnail, bố cục khác nhau).

Tùy Chỉnh Giao Diện Bài Viết Gần Đây

Sau khi đã hiển thị bài viết gần đây, bạn có thể tùy chỉnh giao diện để phù hợp với thiết kế tổng thể của website.

Sử Dụng CSS

Bạn có thể sử dụng CSS để tùy chỉnh kiểu dáng của danh sách bài viết gần đây. Bạn có thể thêm CSS vào file `style.css` của theme (hoặc tốt hơn là child theme) hoặc sử dụng tùy chọn “Customize” -> “Additional CSS” trong WordPress.

Ví dụ CSS:


.widget_recent_entries ul {
  list-style: none; /* Loại bỏ dấu chấm đầu dòng */
  padding: 0;
  margin: 0;
}

.widget_recent_entries li {
  margin-bottom: 10px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
}

.widget_recent_entries a {
  text-decoration: none;
  color: #333;
}

.widget_recent_entries a:hover {
  color: #0073aa;
}

Tùy Chỉnh Template

Nếu bạn muốn tùy chỉnh sâu hơn, bạn có thể chỉnh sửa template của widget hoặc block. Tuy nhiên, phương pháp này đòi hỏi kiến thức về WordPress theme development.

Lưu Ý Quan Trọng

  • Sử Dụng Child Theme: Luôn sử dụng child theme khi chỉnh sửa code để tránh mất thay đổi khi theme được cập nhật.
  • Sao Lưu Trang Web: Trước khi thực hiện bất kỳ thay đổi lớn nào, hãy sao lưu trang web của bạn để phòng trường hợp xảy ra lỗi.
  • Kiểm Tra Tốc Độ Trang Web: Việc hiển thị quá nhiều bài viết gần đây hoặc sử dụng các plugin phức tạp có thể ảnh hưởng đến tốc độ trang web. Hãy kiểm tra tốc độ trang web sau khi thực hiện các thay đổi.

Kết Luận

Hiển thị bài viết gần đây là một cách hiệu quả để cải thiện trải nghiệm người dùng và thúc đẩy SEO cho website WordPress của bạn. Bạn có thể sử dụng widget tích hợp sẵn, plugin hoặc tùy chỉnh code để đạt được kết quả mong muốn. Hãy thử nghiệm các phương pháp khác nhau và tùy chỉnh giao diện để phù hợp với nhu cầu cụ thể của bạn.

Related Topics by Tag
, , , ,

..