Có một số thủ thuật giúp chúng ta tùy biến genesis theme một cách dễ dàng, trong đó có đầy đủ những thứ để bạn có thể tự desing trang web của bạn một các dễ dàng, và tôi muốn chia sẻ với các bạn những bí mật này trong thư mục genesis framework, có lẽ nó sẽ cần thiết khi chúng ta bắt tay vào bất cứ dự án nào.
Và trong số đó, bài viết hôm nay bạn sẽ được học cách thêm ảnh đại diện của người đăng bài vào đầu trang, cụ thể chúng ta sẽ dưa nó lên genesis_entry_header ngay sau phần ảnh nổi bật và kết hợp một số thủ thuật CSS giúp cho trang web của bạn hiển thị một cách chuyên nguyệt hơn, đây là một bài viết khá đơn giản, vì vậy bạn chỉ cần sao chép những đoạn mã vào functions.php để nó hoạt động mà thôi.
Chú ý: Bài viết này được hướng dẫn trên themes Ambiance Pro của studiopress.com, nên chắc chắn là nó sẽ hoạt động trên một số themes khác có cùng chức năng hiển ảnh tiêu biểu trên phần head của website, tương tự đối với showcase Pro bạn cũng có thể áp dụng phương pháp này.
Hướng dẫn thêm avatar vào đầu bài viết genesis
Chúng ta sẽ làm việc này qua hai bước và bước đầu tiên sẽ là thêm các chức năng cần thiết vào tập tin chủ đề của bạn bằng cách sao chép toàn bộ mã bên dưới dán vào functions.
//* Output gravatar before entry title
add_action( 'genesis_entry_header', 'ambiance_gravatar', 7 );
function ambiance_gravatar() {
if ( is_singular(array( 'post', 'page' ) ) ) {
echo '';
echo get_avatar( get_the_author_meta( 'user_email' ), 240 );
echo '';
}
}
Chúng ta sẽ thêm các hiệu ứng CSS cho phù hợp với chủ đề của bạn.
Sao chép toàn bộ mã dán vào style.css
.page .entry-avatar .avatar {
margin-top: -125px;
}
@media only screen and (max-width: 980px) {
.page .entry-avatar .avatar {
margin-top: -65px;
}
}
Tiếp theo chúng ta sẽ lưu lại toàn bộ kết quả và hãy quay lại bài viết của bạn và ấn F5 để tại loại toàn bộ trang.
Chú ý: Hãy sử dụng một số plugin hưu ích như rocket để xóa cache trang web một cách hiệu quả, xem qua bài viết hướng dẫn sử dụng wp rocket.
ĐÓ, đó là những gì chúng ta phải làm để có thể tùy biến avatar vào bài viết trong genesis framewok. Hãy cho tôi biết thắc mắc của bạn về chủ đề này.
Vũ đức Mạnh
