cách tạo hai thanh banner chạy dọc hai bên cho website blogspot thành công 100%

sau đâu mình chia sẻ cách tạo hai thanh banner chạy dọc them website blogspot
các bạn tạo wigid rồi dán đoạn code này vào
<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px">     
<a href="url link liên kết"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUMYIiwVBJqb8KpPaytKD3NIRKE2REuDdOM_5jD-2_r0e9UartfY42ltX_dj3Z4I6smLWakAr91_XHFxV5rgt2NTjl6VUIgZdAv2XQp9bkrF01vM4ARhNEhBJlaONScDZNHnUm6tAr5kQN/s1600/banner-quang-cao-dep-nhat-truot-doc-2-ben-namkna-blogspot.png" width="125" /></a>
</div>     
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px">     
<a href="url link liên kết"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUMYIiwVBJqb8KpPaytKD3NIRKE2REuDdOM_5jD-2_r0e9UartfY42ltX_dj3Z4I6smLWakAr91_XHFxV5rgt2NTjl6VUIgZdAv2XQp9bkrF01vM4ARhNEhBJlaONScDZNHnUm6tAr5kQN/s1600/banner-quang-cao-dep-nhat-truot-doc-2-ben-namkna-blogspot.png" width="125" /></a>     
</div>     
<script>     
    function FloatTopDiv()     
    {     
        startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80;     
        startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80;     
        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.scrollTop;     
            else if (document.body)     
                var pY =  document.body.scrollTop;     
             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 = 125;RightBannerW = 125;LeftAdjust = 120;RightAdjust = 120;TopAdjust = 200;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");     
</script>

sau đó lưu lại và tùy chỉnh những thông số sau đâu cho phù hợp với website của bạn.
Tùy chỉnh code!
url link liên kết : là liên kết mở ra khi người đọc click vào ảnh.
Phần màu vàng trong đoạn code <img src=”…”/>  là link ảnh banner trượt dọc sẽ hiển thị
width="125" : chiều rộng của banner. có hai giá trị hai bên các bạn có thể điều chỉnh tùy ý
MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím,
LeftAdjust = 120 : khoảng cách từ mép trái trang web đến banner
RightAdjust = 120 : khoảng cách từ mép phải trang web đến banner
TopAdjust = 200 : khoảng cách từ mép trên trang web đến banner

Cách cố định thanh menu trong blogspot

Bắt đầu vào hướng dẫn tạo sticky menu thôi:
- Đầu tiên phải tạo CSS cho nó, bạn vào Edit HTML là thêm đoạn CSS này phía trên thẻ ]]></b:skin> nhé:

/* Bắt đầu Stick Nav */
sticknav {
background: #ffffff;
height: 30px;
width: 100%;
margin-right: 0px;
margin-left: 0px;
left: 0px;
right: 0px;
position: relative;
z-index: 9999;
}
.fixed { position:fixed;}
/* Kết thúc Stick Nav */


2 cái bên trong dấu /* */ chỉ dùng để báo cho bạn biết code bên trong nó nói về gì thôi, nên không cần quan trọng đâu ^^
Xem thêm: Hướng dẫn tạo widget cố định khi cuộn trang
- Giờ thì tìm đến đoạn code chứa navigation bar của các bạn, ví dụ như của mình thì chính là đoạn code chứa navitions này:
 tạo thanh menu trượt (Sticky menu) khi cuộn trang

Hãy đặt toàn bộ code của navigation bar vào trong thẻ:

<sticknav>
(Đoạn code của navigation bar ở đây các bạn tìm <div id='menu'> .....</div>)
</sticknav>

Để cho dễ hình dung nó có dạng
<sticknav>
<div id='menu'> .... có nhiều thứ trong này nhưng ko quan tâm....</div>
</sticknav>

- Cuối cùng là đặt đoạn code này trên thẻ </body> :
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var aboveHeight = $('header').outerHeight();
    $(window).scroll(function(){
        if ($(window).scrollTop() > aboveHeight){
        $('sticknav').addClass('fixed').css('top','0').next().css('padding-top','60px');
        } else {
       $('sticknav').removeClass('fixed').next().css('padding-top','0');
        }
    });
});
</script>
Trong đó:

+ Với đoạn js màu đỏ kia. Nếu trong blog bạn đã có dòng nào tương tự (Khác phiên bản 1.6.4 cũng được) thì bỏ nó đi nhé.

+ Còn đoạn màu xanh nếu để nguyên như thế thì mỗi khi bạn cuộn xuống thì thanh navigation sẽ tự nhảy để chuyển thành sticky nav. Còn nếu bạn muốn quy định khi cuộn xuống bao nhiêu px thì nó mới thành sticky nav thì dùng đoạn code này thay vào đó:

var aboveHeight = 300;

Cuối cùng là lưu lại và bạn đã có được thanh menu cố định ( Sticky menu) khi cuộn trang rồi đấy, nó sẽ nằm trên cùng và trượt theo bạn!
ok lưu lại và ra ngoài coi thành công hay chưa...

Cách khắc phục lỗi không hiển thị hình ảnh trong blogspot

Lỗi thứ nhất: Thường mấy bạn bắt đầu làm Blog trên nền tảng Blogger cứ nghỉ rằng ảnh upload lên Blogspot có liên quan gì ảnh trên picasaweb.google.com hay Google+ đâu mà nó cứ xuất hiện ở trên đây nhỉ? Vậy là xóa hết ảnh trên picasaweb.google.com hay Google+ rồi vô lại Blog. Ôi! ảnh trên Blog của mình đâu hết rùi L => ''Lỗi ảnh do xóa một cách vô tội vạ khi chưa biết gì''. Vì ảnh upload lên Blogspot hay upload lên Google+ nó đều lưu trữ ở picasaweb.google.com, tới đây chắc mấy bạn cũng biết tại sao xóa ảnh trên picasaweb.google.com hay Google+ thì ảnh trên Blog bị lỗi rùi đúng không nào. Cách khắc phục duy nhất là các bạn phải upload lại tất cả các ảnh đã bị xóa và đi thay link từng ảnh một. Hãy cẩn thận trước khi làm thứ gì mà mình chưa biết!

☼ Lỗi thứ hai: Lỗi do nhà mạng chặn lý do thì chắc Bạn nào cũng biết hết rồi, nhà mạng chỉ chặn các domain chứa link .blogspot.com thôi nhé! Vậy đâu là lối thoát cho người dùng Blogger? Vâng, với một thủ thuật đơn giản sau đây, hình ảnh sẽ được hiển thị dù bị nhà mạng chặn.

Cách 1: Chỉnh sửa một cách thủ công: Khi upload ảnh lên bài viết, link ảnh sẽ có dạng *.bp.blogspot.com, bạn chỉ cần chuyển bài viết qua chế độ HTML rồi sửa link đó thành lh4.googleusercontent.com hoặc lh4.ggpht.com là được.

Cách 2: Sử dụng một đoạn Javascript, với cách này link ảnh sẽ tự động chuyển về dạng lh4.googleusercontent.com bạn sẽ không cần ngồi sửa thủ công từng ảnh một. Vào Blog => Mẫu => Chỉnh sửa HTML. Nhấn tổ hợp phím Ctrl + F và tìm đến thẻ </body>. Sau đó dán đoạn mã Code sau ở phía trên thẻ </body> và lưu mẫu.

<script type='text/javascript'>
//<![CDATA[
var images = document.getElementsByTagName("img");
for(var i=0;i<images.length;i++) {
images[i].src = images[i].src.replace(/[0-9]+.bp.blogspot.com/,"lh4.googleusercontent.com");
}
//]]>
</script>
          Đơn giản, nhẹ nhàng vậy là tránh được cái nạn bị nhà mạng chặn. Ngoài ra Bạn cũng có thể sử một đoạn Jquery thay đoạn Javascript nhưng ở đây mình không nói tới, thiết nghĩ vì nó không cần thiết.

Cách khắc phục lỗi nhà mạng chặn blogspot

Tác dụng: để nhà mạng không chặn blog
Cách làm.
Thay đổi DNS  trực tiếp cho tên miền trỏ về blogspot (cách này hiệu quả  nên dùng)

Người dùng sẽ không phải thay đổi dns hay bất kì một thao tác nào mà vẫn dễ dàng truy cập được blogspot
Hướng dẫn cách làm :
(chỉ áp dụng cho blogspot có tên miền riêng  )

Bước 1 :
Sau khi các bạn xác nhận tên miền bên thứ 3 trên trang blogger sẽ yêu cầu bạn thêm 2 bản cname


blogger yêu cầu xác nhận 2 bản cname bên dịch vụ tên miền đang sử dụng

Thêm 2 bản cname đó  trên trang quản lý tên miền  cùng 4 bản  ghi A sau :

Bước 2 Tạo DNS trung gian

Truy cập trang  https://www.cloudns.net/ tạo một tài khoản sau đó vào bảng điều khiển chọn "DNS zones " [Add new]  chọn master zone



Nhập tên miền riêng và chọn "Tạo " .Bạn sẽ nhận được một vùng dns và nameserver như sau :


Sau đó bạn chọn CNAME  "Thêm mẫu tin mới":
Tại Host : Nhập www
Trỏ đến : ghs.google.com


Và thêm một bản CNAME
Tại Host : Nhập    t6fzy6gs7etj
Trỏ đến :     gv-fvne3sdicvt5i7.dv.googlehosted.com
( Lưu ý đây chính là cname các bạn làm ở bước 1 hãy thay đổi nó ứng với cname của bạn )
Cuối cùng sau khi hoàn tất các bạn sẽ được kết quả như sau :




Bước 3 Trỏ  nameserver từ tên miền đến cloudns.net
Hãy trỏ  NS của bạn đến 4  nameserver cloudns và đợi sau vài tiếng để quá trình hoàn tất

Bước 4
Quay trở lại trang blogger chọn "Lưu" tích chọn chuyển hưởng từ tên miền không www đến có www và hoàn tất cài đặt.Bạn có thể phải đợi ít nhất 48h để các máy chủ dns phản ánh trên blogger .Cuối cùng hãy dùng máy tính sử dụng mạng VNPT và test thử truy cập các trang bị chặn như blogspot để kiểm tra
tag : cách giúp blogspot không bị chặn  ,Thủ thuật máy tính