Hướng dẫn Tạo banner quảng cáo hiển thị luân phiên trong blog

Đăng bởi Admin | 2/8/13 | 7 nhận xét

Nói đến quảng cáo trên trang web, thông thường tại một không gian web cố định bạn chỉ có thể đặt 1 banner, lấy ví dụ trên phần Header về bên phải bạn chỉ có thể đặt 1 banner có kích thước 468x60 hoặc banner 125x125 ở sidebar. Script sau đây sẽ giúp tạo hiệu ứng chạy luân phiên các banner, từ đó trang web của bạn sẽ trở nên sinh động hơn.

Về cơ bản thủ thuật này hiển thị giống như thủ thuật Tạo Banner quảng cáo hiển thị ngẫu nhiên mà mình giới thiệu trước đây.

☼ Cách thêm banner quảng cáo hiển thị luân phiên:

1- Đăng nhập vào Blog

2- Vào Bố cục (Layout)

3- Bấm vào Thêm tiện ích (Add widget)

4- Tạo một tiện ích HTML/Javascripts và dán đoạn code sau đây vào tiện íchHTML/Javascripts bạn vừa tạo.

<script type="text/javascript">
// Banner Rotation Script by Bloggerism
var ban = new Array();
var link = new Array();
var index = 0;
ban[0] = new Image();
ban[0].src = "URL_banner_0";
link[0] = "URL_link_0";
ban[1] = new Image();
ban[1].src = "URL_banner_1";
link[1] = "URL_link_1";
ban[2] = new Image();
ban[2].src = "URL_banner_2";
link[2] = "URL_link_2";
index = Math.random() * (ban.length);
index = Math.floor(index);
function rotator()
{if (index == ban.length) index = 0;
if (document.images) {
document.images.rotation.src = ban[index].src;
}
else {
document.getElementById('rotation').src=ban[index].src;
}
index++;
setTimeout('rotator()',3000);
}
function go() {window.open(link[index-1]);}
</script>
<img id="rotation" style="cursor:pointer;" src="" onclick="go();"/>
<script type="text/javascript">rotator();</script>

5- Lưu lại và xem kết quả nha.

☼ Tùy chỉnh:

• Thay URL_banner_0, URL_banner_1, URL_banner_2 thành URL của hình ảnh bạn muốn hiển thị trên banner
• Thay URL_link_0, URL_link_1, URL_link_2 thành linh liên kết tới trang cần quảng cáo tương ướng với mỗi bức ảnh ở bên trên.
•  Chú ý số 3000 ám chỉ 3000 mili giây, tương đương 3 giây chỉ khoảng cách giữa các lần chuyển banner. Bạn có thể điều chỉnh con số này tùy ý.

Chúc thành công!

                                                                                          Theo : Namkna
                                                                                          Thu thuat vi tinh