Đầu tiên, bạn cần phải xác định chính xác kích thước của hình ảnh có thể làm banner . Việc này cũng không khó lắm, bạn có thể kiểm tra kích cỡ banner ban đầu của Blog (được tác giả của mã nguồn template sử dụng) rồi tạo 1 banner mới với kích cỡ đó.
Tiếp theo , bạn hãy kiểm tra phần header trong Template của bạn có bất kì đoạn text hay hình ảnh nào không . Nếu có , bạn cần phải xóa chúng để banner không bị các phần tử trên chiếm chỗ.
Bạn cần phải xóa các phần tử tại phần header để giành chỗ cho banner của bạn.
Sau đó, bạn tìm đến đoạn code sau (nằm ở khoảng dưới thẻ <body> ) ...
<div id='top-wrapper'>
... và thêm code này vào ngay bên dưới :<div style='padding-bottom:3px; padding-top:3px;text-align:center;'>
<a href='http://f69dkm.blogspot.com/'>
<script type='text/javascript'>
var banner= new Array()
banner[0]="<img src='http://img24.imageshack.us/img24/1162/banner2009sa2.jpg'/>"
banner[1]="<img src='http://img2.pict.com/13/50/03/4aaab158901452fa0866ebd488/gizp1/800/img24.jpg'/>"
banner[2]="<img src='http://img2.pict.com/2c/96/04/a2f6f5f5c1d56d1946d5a41ae4/GMg11/img29.jpg'/>"
banner[3]="<img src='http://img2.pict.com/9c/09/6a/a23980569839f36a8d3d250567/xbQ69/zawp4.jpg'/>"
var random=Math.round(3*Math.random());
document.write(banner[random]);
</script></a>
</div>
<a href='http://f69dkm.blogspot.com/'>
<script type='text/javascript'>
var banner= new Array()
banner[0]="<img src='http://img24.imageshack.us/img24/1162/banner2009sa2.jpg'/>"
banner[1]="<img src='http://img2.pict.com/13/50/03/4aaab158901452fa0866ebd488/gizp1/800/img24.jpg'/>"
banner[2]="<img src='http://img2.pict.com/2c/96/04/a2f6f5f5c1d56d1946d5a41ae4/GMg11/img29.jpg'/>"
banner[3]="<img src='http://img2.pict.com/9c/09/6a/a23980569839f36a8d3d250567/xbQ69/zawp4.jpg'/>"
var random=Math.round(3*Math.random());
document.write(banner[random]);
</script></a>
</div>
Dán code vào bên dưới đoạn <div id='top-wrapper'>
Bây giờ bạn chỉ việc thay đổi lại link http://f69dkm.blogspot.com/ và toàn bộ link banner bên trên thành các link của Blog bạn. Nếu muốn tạo thêm nhiều banner , bạn chỉ việc dán thêm nhiều dòng code banner[số thứ tự]="<img src='Link hình'/>" .Vậy là xong rồi đấy.
Lưu ý :
1/ Vì mỗi người sử dụng mỗi template khác nhau, do đó việc một số code trong mã nguồn không giống nhau là chuyện thường gặp. Ở đây, có thể bạn sẽ không tìm thấy đoạn <div id='top-wrapper'> , hãy thay bằng một số đoạn code khác như <div id='header-wrapper'> , <b:widget id='Header1' locked='true' title='Header' type='Header'> ... hoặc tìm với từ khóa header .2/ Nếu bạn sử dụng 5 banner, hãy chèn số '4' thay cho số 3 ở đoạn var random=Math.round(3*Math.random()) . Tương tự , nếu có 3 banner thì nhập '2' vào đoạn đó.
3/ Mình đã test nhiều lần thì nhận thấy rằng : banner[0] sẽ chỉ xuất hiện vào lúc truy cập vào Blog lần đầu tiên, còn sau đó thì chỉ có những banner khác xuất hiện. Nếu có thể, bạn hãy giúp mình test lại xem có chính xác không nhé !
Gửi bài viết này cho bạn bè qua Y!M:
0 nhận xét:
Đăng nhận xét