Home WordpressLập Trình Theme Wordpress Cách tạo Readmore (Xem thêm) trong WordPress

Cách tạo Readmore (Xem thêm) trong WordPress

by admincp

Khi hiển thị bài viết trong WordPress ở trang chủ hay trang chuyên mục thông thường chỉ hiển hình ảnh, tiêu đề và một đoạn mô tả ngắn. Đoạn mô tả đó sẽ dùng hàm the_excerpt(); được WordPress hỗ trợ. Tuy nhiên nếu không tùy chỉnh nó sẽ hiện ra dấu ba chấm […] như thế này trông rất xấu.

Nếu bạn đang muốn sửa lại […] thành … hay thêm “Readmore” hoặc là “Xem thêm” mà chưa biết cách để làm bài viết này mình sẽ hướng dẫn chi tiết về cách tạo nút Readmore.

Hướng dẫn cách tạo nút Readmore trong WordPress

Để thực hiện bạn sẽ sử dụng Action Filter bằng cách chèn đoạn code này vào dưới cùng file functions.php

function new_excerpt_length($length) {
return 30;
}
add_filter('excerpt_length', 'new_excerpt_length');

Khi thêm đoạn mã này vào nó sẽ giới hạn độ dài ký tự (Limit excerpt length) hiển thị là 30 trong WordPress.

Nếu muốn thêm chữ Read more thì dùng đoạn mã này

function new_excerpt_more($more) {
return '...<a href="'.%20get_permalink()%20.%20<span%20class="hljs-string">'">' . ' Xem thêm' . '</a>';
}
add_filter('excerpt_more', 'new_excerpt_more');

Trong trường hợp nút đọc thêm chưa được viết trên Theme thì bạn thêm đoạn mã này ngay bên dưới <?php the_excerpt(); ?> (Nó sẽ nằm trong file template-parts/content.php)

<div class="readmore"><a href="<?php the_permalink();?>">Đọc thêm</a></div>

Chỉnh CSS một chút cho đẹp hơn, bạn cho nó vào file style.css

.readmore a{
background: #007bff;
color: #fff;
border-radius: 4px;
padding: 6px 15px;
}

Rất đơn giản phải không nào anh em? Button Xem thêm trong là một chức năng tuy đơn giản nhưng nếu bạn muốn trang trí blog đẹp hơn thì cũng không nên bỏ qua.

You may also like

Leave a Comment