Tạo Banner Quảng Cáo tự động thay đổi cho Web - Blog

.

Một thủ thuật hay, thuận lợi trong việc quãng cáo mà bạn không phải tốn nhều Widget thiết kế, tất cả chỉ trong một, cứ mỗi lần tự thay đổi banner sẽ tự động trỏ link về nơi mà bạn có chủ ý thiết kế.

hình ảnh quãng cáo cho các thương vụ cứ theo một chu kỳ trình tự mà thay đổi, trong một mãng Array xếp đặt.

Các bước thực hiện đơn giản như sau:

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

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

3- Click vào Thêm tiện ích (Add Widget)

4- Tạo một tiện ích  HTML/JavaScript  và dán đoạn code sau đây vào tiện ích HTML/JavaScript 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ả, chỉ có bao nhiêu đấy thôi đó các bạn.

Chú thích:

• 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 thay đổi  banner. Bạn có thể điều chỉnh con số này tùy thích.

DEMO:

http://khanhgnuyendemo.blogspot.com/2016/09/tao-banner-quang-cao-ngau-nhien-cho.html

Các bạn có thể tự làm được rồi đó. Chúc các bạn thành công.

Chúc các bạn thành công.
Sưu tập: Nguyễn Đạt Khánh

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..