HƯỚNG DẪN TẠO BANNER QUẢNG CÁO 2 BÊN WEBSITE VỚI HTML VÀ CSS - Thanh'sBlog - Blog công nghệ, chia sẻ niềm đam mê!

HƯỚNG DẪN TẠO BANNER QUẢNG CÁO 2 BÊN WEBSITE VỚI HTML VÀ CSS Không rõ

06/01/2016 Đăng bởi: Lover Admin , Nhận xét(0) , Đọc(1645) Lớn | Vừa | Nhỏ

Nếu bạn có nhu cầu đặt banner quảng cáo trên website của mình mà không có đủ diện tích ở phần nội dung, hãy tận dụng banner quảng cáo ở 2 bên website.

Highslide JS


Highslide JS

Nếu bạn sử dụng WordPress để tạo website, bạn có thể sử dụng plugin Float Left Right Advertising để tạo banner quảng cáo mà không cần phải chỉnh sửa code.

Để tạo được banner quảng cáo chạy trượt 2 bên website, bạn thêm đoạn code sau vào sau thẻ hoặc trước thẻ


<!-- code quang cao -->
<div id="divAdRight" style="display: block; position: fixed;left:0; top: 0px;">
<a href="http://thanhblog.info"><img src="http://thanhblog.info/ima/tet_thanhblog_left.png" width="130" /></a>
</div>
<div id="divAdLeft" style="display: block; position: fixed;right:0; top: 0px;">
<a href="http://thanhblog.info"><img src="http://thanhblog.info/ima/tet_thanhblog_right.png" width="130" /></a>
</div>
<script>
    function FloatTopDiv()
    {
        startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+200;
        startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+200;
        var d = document;
        function ml(id)
        {
            var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
            el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
            el.x = startRX;
            el.y = startRY;
            return el;
        }
        function m2(id)
        {
            var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
            e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
            e2.x = startLX;
            e2.y = startLY;
            return e2;
        }
        window.stayTopLeft=function()
        {
            if (document.documentElement && document.documentElement.scrollTop)
                var pY =  document.documentElement;
            else if (document.body)
                var pY =  document.body;
            if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;};
            ftlObj.y += (pY+startRY-ftlObj.y)/16;
            ftlObj.sP(ftlObj.x, ftlObj.y);
            ftlObj2.y += (pY+startLY-ftlObj2.y)/16;
            ftlObj2.sP(ftlObj2.x, ftlObj2.y);
            setTimeout("stayTopLeft()", 1);
        }
        ftlObj = ml("divAdRight");
        //stayTopLeft();
        ftlObj2 = m2("divAdLeft");
        stayTopLeft();
    }
    function ShowAdDiv()
    {
        var objAdDivRight = document.getElementById("divAdRight");
        var objAdDivLeft = document.getElementById("divAdLeft");
        if (document.body.clientWidth < 1000)
        {
            objAdDivRight.style.display = "none";
            objAdDivLeft.style.display = "none";
        }
        else
        {
            objAdDivRight.style.display = "block";
            objAdDivLeft.style.display = "block";
            FloatTopDiv();
        }
    }
</script>
<script>
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 120;RightBannerW = 120;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;</script>");
</script>


Bạn thay đường dẫn và link ảnh theo nhu cầu của bạn vào đoạn code trên nhá. Đây là cách đơn giản nhất để thêm banner quảng cáo vào 2 bên website mà không cần dùng tới plugin hay add-in nào. Nó góp phần tối ưu website và không làm giảm tốc độ của website.

Chúc các bạn thành công!



Nhấn Like và +1 nếu thấy bài viết có ý nghĩa!

  • Đăng lên ZingMe
  • Đăng Lên Facebook
  • Đăng Lên Twitter
  • LinkedIn
  • Đăng lên ZingMe
  • Đăng Lên Google Buzz
  • Đăng Lên FriendFeed
  • Đăng Lên Reddit
  • Đăng Lên MySpace
  • Đăng Lên Yahoo! Bookmarks
  • Đăng Lên Digg
  • Đăng Lên Yahoo Buzz
  • Đăng Lên Baidu
Đăng bình luận lên Facebook của bạn:
Khuyến cáo: Không hổ trợ comment bằng facebook nhé!


Sửa lần cuối bởi Lover Admin Sửa vào 06/01/2016 23:40
Tags: , , , , , , , , , , , ,
Viết nhận xét

Tên gọi

Facebook của bạn

Email

You can also login with your OpenID:
HTML code BBcode Mặt cười Ẩn giấu Hãy nhớ [Đăng nhập] [Đăng ký. ]
               
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot
emotemotemotemotemot

Bạn muốn hình đại diện hiển thị ngay bên cạnh lời bình luận của bạn không?
Hãy tham gia vào Gravatar và thiết lập hình đại diện hoàn toàn miễn phí!
Gravatar là gì? Avatar hình đại diện toàn cầu, bạn đã có avatar chưa? click đăng ký ngay!
TÌNH HÌNH WEBSITE

Thống kê Online trên website.

Hiện có 136 người đang online
(0 thành viên và 136 khách)

Tổng quan tình hình trên ThanhBlog.InFo

Thống kê đến thời điểm hiện tại số lượt khách ghé thăm blog là: 4192704
Số người đã ghé thăm blog trong ngày là: 4242
Số bài viết: 6857 Số comment hiện tại là: 2843 Số trích dẫn 1
Số thành viên đã đăng ký là: 24397
Nào cùng nâng ly chào mừng bạn hungpdm đến với ThanhBlog. Chúc các bạn có những giây phút bổ ích và hạnh phúc !