Cách thay đổi chữ Read more trong theme Genesis đơn giản

[Thủ thuật WordPress] Hướng dẫn cách thay đổi chữ Read more trong theme Genesis đơn giản – Nếu bạn là một người yêu thích theme Genesis thì việc thiết kế lại giao diện cho theme Genesis là điều cần thiết để tạo ra sự khác biệt và phong cách riêng, bạn có cảm thấy chữ “Read more” trong theme Genesis có quá đơn giản hay không, bạn muốn làm nổi bật chữ “Read more” hoặc bạn muốn tùy chỉnh lại theo sở thích của mình vậy phải làm sao? việc thay đổi có đơn giản hay không?

Trong bài viết trước đây về thủ thuật wordpress mình có hướng dẫn các bạn cách tạo icon cho các chuyên mục hiển thị trên Widget giúp bạn có thể dễ dàng tích hợp các Icon cho Widget mà không cần phải sử dụng Plugin, tiếp tục trong bài viết này mình sẽ hướng dẫn các bạn cách thay đổi chữ Read more trong theme Genesis đơn giản giúp bạn có thể dễ dàng tùy biến chữ “Read more” trong theme Genesis.

Cách thay đổi chữ Read more trong theme Genesis

Như bạn đã biết đối với theme Genesis thì bạn cần phải có một giao diện con và mọi thay đổi đều được thực hiện trên giao diện này vì thế mỗi lần theme Genesis được phát hành phiên bản mới thì bạn thỏa mái update lên phiên bản mới mà không sợ phải cấu hình lại. Trong bài viết này blog thủ thuật sẽ hướng dẫn các bạn cách thay đổi chữ Read more trong theme Genesis đơn giản.

#1 Thay đổi chữ Read more

Đầu tiên hãy sao chép đoạn mã bên dưới và dán vào tập tin Function.php của giao diện con đang sử dụng (hãy dán vào trong thẻ <?php).

/** Customize Read More Text */
add_filter( 'excerpt_more', 'child_read_more_link' );
/** Read more link */
add_filter( 'get_the_content_more_link', 'child_read_more_link' );
add_filter( 'the_content_more_link', 'child_read_more_link' );
function child_read_more_link() { 
return '<a class="buttonred" href="' . get_permalink() . '" rel="nofollow">Đọc thêm...</a>';
}

Lưu ý: Thay chữ “Đọc thêm…” thành chữ khác mà bạn muốn!

#2 Sử dụng CSS làm nổi bật

Sau khi thực hiện xong bạn hãy sử đoạn CSS bên dưới để là nổi bật chữ “Đọc thêm”.

.buttonred{
background-color:#222;
border:none;
color:#fff;
cursor:pointer;
font-family:'Arial',sans-serif;
padding:2px 24px;
text-transform:uppercase;
width:auto;
-moz-border-radius:28px;
-webkit-border-radius:28px
}
.buttonred:hover {
    background: none repeat scroll 0 0 #ff9b2f;
}

Bạn có thể tùy biến code theo sở thích của mình bằng cách vô một số trang Web hỗ trợ tạo button online, sau khi tạo xong bạn chỉ cần lấy CSS tương ứng và thực hiện các thay đổi là xong.

Sau khi thực hiện xong nếu trang Web của bạn có sử dụng chức năng tạo Cache thì hãy xóa nó và xóa luôn cache của trình duyệt, khi thực hiện xong bạn sẽ thấy kết quả như bên dưới!

Quá đơn giản để bạn có thể dễ dàng thay đổi chữ Read more trong theme Genesis phải không?

Cuối cùng không có gì hơn nếu bạn cảm thấy bài viết có ích hãy subscribe blog của mình thường xuyên để cập nhật những bài viết mới nhất qua Email – Chân thành cảm ơn!