Tạo Avatar bo tròn góc phần comment của Blogger

Giao diện blogger là một phần quan trọng quyết định lượng truy cập cho blog của bạn. Blog load nhanh, giao diện đẹp sẽ làm người xem thích thú và có thể sẽ quay trở lại trong những lần sau. Bài viết này sẽ hướng tạo avatar trong phần bình luận (comment) ấn tượng, đó là bo tròn hình avatar.

Cố định kích thước avatar. 
Có nhiều loại templates có những mẫu kích thướng avatar không đều nhau trông rất xấu, vì thế bạn cần cố định kích thước tất cả các avatar cho đều nhau.

Bước 1: Vào blogger > Mẫu > Chỉnh sửa HTML
Bước 2: Chèn code bên dưới vào trước ]]></b:skin>

.avatar-image-container,
.avatar-image-container img{
 max-width:50px;
width:50pxt;
max-height:50px;
height:50px;
padding: 0;
border:0px;
}

Kích cỡ mặc định là 50px, bạn có thể chỉnh sửa lại theo ý thích

Bước 3: Lưu lại

Làm cách nào để avavtar của các blogger khi comments được bao quanh hình tròn?

Bước 1: Vào blogger > Mẫu > Chỉnh sửa HTML
Bước 2: Chèn code bên dười trước ]]></b:skin>

.avatar-image-container,
.avatar-image-container img {
 max-width: 50px;
 width: 50px;
 max-height: 50px;
 height: 50px;
 padding: 0;
 border: 0px;
 -webkit-border-radius: 999px;
 -moz-border-radius: 999px;
 border-radius: 999px;
}
.avatar-image-container{
 border:3px solid #fff;
 -webkit-box-shadow: 0 1px 2px #BBB;
 -moz-box-shadow: 0 1px 2px #BBB;
 box-shadow: 0 1px 2px #BBB;
}

Chỉnh sửa lại những phần chữ được tô vàng cho phù hợp với blog của bạn
Bước 3: Lưu lại

Chúc blog của bạn ngày càng phát triển hơn! Hãy comments và chia sẻ nếu bạn thấy bài viết hay nhé!