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 ích HTML/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 ý.
Nhận xét
không hiểu chỗ này:
Trả lờiXóaban[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";
là nhét cái gì thay thế vào đó, nam cho mình vd cái nhé. cảm ơn.
Mình đã cập nhật hướng dẫn trong bài viết bạn xem ại nha,
Xóacảm ơn bạn về chia sẻ này nha.bạn ơi cho mình hỏi thêm bạn có thể làm cho nó ẩn hiện ở góc phải blog đồng thời chạy luôn phiên được không.hoặc bạn chỉ cho mình thêm code gì để điều chỉnh độ rộng cho banner được không?
Trả lờiXóacảm ơn bạn nhiều nha
Ý bạn là cho nó hiển thị dạng popup ở góc phải của blog hả.
XóaVấn đề độ rộng bạn hãy chỉnh trực tiếp file ảnh của bạn nha,
Nam ơi.Để đưa Banner vào phần đầu trang web đó thì làm thế nào?
Trả lờiXóabạn tạo môt tiện ích HTML/Javascripts ở đầu trang đó và dán nó vào. Nếu header chưa có phần thêm tiện ích bạn có thể xem bài viết này:
XóaChia header blogspot thành 2 phần
Hoặc bài này Tạo khung "Thêm tiện ích" (Add Widget) cho Header của blogger
Bạn ơi sao mình thêm phần code vào, thay hình ảnh, mà hình ảnh nó lại không hiển thị đúng hình ảnh mà mình đã làm vậy, mình làm 3 cái khác nhau mà nó chỉ hiển thị đúng 1 cái, 1 cái không đúng như ảnh đã làm, và 1 cái bị trắng xóa
Trả lờiXóacái này chỉ dùng được cho một widget thôi anh. Mình thử dùng với widget thứ 2 trong cùng một blogspot thì thấy một cái được một cái không. Không biết có phải bị xung đột không? giả quyết thế nào vậy bạn
Trả lờiXóa