Bài viết được nhận xét nhiều nhất với 05 khung màu

Để sở hữu mẫu "Bài viết được nhận xét nhiều nhất" như trên trang www.vietnamguidebook.blogspot.com, cần thực hiện qua 05 bước.


Bước 01: Đăng nhập vào www.blogger.com. 
                Nhấp chuột vào Mẫu (template), rồi "Chỉnh sửa mẫu" (Edit Html)

Bước 02: Đưa chuột vào khu vực mã code loằng nhoằng. Nhấn Ctrl - F, hiện hộp tìm kiếm
                Dán </Group> vào hộp tìm kiếm

Bước 03: Ngay dưới </Group>, dán toàn bộ mã code sau

<Group description="Most Commented" selector=".most-commented">
<Variable name="most.commented.background1" description="background color1" type="color" default="#fa4242" value="#ee377a"/>
<Variable name="most.commented.background2" description="background color2" type="color" default="#ee6107" value="#fcad37"/>
<Variable name="most.commented.background3" description="background color3" type="color" default="#f0f" value="#f8e000"/>
<Variable name="most.commented.background4" description="background color4" type="color" default="#ff0" value="#c7e93d"/>
<Variable name="most.commented.background5" description="background color5" type="color" default="#0ff" value="#5ebded"/>
</Group>


Bước 04: Trong hộp tìm kiếm, dán vào tìm ]]></b:skin>

(Hoặc nhấn vào nút mũi tên màu đen <b:skin>...</b:skin>. Nó sẽ tự nhã ra. Bạn kéo xuống tận cùng, sẽ thấy ]]></b:skin>)

Ngay trên ]]></b:skin>

 .comment-count {
    padding: 3px 10px;
    background: #fff;
    color: #000;
    font-size: 10px;
    float: right;
}

.most-commented ul {
    padding: 0px !important;
    font-family: Century Gothic, sans-serif;
}

.most-commented ul li {
    list-style-type: none;
    padding: 10px;
    color: #555;
    margin-top: -10px;
}

.most-commented ul li a {
    color: #444;
    font-weight: bold;
    text-decoration: none;
    font-size: 11px;
}

.most-commented ul li img {
    float: left;
    margin: 0px 5px 0px 0px;
    width: 60px;
    height: 60px;
}

.most-commented:nth-child(3n+0) {
    background: $(most.commented.background1);
    width: 100%;
}

.most-commented:nth-child(4n+0) {
    background: $(most.commented.background2);
    width: 95%;
}

.most-commented:nth-child(5n+0) {
    background: $(most.commented.background3);
    width: 90%;
}

.most-commented:nth-child(6n+0) {
    background: $(most.commented.background4);
    width: 85%;
}

.most-commented:nth-child(7n+0) {
    background: $(most.commented.background5);
    width: 80%;
}


Bước 05: Lưu mẫu và tận hưởng thành quả.

(Thủ thuật được cung cấp bởi http://helplogger.blogspot.com)