Chia sẻ Code thông báo tuyệt đẹp cho blogspot

Các bạn đang muốn chèn thông báo vào blog của mình.sau đây mình xin chia sẻ các tạo thông báo cho blogspot :)

Demo site mình

Demo tổng hợp

Bước 1: các bạn tải icon này :Tại đây

Bước 2 :Vào blog->mẫu-> chỉnh sửa HTML
Chèn code dưới đây trước thẻ ]]></b:skin> :

.warning, .error, .info, .success {
    padding: 20px 20px 20px 40px;
    margin-bottom: 15px;
    border-style: solid;
    border-width: 1px;
    background-position: 10px 10px;
    background-repeat: no-repeat;
}

.warning {
    background-color: #f8fad5;
    background-image: url(images/warning.png);
    border-color: #e5d35b;
}

.error {
    background-color: #f5dfdf;
    background-image: url(images/error.png);
    border-color: #ce9e9e;
}

.info {
    background-color: #dfeff5;
    background-image: url(images/info.png);
    border-color: #9ebcce;
}

.success {
    background-color: #e8f5df;
    background-image: url(images/success.png);
    border-color: #9ece9e;
}

Thay địa chỉ URL trong code thành URL mà bạn up icon vừa giờ lên .

Bước 3. Chèn code dưới đây vào nơi mà bạn muốn hiển thị

<div class="success"> Nội dung bên trong.... </div>
<div class="warning"> Nội dung bên trong.... </div>
 <div class="info"> Nội dung bên trong.... </div>
<div class="error"> Nội dung bên trong.... </div>

Vậy là xong.Chúc bạn thành công!