Trang chủ > Thủ thuật blog > Tạo banner chạy dọc hai bên cua blog

Tạo banner chạy dọc hai bên cua blog

Các bạn thường xuyên lướt web thì chắc hẳn là không xa lạ gì với một số trang web có các banner chạy dọc ở hai bên. Ứng dụng này được những người thiết kế web sử dụng rất nhiều, nó là công cụ làm cho banner của chúng ta thêm thu hút hơn. Không chỉ các trang web mới có thể sử dụng được công cụ này mà blog của chúng ta cũng có thể làm được. Hôm nay mình xin chia sẻ cùng các bạn thủ thuật để tạo banner trượt dọc hai bên của blogger.
Xem Demo: tại đây

☼ Thực hiện thủ thuật

1. Đăng nhập vào blogger
2. Vào bố cục và chọn sửa HTML (edit HTML)
3. Tìm đến thẻ và chèn code bên dưới vào trước nó

.slideads1 {text-align:left}
.slideads2 {text-align:right}

4. Save template lại
5. Bây giờ bạn hãy vào phần tử trang (Page Elements) vào thêm HTML/Javascript
6. Dán code bên dưới vào HTML/Javascript trên

<div id="divAdLeft" style="position: absolute; width: 110px; float: left; margin-left: 30px; top: 100px;”>
<div class="slideads1“>
<a href="http://singleboy010.blogspot.com/” target=”_blank”><img border="0" src="http://lh6.ggpht.com/_TaHzV-QgYq0/S15eWtSJmOI/AAAAAAAAFPs/7FwS19e5xTc/Screenshot-11.png” />

<div id="divAdRight" style="position: absolute; width: 120px; float: right; right: 0px; top: 0.00000100252px;”>
<td class="slideads2“>
<a href="http://singleboy010.blogspot.com/” target=”_blank”><img border="0" src="http://lh6.ggpht.com/_TaHzV-QgYq0/S15eWtSJmOI/AAAAAAAAFPs/7FwS19e5xTc/Screenshot-11.png” />
<script language="JavaScript" src="http://singleboy010.110mb.com/Myfile/Javascript/slide_ads.js“>☼ Tùy chỉnh:
– Code màu xanh ở trên chính là link các banner, bạn hãy thay link đó thành link banner của bạn.
– Code màu cam là liên kết khi click vào banner đó bạn hãy thay nó thành đường link mà bạn muốn dẫn đến khi click vao banner.
– Code màu đỏ là file javascript, bạn hãy download file về và upload lên trang chủ của bạn. Bạn có thể download tại đây.
– Code xanh lá điều chỉnh vị trí của banner, nếu bạn muốn banner cố định ở một vị trí thì thay
“absolute thành “fixed”.
Lưu ý: Thủ thuật này hoạt động tốt đối với màn hình có độ phân giải từ 1024px trở lên

  • Tuy nhiên bạn cũng có thể đưa code ở bước 3 vào cùng 1 HTML/Javascript với bước 6 để đơn giản hơn.

7. Save HTML/Javascript lai và xem thử
Chúc bạn thành công với thủ thuật này.

Chuyên mục:Thủ thuật blog
  1. Tháng Hai 1, 2010 lúc 4:39 chiều

    minh lam roi nhung sao no khong chay theo ban oi..?

  2. Singleboy
    Tháng Hai 2, 2010 lúc 3:32 sáng

    [Singleboy]- ban hay thử lai với trình duyet internet explorer nhe

  1. No trackbacks yet.

Gửi phản hồi

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s

%d bloggers like this: