Cách hiển thị các bài viết gần đây trên trang 404 của GeneratePress?

31/08/2022

Trong hướng dẫn này, bạn sẽ học cách hiển thị các bài viết gần đây trên trang 404 trong GeneratePress Theme.

Trang 404  là trang hiển thị kết quả Không tìm thấy

404 Page not Found là mã chuẩn của Giao thức truyền siêu văn bản cho biết rằng máy chủ hoặc trang web không thể phản hồi các tài nguyên được yêu cầu.

Trên thực tế, không tìm thấy trang 404 là lỗi phổ biến nhất trên trang web. Khi ai đó nhập nhầm URL sai thì kết quả chuyển thành lỗi 404 thay vì hiển thị bài đăng blog thực sự.

Đôi khi lỗi 404 xảy ra khi trang hoặc bài đăng được lập chỉ mục trong SERPs của Google nhưng bài đăng trên blog thực tế bị xóa khỏi trang web.

Ở đây trong hướng dẫn này, chúng ta sẽ không sửa lỗi 404 thay vào đó, chúng ta sẽ thêm các bài đăng gần đây trong wordpress sau hộp tìm kiếm trong trang 404 not found.

trang 404

Hiển thị các bài viết gần đây trên trang 404 cho GeneratePress

Trên thực tế, chúng ta sẽ sử dụng Hook trong GeneratePess để hiển thị các bài đăng gần đây trong trang 404.

Bạn không thể triển khai hướng dẫn này trong phiên bản GeneratePress miễn phí thay vì bạn cần phiên bản GP Premium.

Trước khi tiếp tục hướng dẫn Hơn nữa, bạn cần phải Cài đặt WP Shows Posts Plugin. Đây là plugin do GeneratePress phát triển luôn, nên bạn yên tâm nhé.

Tiếp theo, bạn cần kích hoạt Mô-đun Elements trong  GeneratePress Premium.

Appearance> GeneratePress> Elements> Activate

Sau đó, hãy đi từng bước để hiển thị các bài viết gần đây trên trang 404 Not Found.

bài viết gần đây trên trang 404

Bước 1: Cài đặt WP show post

  • Đi tới WP show post > add new.
  • Đặt tên cho danh sách mới là Bài đăng gần đây trên trang 404.
  • Đi tới Post Phần> Post type là  post. Taxonomy là category. Chọn tất cả các categories trong Term. Post per page có thể chọn là 10. Đây là bắt buộc chọn để hiển thị trên trang 404.
bài viết gần đây trên trang 404
  • Chuyển đến Cột phần> Cột chọn 1 cột. Columns gutter để mặc định.
bài viết gần đây trên trang 404
  • Phần Hình ảnh để trống (Bỏ chọn Mọi thứ).
  • Tiếp theo, đi đến nội Content> Content type là None. Chọn Include title. Title element chọn “p”. Để tất cả những thứ khác như mặc định.
  • Chuyển đến Meta > Bỏ chọn tất cả cài đặt.
  • Đi tới Cài đặt khác > Để mặc định.
  • Hãy nhớ shortcode / chức năng nằm ở phía bên phải.
bài viết gần đây trên trang 404

Bước 2: Thêm các phần tử mới trong Generate để hiển thị bài viết gần đây trên trang 404

  • Nhấn vào Appearance> Elements> Add New
  • Chọn loại phần tử làm Hook. Đặt tên nó là Bài đăng gần đây trong trang 404.
  • Sao chép và dán hàm / shortcode từ WP Show Posts.
  • Đi tới Hook Cài đặt và chọn hook để hiển thị là after_content và tick chọn Execute Shortcodes.
  • Đi tới Display Rules và chọn Location 404 TemplateNo Search Results.
bài viết gần đây trên trang 404
  • Cuối cùng, nhấn nút Publish.

Lưu ý: Thay thế phần sau bằng mã ngắn chức năng của bạn.

<div class = "recent404"> <p> Có thể những bài viết sau sẽ giúp ích cho bạn: </p> </div>
[wp_show_posts id="861"]

Bước 3: Tạo kiểu cho các bài đăng gần đây trong 404 trang.

  • Chuyển đến Appearance > Customize > Additional CSS
  • Sử dụng mã CSS có sẵn bên dưới để tạo kiểu cho các bài đăng gần đây.
  • Ghi nhớ Lớp CSS và ID của bạn và thay đổi chúng cho phù hợp (Nếu cần).
.recent404 {margin-top: 20px;}#wpsp-861 {padding: 5px 0 0 20px;font-weight: bold;font-size: 18px;}#wpsp-861 p{margin: -10px 0;}#wpsp-861 p::before{content: "• ";color: #1b78e2;}

Tóm lại

Hy vọng bạn sẽ có thể hiển thị các bài viết gần đây trên trang 404 trong  GeneratePress với sự trợ giúp của hướng dẫn này.

Hiển thị các bài đăng gần đây trong các trang lỗi 404 giúp tăng thời gian dừng và giảm tỷ lệ thoát của trang web. 

Nếu bạn có bất kỳ lỗi nào liên quan đến hướng dẫn hiển thị bài viết gần đây trên trang 404 này thì đừng quên bình luận bên dưới.

5 1 vote
Article Rating
Share:
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
smartphonechart-barsrocket
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram