Gravatar là một dịch vụ kết nối địa chỉ email của người dùng với một hình ảnh. Các theme WordPress hiển thị Gravatar với kích thước đã định sẵn, nhưng bạn có thể muốn làm cho những hình ảnh này nhỏ hơn hoặc lớn hơn để phù hợp hơn với thiết kế của trang web thì làm như thế nào? Trong bài viết này, Vietnix sẽ hướng dẫn bạn cách thay đổi kích thước hình ảnh Gravatar trong WordPress.
Tại sao cần thay đổi kích thước ảnh Gravatar trong WordPress?
Gravatar viết tắt của Globally Recognized Avatar. Đây là một dịch vụ web cho phép bạn tạo hồ sơ và liên kết ảnh đại diện với địa chỉ email của bạn. Hầu hết các theme WordPress hiển thị Gravatar bên cạnh bình luận của người dùng, một số theme cũng hiển thị Gravatar trong hộp tiểu sử của tác giả. Ngay cả khi người dùng không có tài khoản Gravatar, trang web của bạn vẫn hiển thị một trong số các Gravatar mặc định của WordPress.
Đôi khi bạn có thể muốn thay đổi kích thước của Gravatar trong theme của mình.
Ví dụ, bạn có thể muốn làm cho chúng lớn hơn để nổi bật. Điều này có thể thu hút sự chú ý của người truy cập đến phần bình luận trên trang web và giúp bạn nhận được nhiều bình luận hơn trên các bài viết WordPress.
Ngoài các nội dung trong bài, bạn cũng có thể tham khảo:
Xem thêm: Kích thước ảnh bìa Zalo chuẩn xác nhất
1. Cách thay đổi kích thước hình ảnh Gravatar trong WordPress bằng trình chỉnh sửa toàn bộ trang
Nếu bạn đang sử dụng một theme dựa trên block như ThemeIsle Hestia Pro hoặc Twenty Twenty-Three, bạn có thể thay đổi kích thước Gravatar bằng cách sử dụng trình chỉnh sửa toàn bộ trang. Phương pháp này không hoạt động với tất cả các theme, vì vậy nếu bạn không sử dụng một theme có block-enabled, chúng tôi khuyến nghị bạn sử dụng phương pháp 2.
Lưu ý: Cách này chỉ áp dụng cho theme block
Trong bảng điều khiển WordPress, chọn Appearance » Editor
Trên menu bên trái, bạn có thể chọn chỉnh sửa template hoặc một phần template. Để thay đổi kích thước Gravatar cho các bình luận WordPress, thông thường bạn sẽ chọn ‘Template Parts‘ từ menu bên trái.
Sau đó, chỉ cần nhấp vào ‘Comments‘.
Bây giờ bạn có thể nhấp để chọn phần template comments.
Điều này mở ra một menu mới với các cài đặt mà bạn có thể sử dụng để tùy chỉnh phần template bình luận.
Bây giờ, bạn có thể tiến tới và nhấp vào bất kỳ Gravatar nào trong bản xem trước trực tiếp.
Trong menu bên phải, nếu chưa được chọn, bạn có thể chọn tab Block.
Bây giờ, bạn có thể làm cho Gravatar lớn hơn hoặc nhỏ hơn bằng cách kéo thanh trượt Image Size.
Khi bạn di chuyển thanh trượt, tất cả các Gravatar sẽ được cập nhật tự động, vì vậy bạn có thể thử các kích thước khác nhau để xem cái nào trông tốt nhất.
Khi bạn hài lòng với những thay đổi đã thực hiện, hãy nhấp vào nút Save.
Bây giờ, nếu bạn truy cập vào bất kỳ phần bình luận nào trên trang web WordPress của bạn, bạn sẽ thấy những thay đổi được áp dụng ngay lập tức.
Ngoài thay đổi kích thước hình ảnh Gravatar trong WordPress, bạn còn có thể biết thêm các cách điều chỉnh hình ảnh khác nhờ đọc các bài viết tại website Vietnix như chỉnh kích thước ảnh, đổi ảnh bìa,…
2. Cách thay đổi kích thước hình ảnh Gravatar trong WordPress cho phần bình luận
Nếu bạn không sử dụng theme WordPress có block-enabled, bạn có thể thay đổi kích thước Gravatar cho phần bình luận trong WordPress bằng mã code. Phương pháp này yêu cầu bạn chỉnh sửa các file theme, do đó không phải là lựa chọn phù hợp cho người mới bắt đầu.
Tuy nhiên, phương pháp này có thể hoạt động với hầu hết các theme WordPress.
Nếu bạn chỉnh sửa trực tiếp các file theme WordPress của mình, những thay đổi đó sẽ mất đi khi bạn cập nhật theme. Vì vậy, chúng tôi khuyên bạn nên tạo một child theme, vì điều này cho phép bạn cập nhật theme WordPress mà không mất đi tùy chỉnh.
Sau khi tạo child theme, bạn cần kết nối với trang web WordPress của bạn bằng một ứng dụng FTP như FileZilla, hoặc bạn có thể sử dụng trình quản lý file trong cPanel của dịch vụ lưu trữ WordPress.
Sau khi kết nối thành công, bạn cần truy cập vào thư mục /wp-content/themes/ và mở thư mục của theme WordPress hiện tại của bạn.
Khi ở đây, mở file comments.php và tìm một hàm wp_list_comments. Trong hàm này, bạn sẽ tìm thấy avatar_size để đặt kích thước của Gravatar.
Dưới đây là một ví dụ:
<?php
wp_list_comments(
array(
'avatar_size' => 60,
'style' => 'ol',
'short_ping' => true,
)
);
?>Bạn có thể dễ dàng thay đổi avatar_size thành kích thước bạn muốn sử dụng. Trong đoạn mã trên, điều này có nghĩa là thay đổi số 60 thành một số khác.
Gravatars có hình vuông, vì vậy WordPress sẽ sử dụng cùng một giá trị cho chiều rộng và chiều cao của hình ảnh. Điều này có nghĩa là bạn chỉ cần nhập một số duy nhất. Sau khi thay đổi, hãy đảm bảo lưu và tải lại file lên tài khoản lưu trữ WordPress.
Khi bạn hoàn thành, bạn có thể truy cập blog WordPress của mình để xem thay đổi.
Nếu hình Gravatar vẫn chưa thay đổi, có thể do bộ nhớ cache hoặc có thể CSS của theme đang ghi đè lên các cài đặt trong file comments.php. Bạn có thể kiểm tra xem điều này có xảy ra bằng cách sử dụng công cụ Inspect trong trình duyệt của bạn.
Các bước sẽ khác nhau tùy thuộc vào trình duyệt bạn đang sử dụng, nhưng trên Chrome, bạn chỉ cần nhấp chuột phải hoặc nhấn Ctrl-click vào Gravatar, sau đó chọn ‘Inspect‘.
Điều này sẽ hiển thị mã HTML và CSS của trang trong một bảng điều khiển mới.
Trong mã này, bạn cần tìm các giá trị chiều cao và chiều rộng.
Nếu kích thước khác với những gì bạn đã chỉ định trong file comments.php, điều này có nghĩa là file style.css của theme đang ghi đè lên những thay đổi của bạn. Nếu đúng như vậy, hãy chuyển lại FTP client. Bây giờ bạn có thể mở thư mục của theme và sau đó mở file style.css.
Ở đây, tìm kiếm một đoạn mã có từ khóa “avatar“.
Thường bạn sẽ tìm thấy điều này trong một lớp CSS comment-author .avatar, như ví dụ sau:
.comment-author .avatar {
height: 42px;
position: relative;
top: 0.25em;
width: 42px;
}Bây giờ, bạn có thể tiến hành thay đổi chiều rộng và chiều cao thành các giá trị mà bạn muốn cho Gravatar của mình sau đó, chỉ cần lưu các thay đổi của bạn. Nếu bạn truy cập vào blog hoặc trang web WordPress, bạn sẽ thấy các hình ảnh Gravatar đã được cập nhật.
Tại sao Vietnix khuyên bạn nên thử thay đổi kích thước Gravatar trong file comments.php trước khi sử dụng phương pháp CSS dễ dàng hơn?
Thứ nhất, CSS đôi khi có thể làm cho Gravatar trở nên mờ, đặc biệt là nếu bạn làm cho các hình ảnh avatar lớn hơn nhiều so với hình ảnh gốc. Thứ hai, việc thay đổi kích thước ảnh trong comments.php thường giúp trang web của bạn tải nhanh hơn.
Để website của bạn trông đẹp mắt hơn, bạn có thể điều chỉnh hình ảnh, kích thước hình, chỉnh lỗi ảnh mờ khi upload dễ dàng hơn khi tham khảo các bài viết cùng chủ đề tại trang web Vietnix.
3. Cách thay đổi kích thước hình ảnh Gravatar trong WordPress ở phần tiêu sử tác giả
Nếu bạn điều hành một trang web WordPress có nhiều tác giả, thì việc tạo khung chứa thông tin có thể giúp độc giả tìm hiểu thêm về tác giả bài viết.
Nhiều phần giới thiệu tác giả hiển thị Gravatar của người viết cùng với tiểu sử của họ. Để thay đổi kích thước Gravatar mặc định trong các hộp giới thiệu tác giả, bạn cần tìm file giao diện thêm vào phần giới thiệu.
Chỉ cần kết nối với trang web của bạn bằng một công cụ FTP như FileZilla hoặc trình quản lý file của dịch vụ lưu trữ WordPress. Khi bạn đã kết nối thành công, điều hướng đến /wp-content/themes/ và mở thư mục của theme WordPress hiện tại.
Sau đó, bạn cần mở thư mục template-parts.
Bây giờ, bạn cần tìm file chứa mã get_avatar. Thông thường, bạn sẽ tìm thấy mã này trong file template part có tên author-bio.php, file single.php, file functions.php hoặc tương tự.
Dưới đây là một ví dụ về cách mã này có thể được hiển thị:
<div class="author-bio <?php echo get_option( 'show_avatars' ) ? 'show-avatars' : ''; ?>">
<?php echo get_avatar( get_the_author_meta( 'ID' ), '85' ); ?>Trong đoạn mã trên, bạn có thể đơn giản thay đổi số 85 thành kích thước bạn muốn sử dụng.
Trong một số theme khác, mã có thể trông như sau:
get_avatar( get_the_author_meta( 'user_email' ), 85);Bạn chỉ cần thay thế số đó bằng giá trị bạn muốn sử dụng để làm cho Gravatar lớn hơn hoặc nhỏ hơn. Sau khi thay đổi kích thước, đừng quên lưu lại những thay đổi của bạn. Sau đó, bạn có thể truy cập trang web của mình để xem hộp thông tin tác giả mới hoạt động. Nếu Gravatars không thay đổi, bạn sẽ cần tìm kiếm lớp avatar trong file style.css bằng cách làm theo quy trình đã mô tả ở trên. Khi bạn tìm thấy lớp này, bạn có thể nhập giá trị chiều cao và chiều rộng mới cho Gravatar.
Lời kết
Chúng tôi hy vọng hướng dẫn này đã giúp bạn biết cách thay đổi kích thước hình ảnh Gravatar trong WordPress. Có thể giúp ích được cho bạn, tổ chức và doanh nghiệp của bạn, mọi thắc mắc hãy để lại bình luận bên dưới bài viết nhé. Vietnix sẽ giải đáp ngay!
