Showing posts with label Thủ thuật BLOG. Show all posts
Showing posts with label Thủ thuật BLOG. Show all posts

Monday, April 13, 2015

Hướng dẫn cài đặt gắn tên miền vào cho blogspot

Bài viết hướng dẫn gắn tên miền vào cho blogspot, cài đặt tên miền riêng vào cho blogspot giúp cho trang blogspot uy tín hơn, chuyên nghiệp hơn và có được một thương hiệu riêng cho mình
Đây là bài viết đậu domain vào cho blogspot chính xác và đầy đủ nhất, một số cách hướng dẫn gắn tên miền vào blogspot trên mạng không đầy đủ làm cho blogspot của bạn khi gõ www.domain.com thì mới vào được còn không gắn www thì không vào được. Để gắn được tên miền thì chúng ta cùng làm các bước sau
Đầu tiên các bạn phải sở hữu 1 tên miền đã và địa chỉ trang web bạn mua domain để vào gắn tên miền riêng vào ví dụ như bạn mua của tenten chẳng hạn thì bạn phải vào domain.tenten.vn để cài đặt tên miền vào

Sau đây là hướng dẫn gắn tên miền vào cho blogspot

Bước 1: Thêm tên miền tùy chỉnh trong trang quản trị blogspot
Bạn hãy truy cập vào quyền quản trị của blogspot => cài đặt => cơ bản: Ở mục xuất bản: Địa chỉ blogspot Bạn chọn Thiết lập URL của bên thứ 3 cho blog của bạn Trỏ URL đã đăng ký của riêng bạn tới blog của bạn.
Hướng dẫn cài đặt gắn tên miền vào cho blogspot
Sau khi chọn bạn nhập tên miền của mình mới mua vào, nên nhớ tên miền phải có chứ cái www trước nha
nếu không nhập WWW thì sẽ không gắn tên miền vào được đâu
gắn tên miền vào cho blogspot
Sau khi nhập tên miền vào bạn chọn lưu lúc đó sẽ xuất hiện dòng chử đỏ "Chúng tôi đã không thể xác minh thẩm quyền của bạn cho miền này. Lỗi 12" 
Trên trang web của công ty đăng ký miền, định vị cài đặt Hệ thống tên miền (DNS) của bạn và nhập hai CNAME sau:
Trường Tên, Nhãn hoặc Máy chủ     Trường Đích, Mục tiêu hoặc Trỏ đến
www     ghs.google.com
to6irbkfrqgn     gv-ykpldk3m24ynis.dv.googlehosted.com
Xem hướng dẫn chi tiết của chúng tôi về việc cung cấp CNAME cho các công ty đăng ký tên miền khác nhau hoặc xem hướng dẫn cài đặt đầy đủ để biết thêm chi tiết. Nếu bạn gặp sự cố khi nhập CNAME thứ hai vào dv.googlehosted.com, thay vào đó bạn có thể xác minh quyền sở hữu miền này của bạn bằng bản ghi TXT thông qua công cụ quản trị trang web của Google tại đây.
Tải xuống tệp cài đặt DNS nếu nhà cung cấp miền của bạn hỗ trợ.
Nhập miền nơi blog của bạn sẽ được lưu trữ.
Miền của bạn phải được đăng ký đúng cách trước. Xem hướng dẫn cài đặt.
Sử dụng miền lưu trữ tệp thiếu?
Nếu bạn chỉ định miền lưu trữ tệp thiếu, Blogger sẽ kiểm tra ở đó nếu không thể t́m thấy tệp được chỉ định trên miền thông thường của bạn. Tìm hiểu thêm.
Hướng dẫn cài đặt tên miền cho blogspot
Sau khi xuất hiện như hình ảnh bạn chọn "Hướng dẫn cài đặt" sẽ xuất hiện 1 cửa sổ mới, xuốg cuối cửa sổ mới ta thấy
cài đặt tên miền vào cho blogspot 
Bạn chọn "One a top-level domain" sẽ xuất hiện 1 đoạn bài viết, Bạn cuộn xuống mục thứ 9 bạn sẽ thấy một danh sách dãy số 
Optional continued: After completing Step 8, enter your domain name in the format example.com, and list the I.P. addresses shown below in the "A" section. You'll need to create four separate A-records which point to four different Google IPs.
216.239.32.21
216.239.34.21
216.239.36.21
216.239.38.21

End of optional section
Bạn hãy copy 4 dãy số và qua bước thứ 2
Bước 2: Cài đặt CNAME cho tên miền trỏ về trang blogspot
Khi mua và thanh toán tên miền, chắc chắn bạn sẽ nhận được email của bên dịch xác nhận mua tên miền thành công và cung cấp tên đăng nhập cũng như mật khẩu để quản lý cùng link của trang quản lý tên miền.
VD: đối với tenten ta vào domain.tenten.vn
Bạn vào email bạn đăng ký mua nick lấy tên đăng nhập và mật khẩu mà nhà cung cấp domain cung cấp cho bạn để đăng nhập vào domain.tenten.vn
Trong trang Quản trị, ta vào mục "Thêm" (có thể khác tùy máy chủ, nơi mà ta đã mua tên miền), chọn tên miền ta muốn trỏ về trang blog.

Thêm 2 bản ghi CNAME mà ta đã có lúc thông báo lỗi và "Save" (ở hình ảnh thứ 3 trên xuống)
cài đặt tên miền riêng vào cho blogspot
Như vậy, ta đã tiến hành trỏ thành công tên miền vào trang blogspot, nhưng mặc định, khi gõ tên miền thiếu www trên trình duyệt, ta sẽ không truy cập được mà bắt buộc phải gõ đầy đủ: www.domain.com

Lúc này, sử dụng 4 record mà ta có trong phần "hướng dẫn cài đặt" của bác Google.
216.239.32.21
216.239.34.21
216.239.36.21
216.239.38.21
đậu domain vào cho blogspot
Chờ một chút để nó phân giải tên miền, 1 2 phút gì đó, quay lại trang blog của bạn lúc bị thông báo lỗi, ấn "Lưu" và xem kết quả. Lúc này bạn nhấp vào chỉnh sửa một lần nữa, chọn "Chuyển hướng xxx.com đến www.xxx.com."
Thế là xong rồi đó :D

Thursday, April 9, 2015

Code tạo banner quảng cáo banner chạy dọc 2 bên Blogspot và web

Code tạo banner quảng cáo banner chạy dọc 2 bên Blogspot và web để kiếm thêm tiền thu nhập từ quảng cáo giúp tăng doanh thu cho cá nhân cũng như cho công ty.
Web bạn hay blogspot của bạn có lượng vitsit lớn, khách hàng muốn mua quảng cáo nhưng các vị trí quảng cáo có thể chèn hết rồi bây giờ chỉ còn 2 bên chưa chèn, bạn muốn bán quảng cáo 2 bên đó nhằm kiếm thêm thu nhập, hôm nay chia sẻ 69 xin hướng dẫn đến với các bạn cách để tạo quảng cáo dọc 2 bên web
Xin bật mí với các bạn là cách này không chỉ giúp có thể tạo quảng cáo 2 bên mà còn có thể giúp các bạn không muốn tạo quảng cáo 2 bên thêm một thanh lề có nút google + nút like facebook, hay là các nút chia sẻ.... Code này khá tiện lợi vì khi gặp màn hình vuông (độ phân giải 768x1024) thì banner sẽ không bị chèn vào trong gây khó chịu vướng víu mà nó sẽ tự mất đi, nhưng chỉ những ai sử dụng màn hình dài mới thấy được quảng cáo. Và code này đã fix cho nằm im và chạy dọc rất êm ái ko chạy giựt giựt gây nhức mắt cho người dùng

Code tạo banner quảng cáo banner chạy dọc 2 bên Blogspot và website Fix Đứng

Code tạo banner quảng cáo banner chạy dọc 2 bên Blogspot và web
Đối với Blogspot
B1- Đăng nhập vào Blog
B2- Vào bố cục (Layout)
B3- Chọn Thêm tiện ích (add widget)
B4-Tạo một widget HTML\Javascripts và chèn vào đoạn code bên dưới :

Còn đối với website thì bạn chỉ cần  thêm phần code dưới lên trên thẻ đóng </body>
 ( Chú ý: các bạn thay đổi phần chữ màu đỏ theo ý thích của bạn nhé )
 <div id="left_ads_float">

        <a href="Link đường dẫn" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibj56EQYRGdCWXSfB4AjPVfBgYpDRnUkXFMWWtf8oSe4YSEk3gkIuyi1bX9eArPdtUmOhNGka224Tr-Zucfdv7sMOIVFoptRpxC6CzyDzgmepJB3p8H8_rLuezvvunCo0qbqavo9c48jE/s1600/fptarena1.png" width="120" /></a>

    </div>

    <div id="right_ads_float">

       <a href="Link đường dẫn" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibj56EQYRGdCWXSfB4AjPVfBgYpDRnUkXFMWWtf8oSe4YSEk3gkIuyi1bX9eArPdtUmOhNGka224Tr-Zucfdv7sMOIVFoptRpxC6CzyDzgmepJB3p8H8_rLuezvvunCo0qbqavo9c48jE/s1600/fptarena1.png" width="120" /></a>

    </div>

<style>

#left_ads_float

{

    bottom:24px;

    left: 10px;

    position:fixed; }

#right_ads_float

{

    bottom:24px;

    right: 10px;

    position:fixed;

}

</style>

<script>

var vtlai_remove_fads=false;

function vtlai_check_adswidth()

    {

        if(vtlai_remove_fads)

        {

            document.getElementById('left_ads_float').style.display='none';

            document.getElementById('right_ads_float').style.display='none';

            return;

        }else if(document.cookie.indexOf('vtlai_remove_float_ads')!=-1)

        {

            vtlai_remove_fads=true;

            vtlai_check_adswidth();

            return;

        }

        else

        {

            var lwidth=parseInt(document.body.clientWidth);

            if(lwidth<1110)

            {

                document.getElementById('left_ads_float').style.display='none';

                document.getElementById('right_ads_float').style.display='none';

            }

            else

            {

                document.getElementById('left_ads_float').style.display='block';

                document.getElementById('right_ads_float').style.display='block';

            }

            setTimeout('vtlai_check_adswidth()',10);

        }

    }

</script>

Cách tạo Banner quảng cáo trượt dọc 2 bên cho blogspot / website

- Dạng này là dạng 2 banner ở 2 bên web. Khi kéo chuột xuống sẽ có hiệu ứng 2 banner trượt theo khi kéo chuột xuông
Chúng ta thường áp dụng cách này nhiều hơn cách phía trước

Cách làm như sau
Đối với website: Bạn chỉ cần thêm phần code dưới lên trên thẻ đóng
Đối với Blogspot
B1- Đăng nhập vào Blog
B2- Vào bố cục (Layout)
B3- Chọn Thêm tiện ích (add widget)
B4-Tạo một widget HTML\Javascripts và chèn vào đoạn code bên dưới :
<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px">    

<a href="http://www.chiase69.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibj56EQYRGdCWXSfB4AjPVfBgYpDRnUkXFMWWtf8oSe4YSEk3gkIuyi1bX9eArPdtUmOhNGka224Tr-Zucfdv7sMOIVFoptRpxC6CzyDzgmepJB3p8H8_rLuezvvunCo0qbqavo9c48jE/s1600/fptarena1.png" width="125" /></a>

</div>    

<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px">    

<a href="www.chiase69.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibj56EQYRGdCWXSfB4AjPVfBgYpDRnUkXFMWWtf8oSe4YSEk3gkIuyi1bX9eArPdtUmOhNGka224Tr-Zucfdv7sMOIVFoptRpxC6CzyDzgmepJB3p8H8_rLuezvvunCo0qbqavo9c48jE/s1600/fptarena1.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 = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");    

</script>

Phần bạn cần tùy chỉnh code
  • http://www.chiase69.com/ : là liên kết mở ra khi người đọc click vào ảnh.
  • Phần màu cam 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ó 2 giá trị được đánh dấu màu cam
  • MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím,
  • LeftAdjust = 5 : khoảng cách từ mép trái trang web đến banner
  • RightAdjust = 5 : khoảng cách từ mép phải trang web đến banner
  • TopAdjust = 10 : khoảng cách từ mép trên trang web đến banner

Saturday, April 4, 2015

Cách tạo menu hiển thị trên mobile cho blogspot - Menu trên thiết bị di động

Cách tạo menu hiển thị trên mobile cho blogspot, Giới thiệu cách hướng dẫn làm menu cho blogspot hiển thị trên các thiết bị di động một cách nhanh và dể hiểu nhất. Hiện nay google đã cho ra thuật toán mới cho vị trí tìm kiếm trên các thiết bị di động, Các web không được tối ưu trên thiết bị di động thì sẽ không đước vị trí tốt. Từ khi thuật toán được công bố thì google đã gửi các thông báo cho các quản trị viên của các web mà không được tối ưu seo và google yêu cầu khắc phục sự cố về khả năng sử dụng trên thiết bị di đọng. Các thông báo thường có nội dung như sau
Gửi: quản trị viên web của trang http://www.chiase69.com/
Hệ thống của Google đã kiểm tra (n) trang từ trang web của bạn và thấy rằng 100% số trang có lỗi nghiêm trọng về khả năng sử dụng trên thiết bị di động. Lỗi trên (n) trang này ảnh hưởng nghiêm trọng đến trải nghiệm trang web của bạn trên các thiết bị di động. Các trang này sẽ bị Google Tìm kiếm coi là không thân thiện với thiết bị di động và do đó sẽ được hiển thị và xếp hạng tương ứng cho người dùng điện thoại thông minh.
Để nhằm mục đích cải thiện các vị trí xếp hạng tốt trên các thiết bị di động hôm nay chia sẽ xin hướng dẫn tối ưu lại web sao cho thân thiện trên các thiết bị di động và Cách tạo menu hiển thị trên mobile, thiết bị di động cho blogspot

Cách tạo menu hiển thị trên mobile (thiết bị di động) cho blogspot

Đầu tiên bạn muốn kiểm tra blogspot trên thiết bị di dộng qua máy tính thì bạn truy cập qua địa chỉ http://www.chiase69.com/?m=1
Chú ý: thay địa chỉ http://www.chiase69.com bằng trang web của bạn nhé
Bước 1: Đăng nhập Blogspot ==> Mẫu(Template) => Điện Thoại Di động (Mobile) Click vào setting rồi tích vào phần cho phép hiển thị trên di động rồi lưu lại
Bước này nhằm tối ưu cho blogspot thân thiện trên thiết bị điện thoại nhé
cách tạo Menu trên thiết bị di động 
Cách tạo menu trên thiết bị di động
Bước 2: Tiếp tục các bạn vào phần Mẫu(Template) ==> Chỉnh sửa HTML ==> Các bạn copy đoạn code lên trên thẻ ]]></b:skin>
#sidebaratas{display:none;}
Bước 3: Tiếp tục các bạn vào phần Mẫu(Template) ==> Chỉnh sửa HTML ==> Các bạn copy đoạn code dưới xuống dưới thẻ <body>
<div id='sidebaratas'>

       <b:section id='navtop' preferred='yes'>

         <b:widget id='PageList1' locked='true' mobile='Only' title='Pages' type='PageList'>

           <b:includable id='main'>

  <b:if cond='data:title'><h2><data:title/></h2></b:if>

  <div class='widget-content'>

    <b:if cond='data:mobile'>

      <select expr:id='data:widget.instanceId + &quot;_select&quot;'>

        <b:loop values='data:links' var='link'>

          <b:if cond='data:link.isCurrentPage'>

            <option expr:value='data:link.href' selected='selected'><data:link.title/></option>

          <b:else/>

            <option expr:value='data:link.href'><data:link.title/></option>

          </b:if>

        </b:loop>

      </select>

      <span class='pagelist-arrow'>&amp;#9660;</span>



    <b:else/>

      <div></div>

    </b:if>

    <b:include name='quickedit'/>

  </div>

</b:includable>

         </b:widget>

       </b:section>



</div>
Lưu ý : Cái phần <b:section id='navtop' preferred='yes'>  <b:widget id='PageList1' locked='true' title='Pages' type='PageList'> phần chữ màu đỏ phải là chưa tồn tại nếu thấy báo lỗi thì đổi tên nó đi để không bị trùng nhé. Nếu lưu dc ko lỗi là ok
Bước 4: Bắt đầu tạo menu cho thiết bị di động
Vào Bố Cục ==> Trang (Pages)
Cách tạo menu hiển thị trên mobile cho blogspot  - Menu trên thiết bị di động
Tạo menu hiển thị trên mobile cho blogspot
Sau khi chọn vào thêm liên kết bên ngoài bạn nhập địa chỉ web mình vào
Xem thêm các thủ thuật blogspot
Cách tạo menu hiển thị trên mobile cho blogspot
Bạn nhập tiêu đề và địa chỉ web mình, Nhớ thêm?&m=1 vào sau mỗi link với nhé. sau khi thêm xong thì bạn ấn lưu liên kết .
Bạn thêm tất cả danh mục mình muốn thêm vào và ấn lưu và vào http://www.chiase69.com/?m=1 để xem thành quả
Muốn sắp xếp các phần menu cho hiển thị trên dưới thì các bạn lại vào phần Bố Cục(Layout) ==> Tìm cái tên là Pages click vào chỉnh sửa rồi kéo nó vào vị trí bạn muốn vậy là ok

Wednesday, April 1, 2015

Code chống copy nội dung bài viết cho blogspot và website

Code chống copy bài viết cho blogspot làm cho đối thủ không sao chép được bài viết blogspot của mình. Bạn là người kinh doanh, bạn là một seoer bạn thường xuyên vắt óc suy nghĩ cả tiếng đồng hồ thậm chí mất cả ngày mới viết được một bài viết lên web, google chưa kịp index bài viết của bạn mà bị đối thủ copy (cướp) bài viết của mình về rồi đăng lên web họ và bài viết kia được google index trước bài viết của mình, làm google hiểu lầm là bài viết kia là bài viết gốc được xếp hạng cao hơn bài viết của mình, công sức bạn bỏ ra bị đổ xuống sông xuống biển, lúc nào cũng như thế làm cho bạn chán nản không muốn viết bài hôm nay mình sẽ chia sẽ đến các bạn code chống copy sao chép nội dung bài viết cho blogspot. Code này có thể làm khó đối thủ trong việc copy nội dung. mình cũng đính chính là code này chỉ làm khó cho đối thủ trong việc copy nhé chư không hoàn toàn ngăn chặn được các pro đâu nha. nếu pro copy thì cũng làm cho họ tốn khá thời gian để copy được một bài gây cho đối thủ chán nản trong việc copy nhé.
Code chống copy nội dung bài viết cho blogspot và website

Code chống copy sao chép nội dung bài viết cho blogspot

Xem thêm: Cách tạo menu blogspot dạng xổ dọc có nhiều mục

Công dụng của code là gì ?
- Chống bôi đen bài viết cũng như website vì vậy sẽ chống copy bài viết được
- Chống click chuột để copy
Ưu điểm của việc chống sao chép nội dung là gì ?
- Gây khó dễ cho những đối thủ muốn copy bài viết cảu mình. Nếu web đối thủ của bạn mà có tốc độ index cao hơn mà họ copy bài viết của bạn và được index trước rất dễ làm Google hiểu nhầm là bài copy là bài gốc.Ảnh hưởng đến thương hiệu, uy tín hệ thống.

- Nhiều bạn muốn copy chia sẻ nhưng ko copy được đành phải lấy link đi chia sẻ cái này mình thấy nó có 2 mặt

-Code này chống copy được trên gần như hết các trình duyệt mình khong giám chắc vì chưa check hết

Nhược điểm là gì ?

- Đôi khi gây khó chịu cho người đọc khi muốn copy bài viết để đi in ấn làm tài liệu để đọc chẳng hạn
- Đối với 1 số web chia sẻ mà khiến người dùng phải copy bài viết thì cần cân nhắc khi sử dụng code này
- Code này chỉ chống được gà thôi, Pro vẫn copy được bình thường
- Có thể nó ảnh hưởng tới SEO cái này thì mình chưa kiểm chứng đơn giản vì bos google ko thích javascript mà lại

Sau đây là cách thực hiện 

Đối với Blog
Các bạn đang nhập blogspot vào code ==> Mẫu(Template) => chỉnh sửa HTML ==> Tìm thẻ đóng </body> rồi copy đoạn code dưới lên trên thẻ đóng </body>

<script type="text/javascript" src="https://sites.google.com/site/bituotblog/disable-copy.js"></script>

<style>

body{

-moz-user-select: none !important;

-webkit-touch-callout: none!important;

-webkit-user-select: none!important;

-khtml-user-select: none!important;

-moz-user-select: none!important;

-ms-user-select: none!important;

user-select: none!important;

}

</style>
Nhấn lưu là ok

Đối với web site thì bạn vào code file index của web bạn rồi chỉnh sửa làm tương tự như blog

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

Để lại comment nếu có thắc mắc ..

Tuesday, March 31, 2015

Cách tạo menu blogspot dạng xổ dọc có nhiều mục

Cách tạo menu blogspot dạng xổ dọc có nhiều mục giúp cho blogspot của bạn có thể có những danh mục cụ thể đến từng bài viết, giúp khách hàng dể dàng tìm kiếm những bài viết mình quan tâm hơn. Để làm được điều đó hôm nay chia sẽ 69 xin hướng dẫn đến với các bạn cách tạo menu cho blogspot
Cách tạo menu blogspot dạng xổ dọc có nhiều mục
Cách tạo menu blogspot dạng xổ dọc có nhiều mục

Cách tạo menu blogspot dạng xổ dọc có nhiều mục

Để thực hiện các bạn làm theo các bước sau đây

Bước 1: Đăng nhập blogspot ==> Template (Mẫu) ==> Edite HTML (Chỉnh sửa HTML) ở bước này các bạn có thể down tải toàn bộ code về rồi dùng notepad ++ để chỉnh sửa cho dễ

- Chú ý trước khi sưa bạn nên sao lưu bản code gốc tránh khi sửa sai không khôi phục lại được

Bước 2: Khi đã vào phần code của blogspor bạn tìm thẻ đóng </head> rồi copy đoạn code dưới lên trên nó

<style type='text/css'>
html .jqueryslidemenu{height: 1%;}
</style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js' type='text/javascript'/>
<script src='http://dl.dropbox.com/u/66256041/Menu/namkna-blogspot-menu-xo-doc-2/drop_menu.js' type='text/javascript'/>

Bước 3: Thêm đoạn code dưới đây lên trên đoạn code ]]></b:skin>

.jqueryslidemenu{

font: bold 12px Verdana;

background: #414141;

width: 100%;

}

.jqueryslidemenu ul{

margin: 0;

padding: 0;

list-style-type: none;

}

/*Top level list items*/

.jqueryslidemenu ul li{

position: relative;

display: inline;

float: left;

}

/*Top level menu link items style*/

.jqueryslidemenu ul li a{

display: block;

background: #414141; /*background of tabs (default state)*/

color: white;

padding: 8px 10px;

border-right: 1px solid #778;

color: #2d2b2b;

text-decoration: none;

}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/

display: inline-block;

}

.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{

color: white;

}

.jqueryslidemenu ul li a:hover{

background: black; /*tab link background during hover state*/

color: white;

}

/*1st sub level menu*/

.jqueryslidemenu ul li ul{

position: absolute;

left: 0;

display: block;

visibility: hidden;

}

/*Sub level menu list items (undo style from Top level List Items)*/

.jqueryslidemenu ul li ul li{

display: list-item;

float: none;

}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */

.jqueryslidemenu ul li ul li ul{

top: 0;

}

/* Sub level menu links style */

.jqueryslidemenu ul li ul li a{

font: normal 13px Verdana;

width: 160px; /*width of sub menus*/

padding: 5px;

margin: 0;

border-top-width: 0;

border-bottom: 1px solid gray;

}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/

background: #eff9ff;

color: black;

}

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{

position: absolute;

top: 12px;

right: 7px;

}

.rightarrowclass{

position: absolute;

top: 6px;

right: 5px;

}

Bước 4: Tìm vị trí code menu mà bạn cần đặt để cho hiển thị rồi thêm đoạn code dưới đây vào

<div id="myslidemenu" class="jqueryslidemenu">

<ul>

<li><a href="http://www.chiase69.com">Item 1</a></li>

<li><a href="#">Item 2</a></li>

<li><a href="#">Folder 1</a>

  <ul>

  <li><a href="#">Sub Item 1.1</a></li>

  <li><a href="#">Sub Item 1.2</a></li>

  <li><a href="#">Sub Item 1.3</a></li>

  <li><a href="#">Sub Item 1.4</a></li>

  </ul>

</li>

<li><a href="#">Item 3</a></li>

<li><a href="#">Folder 2</a>

  <ul>

  <li><a href="#">Sub Item 2.1</a></li>

  <li><a href="#">Folder 2.1</a>

    <ul>

    <li><a href="#">Sub Item 2.1.1</a></li>

    <li><a href="#">Sub Item 2.1.2</a></li>

    <li><a href="#">Folder 3.1.1</a>

        <ul>

            <li><a href="#">Sub Item 3.1.1.1</a></li>

            <li><a href="#">Sub Item 3.1.1.2</a></li>

            <li><a href="#">Sub Item 3.1.1.3</a></li>

            <li><a href="#">Sub Item 3.1.1.4</a></li>

            <li><a href="#">Sub Item 3.1.1.5</a></li>

        </ul>

    </li>

    <li><a href="#">Sub Item 2.1.4</a></li>

    </ul>

  </li>

  </ul>

</li>

<li><a href="http://www.chiase69.com">Item 4</a></li>

</ul>

<br style="clear: left" />

</div>

- Chú ý: Về màu sắc kích thước các bạn tùy chỉnh theo ý thích nhé

Để xem demo các bạn copy code sau vào notepad ++ rồi lưu với file HTML sau đó mở bằng trình duyệt fire Fox hoặc Chrome để xem thử nhé

<html>

<head>

<title>Demo Test</title>

<script  type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

<script  type="text/javascript"  src="https://sites.google.com/site/tessssssssblog/drop_menu.js"></script>

<style type="text/css">

html .jqueryslidemenu{height: 1%;}  <!--[if lte IE 7]>

</style>

<style>

.jqueryslidemenu{

font: bold 12px Verdana;

background: #414141;

width: 100%;

}

.jqueryslidemenu ul{

margin: 0;

padding: 0;

list-style-type: none;

}

/*Top level list items*/

.jqueryslidemenu ul li{

position: relative;

display: inline;

float: left;

}

/*Top level menu link items style*/

.jqueryslidemenu ul li a{

display: block;

background: #414141; /*background of tabs (default state)*/

color: white;

padding: 8px 10px;

border-right: 1px solid #778;

color: #2d2b2b;

text-decoration: none;

}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/

display: inline-block;

}

.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{

color: white;

}

.jqueryslidemenu ul li a:hover{

background: black; /*tab link background during hover state*/

color: white;

}

/*1st sub level menu*/

.jqueryslidemenu ul li ul{

position: absolute;

left: 0;

display: block;

visibility: hidden;

}

/*Sub level menu list items (undo style from Top level List Items)*/

.jqueryslidemenu ul li ul li{

display: list-item;

float: none;

}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */

.jqueryslidemenu ul li ul li ul{

top: 0;

}

/* Sub level menu links style */

.jqueryslidemenu ul li ul li a{

font: normal 13px Verdana;

width: 160px; /*width of sub menus*/

padding: 5px;

margin: 0;

border-top-width: 0;

border-bottom: 1px solid gray;

}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/

background: #eff9ff;

color: black;

}

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{

position: absolute;

top: 12px;

right: 7px;

}

.rightarrowclass{

position: absolute;

top: 6px;

right: 5px;

}

</style>

</head>

<body>

<div id="myslidemenu" class="jqueryslidemenu">

<ul>

<li><a href="http://www.chiase69.com">Item 1</a></li>

<li><a href="#">Item 2</a></li>

<li><a href="#">Folder 1</a>

  <ul>

  <li><a href="#">Sub Item 1.1</a></li>

  <li><a href="#">Sub Item 1.2</a></li>

  <li><a href="#">Sub Item 1.3</a></li>

  <li><a href="#">Sub Item 1.4</a></li>

  </ul>

</li>

<li><a href="#">Item 3</a></li>

<li><a href="#">Folder 2</a>

  <ul>

  <li><a href="#">Sub Item 2.1</a></li>

  <li><a href="#">Folder 2.1</a>

    <ul>

    <li><a href="#">Sub Item 2.1.1</a></li>

    <li><a href="#">Sub Item 2.1.2</a></li>

    <li><a href="#">Folder 3.1.1</a>

        <ul>

            <li><a href="#">Sub Item 3.1.1.1</a></li>

            <li><a href="#">Sub Item 3.1.1.2</a></li>

            <li><a href="#">Sub Item 3.1.1.3</a></li>

            <li><a href="#">Sub Item 3.1.1.4</a></li>

            <li><a href="#">Sub Item 3.1.1.5</a></li>

        </ul>

    </li>

    <li><a href="#">Sub Item 2.1.4</a></li>

    </ul>

  </li>

  </ul>

</li>

<li><a href="http://www.chiase69.com">Item 4</a></li>

</ul>

<br style="clear: left" />

</div>

</body>

</html>
Chúc các bạn thành công.
Có thể bạn chưa biết:

Friday, January 23, 2015

[Thủ thuật blogspot] Thêm ảnh tác giả author avatar ở đầu tiêu đề cho blogspot

Một thủ thuật rất hay thêm ảnh tác giả author avatar ở đầu tiêu đề cho blogspot dành cho những blogspot cá nhân muốn giới thiệu người đọc biết đến ai viết bài viết này, tác giả bài viết là ai, đóng giấu bản quyền cho người đọc biết được tác giả có những bài viết mà mình thường đọc là người như thế nào... Một thủ thuật tuyệt vời dành cho những blogspot cá nhân muốn khẳng định tên tuổi. Chia sẽ xin giới thiệu thủ thuật thêm ảnh tác giả vào đầu tiêu đề blogspot có nội dung và cách làm như sau
Thủ thuật này cực kỳ đơn giản, chúng ta chỉ càn một vài thao tác là có thể thêm được ảnh author avatar vào đầu tiêu đề bài viết được rồi. Trình tự của thủ thuật này thì mình xin gói trọng trong 3 bước

3 Bước hêm ảnh tác giả author avatar ở đầu tiêu đề cho blogspot

Thêm ảnh tác giả author avatar ở đầu tiêu đề cho blogspot
Bước 1: Chèn CSS vào HTML chính của website bạn
Đầu tiên các bạn hãy vào Blog Title → Template → Edit HTML. Nhấn Ctrl + F. Bạn tìm được <b:skin>...</b:skin> chèn code sau  vào giữa đó. Hoặc tìm kiếm ]]></b:skin> và chèn code sau vào trên ]]></b:skin>.
.avatar-author{float:left;margin-right:10px;border:0;border-radius:50%;padding:0;width:30px;height:30px}
Bước 2 - Chèn Javascript vào HTML chính của website bạn
Tìm </head> và chèn code sau vào trước </head>.
<script>
//<![CDATA[
function av(a){var b=a.entry.author[0];c=b.name.$t;d=b.gd$image.src.replace(/\/s[0-9]+(-*c*)\//,'/s30$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}
//]]>
</script>
Bước 3 - Tìm kiếm <b:if cond='data:post.title'> và chèn code
Tiếp theo các bạn tìm kiếm <b:if cond='data:post.title'> và chèn code sau ở trước nó. Và nhớ rằng có nhiều <b:if cond='data:post.title'>, nên bạn phải chắc chắn rằng tìm đến vị trí đúng. Thử cái này không được thì hoàn tác lại và thử ở vị trí <b:if cond='data:post.title'> khác nhé!
<script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;amp;callback=av&quot;'/>
Sau đó các bạn Lưu lại và xem thành quả nhé. Thế là xong. chúc các bạn thành công. Hãy ủng hộ chia sẽ bằng cách ấn like và chiase bên dưới nhé

Friday, January 9, 2015

Hướng dẫn chèn nút like facebook vào website, blogspot

Hướng dẫn chèn nút like facebook vào website hoặc vào blogspot để tạo sử tương tác người dùng web lên các mạng xã hội đặc biệt là MXH facebook, một trong các mạng được phát triển mạnh mẽ trên thế giới. Vậy để tạo nút like lên web và lên blogspot thì các bạn làm như sau.
Xem thêm những thủ thuật hay

Chèn nút like facebook vào website hoặc vào blogspot

Hiện tại thì có 2 hình thức chèn like facebook vào web. Đầu tiên là chèn like face vào có xuất hiện hình ảnh fanpage face và hình ảnh những người like facebook. cách thứ 2 là chỉ hiện nút like và số người like
Hướng dẫn chèn nút like facebook vào website, blogspot 
 Chèn like facebook vào web
1. Chèn like facebook vào web hoặc blogspot có hình xuất hiện như trên (1)
Đầu tiên bạn truy cập vào địa chỉ sau https://developers.facebook.com/docs/plugins/like-box-for-pages
Sau khi truy cập vào bạn nhập fanpage facebook vào ô Facebook Page URL còn Width, Height lần lượt là chiều rộng và cao mà bạn muốn xuất hiện trong web, cái này chúng ta thường để trống, Color Scheme là màu nền của facebook của bạn, cái này thì có 2 màu có sẵn trắng và đen. Show Friends' Faces, Show Header, Show Posts, Show Border là những tiện ích khác bạn cứ tích dấu nhân hoặc bỏ dấu nhân bạn sẽ thấy những thay đổi, cái nào bạn ưng ý thì bạn cứ tích dấu nhân vào. Sau khi làm xong các bước bạn tích vào ô Get Code và lấy code bỏ vào web. thường thì chọn code ở IFRAME
2. Chèn like facebook vào web hoặc blogspot có hình xuất hiện như trên (2)
Bạn phải truy cập vào đường link https://developers.facebook.com/docs/plugins/like-button sau khi truy cập được bạn tiếp tục nhập vào các ô trống và thử khám phá mọi tính năng nhé đặc biệt chức năng ở Layout.
Chú ý: Nếu bạn muốn like cho từng bài viết của web thì bạn bỏ trống ở ô chứa url nhé
Chúc các bạn thành công. mọi thắc mắc xin hãy commen vào phía dưới Admin sẽ giải thích rõ ràng 

Sunday, January 4, 2015

Cách ẩn bài viết theo label ngoài trang chủ Blogspot

Hướng dẫn cách ẩn bài viết theo label ngoài trang chủ Blogspot một cách đơn giản và dể hiễu nhất tới toàn thể những ai muốn quan tâm về các tiện ích ở blogspot. Bạn muốn ẩn một bài viết không muốn nó xuất hiện ở trang chủ nhưng vẫn đảm bảo nó vẫn xuất hiện bình thường ở các trang khác như các bài viết khác. Để làm được điều đó chiase69 sẽ hướng dẫn một bài viết rất cụ thể đến cho các bạn
Xem thêm các thủ thuật blogspot

Cách ẩn bài viết theo label ra ngoài trang chủ ở Blogspot

Đầu tiên chúng ta phải vào blogspot của mình rồi tiến hành chọn Mẫu ==> Sao Lưu/Khôi phuc (bươc này nhằm đảm bảo khi bạn chĩnh sữa HTML sai hoặc không ưng ý thì có thể tải theme mình đã lưu lên tránh trường hợp làm hỏng theme của bạn) ==> Chĩnh Sữa HTML
Bước 1: Tìm đoạn code <b:includable id='main' var='top'>
Phía dưới code trên hãy tìm code tương tự như sau
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond='data:post.trackLatency'>
<data:post.latencyJs/>
</b:if>
</b:loop>
Và thay đoạn code trên bằng code sau
<b:loop values='data:posts' var='post'><b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><b:if cond='data:label.isLast == "true"'>
<b:if cond='data:label.name != "Z Label"'>
<b:include data='post' name='printPosts'/></b:if></b:if></b:loop></b:if><b:else/><b:include data='post' name='printPosts'/></b:if></b:loop>
Chú ý:  Z Label là tên label vidu như chiase69 muốn ẩn một label ra ngoài trang chủ thì mình đặt tên label như sau (Z chiase) Trong đó Z là tên bắt buộc phải đặt còn chiase bạn có thể thay đổi tự do

Cách ẩn bài viết theo label ngoài trang chủ Blogspot
 Ẩn label Z chiase ở trang chủ blogspot
Bước 2: Lúc này mình tìm thẻ đóng </b:includable>
cho thẻ <b:includable id='main' var='top'>.
Thẻ đóng này nằm ngay trước dòng
<b:includable id='commentDeleteIcon' var='comment'>
Rồi đặt đoạn code bên dưới vào sau thẻ </b:includable> nói trên
<b:includable id='printPosts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'>
<data:post.dateHeader/>
</h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
</b:includable>
Các bạn muốn ẩn một bài viết nào ở ngoài trang chủ thì vào bài viết đó  đặt tên nhãn là Z Label bài viết sẽ tự động ẩn ở trang chủ của bạn
Trong quá trình thêm bạn nào mà thấy xuất hiện ngày tháng năm ở trang chủ chữ rất lớn thì các bạn vào bố cục ==> Chĩnh sữa bài đăng==> và xóa nó đi nhé
Chúc các bạn thành công:

Tuesday, December 30, 2014

Code tự phân trang trên bài viết trong blogspot

Code tự phân trang trên bài viết trong blogspot nhằm phân trang cho những bài viết dài như truyện hoặc những đoạn văn dài mà chúng ta không muốn tạo thêm bài viết mới.
Bài viết của bạn dài cùng một nội dung, bạn không muốn tách ra làm 2 bài khác nhau sẽ gây ra những rắc rối không hề nhỏ cho web bạn, vậy làm sao để phân trang bài viết một cách đơn giản hiệu quả hôm nay chia sẽ 69 sẻ hướng dẫn đến các bạn
Thủ Thuật Blogspot

Cách tiến hành tự phân trang bài viết trong blogspot

1. Đăng nhập blogspot
2. Mẫu ==> Chĩnh Sữa HTML
3. Ctrl + F tìm kiếm </head>
và thêm đoạn code sau vào trước
4.Thêm đoạn code sau vào trước ]]></b:skin>
 Code này nhằm mục đích tạo màu chữ, kiểu liên kết, các hiệu ứng khung cho phân trang của mình
#spaging-container, #snumber-container {
width: 100%;
}
.spage183 {
display:none;
}
.sitem183 {
padding: 3px;
}
.sitem183 a, .sitem183 a.visited {
font-weight: bold;
text-decoration: none;
color: green;
}
.sitem183 a:hover, .sitem183 a.current183 {
text-decoration: underline;
color: blue;
}
Sau khi thêm 2 đoạn code trên thì hãy Bấm Lưu Mẫu đi nhé
Code tự phân trang trên bài viết trong blogspot
 Hình ảnh minh họa code phân trang cho bài viết trên blogspot
5. Sau khi lưu mẫu bạn vào bài viết và thêm đoạn code sau vào chế độ soản thảo văng bản HTML
<div id="spaging-container">
$pageIn
Nội dung trang 1
$pageOut
$pageIn
Nội dung trang 2
$pageOut
$pageIn
Nội dung trang 3
$pageOut
</div>
Trong đó: Nội dung trang 1, 2, 3 là nội dung của từng bài viết bạn muốn phân trang, vídụ có bài văn dài bạn muốn phân thành 3 đoạn bằng nhau thì đoạn 1 sẽ dán vào nội dung trang 1, đoạn 2 sẽ dán vào nội dung trang 2, đoạn 3 tương tự đoạn 1, 2
Nếu bạn muốn phân trang số lượng n thì bạn cứ thêm đoạn code 

$pageIn
Nội dung trang n
$pageOut
Vào là được
6. Tiếp theo là vị trí đặt phần phân trang, thường thì đặt vào cuối bài viết. Ở chế độ soạn thảo văn bản HTML bạn dán code sau vào
<script type="text/javascript">
NumberedPage(
numPage = 3, // Số trang cần phân
title = "Trang", // Chữ cần hiển thị như Phần 1 hoặc Trang 1
separator = "|" // Kí tự ngăn cách

);
</script>
Cuối cùng xuất bản và xem thành quả, có gì không hiểu hoặc góp ý tì các bạn hãy bình luận vào phía dưới nhé

Monday, December 29, 2014

Cách thêm tiện ích (widget) vào vị trí bất kỳ trong blogspot

Cách thêm tiện ích (widget) vào vị trí bất kỳ trong blogspot là một vấn đề khá khó khăn với những người làm web bằng blogspot mà không am hiểu về html hoặc là mất nhiều thời gian để tìm hiều. Để đáp ứng nhu cầu của người dung hôm nay chiase69 sẽ hưỡng dẫn bạn cách dể dàng để thêm các tiện ích vào bất kỳ vị trí nào cho blogspot
Thường thì trong bố cục blogspot sẽ phân ra một số vị trí như header, footer, sidebar, main,...và các bạn có thể thêm widget vào vị trí bất kỳ bằng cách copy đoạn code bên dưới và đặt cho phù hợp
Đầu tiên chúng ta đăng nhập blogspot ==> Mẫu ==> Sau lưu (bước này nhằm mục đích lưu lại mẫu theme của bạn để tránh trường hợp làm sai không sửa được thì bạn có thể lấy lại theme này) ==> Chĩnh Sữa HTML
Xem thêm các thủ thuật blogspot

Cách thêm một tiện ích widget thông thường

Ở cách thêm tiện ích widget thông thường này thì khi thêm tiện ích sẽ xuất hiện toàn bộ web, từ trang chủ, bài viết, label ...
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML99' locked='false' title='Bài Viết Xem Nhiều' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<div class='title-left'><data:title/></div>
</b:if>
<div class='box-left'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
Chú ý phần chữ màu đỏ là phần bạn cận thay đổi
Bài Viết Xem Nhiều là tiêu đề bạn đặt cho tiện ích
sidebar1, HTML99 Nếu bạn thêm số tiện ích lớn hơn 2 thì bạn phãi đặt tên cho những phần này là khác nhau
VD: tiện ích 1 là sidebar1, HTML99 thì tiện ích 2 là sidebar2, HTML100
HTML là tên của tiện ích
VD HTML là HTML/Javascript, nếu bạn muốn thêm nhãn thì thay Bằng Label. phần này hơi phức tạp nếu bạn mà làm không được thì cứ commen vào bên giới mình sẽ chỉ rỏ cho

Cách thêm tiện ích widget vào một vị trí bất kỳ trong blogspot

Ở những cách sau đây là những cách chỉ thêm tiện ích vào một vị trí bất kỳ ví dụ như trang chủ hoặc là label, bài viết, trang...
1. Chỉ cho phép widget hiển thị ở trang chủ
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở trang chủ' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
Để thêm bạn đầu tiên là phải xác định vị trí muốn thêm, như head, footer....(nếu không xác địch được thì sau khi thêm vào một vị trí cùng với các tiện ích có sẵn trên web (thêm vào đầu hoặc cuối các tiện ích có sẵn sau này cho dể chĩnh sữa) rồi bạn vào bố cụng để di chuyển đến nơi thích hợp)
sau khi xác định vị trí muốn thêm thì bạn hãy copy cã đoạn mã trên rồi dán vào
2. Chỉ cho phép widget hiển thị ở từng bài viết
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở từng bài viết' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
Đây là thủ thuật nhằm thêm tiện ích trên toàn bộ các bài viết:
Xem thêm: tạo sitemap cho blogspot
3. Chỉ cho phép widget hiển thị ở những trang nhất định:
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở trang nhất định' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "Link của bạn"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
Đây là code thêm tiện ích vào một trang nhất định, bạn có thể xem demo tại link Danh Mục ở phần này chiase69 áp dụng vào tạo một danh mục các label trên một trang thay vì các label xuất hiện trên toàn ộ trang gây ra tốn nhiều khoảng trống của web.
Cách thêm tiện ích (widget) vào vị trí bất kỳ trong blogspot
Tiện ích (widget) tạo ở một trang nhất địch
4. Widget chỉ hiển thị trên các trang Label
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở trên các label' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.searchLabel'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
5. Widget chỉ hiển thị trên các trang Static pages
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở static pages' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
6. Widget hiển thị trên trang tìm kiếm
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở trang tìm kiếm' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.searchQuery>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
7. Widget chỉ hiển thị tại trang lưu trữ
<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Thêm tiện ích ở trang lưu trữ' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>

Sunday, December 28, 2014

Tạo sitemap cho blogspot

Hướng dẫn tạo sitemap cho blogspot. Như tiêu đề thì bài này mình sẻ giúp các bạn tạo sitemap đẹp, một sơ đồ trang web toàn diện giúp khách hàng tìm kiếm dể dàng hơn.
Sitemap thì thường có 2 loại đó là sitemap.xml và sitemap.html
Sitemap.xml là sơ đồ tạo ra nhằm mục đích dành riêng cho googlebot truy cập vào và index bài viết cho mình, cái này rất tốt cho seo, ở blogspot thì sitemap.xml đã có sẵn mình không cần phải tạo làm gì cho mệt. Mình chỉ cần gửi nó lên công cụ quản lý trang web là được. Để thêm sitemap.xml lên công cụ quản lý trang web ta làm như sau.
B1. Đăng nhập vào công cụ quản lý trang web https://www.google.com/webmasters/tools/
B2. Thêm trang web mình vào công cụ quản lý trang web. Ấn vào Thêm Trang Web và nhập trang web mình vào và làm theo hướng dẫn của google
B3. Sau khi thêm xong thì mình ấn vào trang web mình trong googlewebmasters sẽ xuất hiện một bảng bạn chọn vào Sơ đồ trang web
Tạo sitemap cho blogspot
Sau khi vào sơ đồ trang web tiếp tục chọn
Tạo sitemap cho blogspot 1
B4. Sau khi chọn thêm sơ đồ trang web bạn nhập sitemap.xml vào ô trống và chọn gửi sơ đồ trang web
Tạo sitemap cho blogspot 2
Trên là 4 bước thêm sitemao.xml vào công cụ quản lý trang web.
Xem thêm những thủ thuật hay của blogspot: 

Tạo sitemap.html cho blogspot

Sitemap.html là sơ đồ tạo ra nhằm mục đích cho người dùng, google vẫn chấm một ít điểm cho trang web về phần này nên mình cứ tạo không mất mát gì có khi lại được lên top nhiều từ khóa
Để tạo sitemap.html bạn truy cập vào blogspot của web mình ==> Trang ==>Trang Mới
Tạo sitemap cho blogspot 4
Nhập tiêu đề cho sitemap, Thường thì chúng ta nhập là Sitemap nhưng cái này bạn có thể tạo tự do tùy thích ý của bạn
sau khi nhập xong thì bạn thêm code sau vào
<script src="http://caocongkien.googlecode.com/svn/sitemap-lables.js"></script>
<script src="http://www.chiase69.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc"></script>
Bạn thay http://www.chiase69.com/ bằng web của bạn.
Các bạn có thể xem demo tại http://www.chiase69.com/p/sitemap.html
Chú y: Bạn thêm code ở HTML chứ không phải ở Viết đâu nhé
Chúc các bạn thành công

Cách chỉnh sửa tiêu đề blogspot từ h3 về h1

Cách chỉnh sửa tiêu đề blogspot từ h3 về h1, hướng dẫn cách chỉnh sửa tiêu đề bài viết thành h1 để tối ưu seo cho từng bài viết, Tối ưu seo title cho blogspot chuẩn với google nhất.
Bạn làm web bằng blogspot để làm vệ tinh hoặc là muốn phát triển nó thành web chính, nhưng khi bắt đầu làm blogspot thì title mặc định của theme của blogspot là h3 chưa chuẩn seo với google bạn muốn đổi title h3 thành h1 hoặc h2 nhưng không biết cách làm thế nào hôm nay chiase69 sẽ giúp các bạn cách chỉnh sửa tiêu đề blogspot từ h3 về h1.

Để biết thêm về seo các bạn nên đọc thêm bài

Chỉnh sửa tiêu đề blogspot từ h3 về h1

Để tối ưu seo cho các web blogspot thì trong thẻ tiêu đề người ta thường đặt thẻ này là thẻ h1, nhưng khi làm web bằng blogspot các bạn tải theme trên mạng về thì trong thẻ tiêu đề của blogspot thường là h3, vậy để chuyển thẻ h3 về h1 ta thực hiện các bước như sau
Cách chỉnh sửa tiêu đề blogspot từ h3 về h1
 Cách chỉnh sửa tiêu đề blogspot từ h3 về h1
Bước 1: Đăng nhập vào blogspot ==> Mẫu ==> Chĩnh sữa HTML
Các bạn chú ý là khi mình chĩnh sữa tốt nhất là mình copy theme vào notepad+ lưu, rồi chĩnh sữa, để tránh bị sai sót thì mình có thể dể dàng phục hồi
Bạn tìm đoạn code sau để chĩnh sửa tiêu đề
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
Và sữa nó thành
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>
Bước 2: Sau khi thay code trên bạn tìm đoạn code sau
.post h3 {…}
.post h3 a, .post h3 a:visited {…}
.post h3 a:hover {…}
Và sữa nó thành
.post h1, .post h3 {…}
.post h1 a, .post h1 a:visited, .post h3 a, .post h3 a:visited {…}
.post h1 a:hover, .post h3 a:hover {…}

Cách chỉnh sửa tiêu đề blogspot từ h1 về h2

Khi bạn đã tối ưu seo xong tiêu đề mà vào kiểm tra mà thấy trong một bài viết có 2 thẻ h1, như thế không tốt cho seo nên bạn muốn đổi 1 thẻ h1 thành h2. Bạn sẻ thực hiện các bước như sau
Bước 1: Tìm đoạn code sau và đổi h1 thành h2
#header h1 {...}
#header h1 a,#header h1 a:visited {...}
Bước 2: bạn tìm code sau <h1 class="title"

và chỉnh sửa h1 thành h2
Tùy theo theme cho từng blogspot mà có các cách chĩnh sửa khác nhau, nếu bạn thực hiện các bước trên có doạn gì không hiểu hay vẫn không làm được bạn có thể commen vào phí dưới mình sẻ giải đáp giúp các bạn

Friday, December 19, 2014

Chèn quảng cáo vào bên trong bài viết trên Blogspot

Làm thế nào để Chèn quảng cáo vào bên trong bài viết trên Blogspot là một vấn đề khá nan giải cho các anh em làm web trên blogspot. Để kiếm tiền từ quảng cáo Google Adsense lên web làm sao cho hiệu quả và để có thêm thu nhập thì cách chèn quảng cáo vào vị trí thích hợp là một yếu tố rất quan trọng, theo quan điểm của mình thì chèn quảng cáo vào web có 3 vị trí cực kỳ là hấp dẫn khiến người dùng có khả năng click vào quảng cáo lớn nhất đó là phần header, tiếp theo là sau title cũa từng bài viết và phần cuối cùng là chèn vào cuối cũa mỗi bài viết. Riêng về phần header nếu chúng ta chèn quảng cáo vào web thì khả năng seo và thẫm mỹ web bị ảnh hưởng khá là nhiều nên chúng ta thường ít chèn vào đó hơn, Còn 2 phàn còn lại thì chúng ta thường chèn vào mỗi web. Vậy làm sao để chèn quảng cáo google adsense vào blogspot đó là câu hỏi đặt ra cho nhiều người, hôm nay chiase9 xin hướng dẫn với các bạn cách đặt quảng cáo vào đầu và cuối của mỗi bài viết
Code chèn popup quảng cáo ở góc phải cho blogspot - góc trái màn hình web
Đầu tiên bạn phải có mã quảng cáo google adsense. Vì chúng ta chèn vào mẫu và chĩnh sữa html nên yêu cầu quảng cáo google adsense phải đồng bộ (Synchronous)

Một mã quảng cáo Adsense đồng bộ thường có dạng như sau

<script type="text/javascript">
google_ad_client = "ca-pub-7527953601754016";
google_ad_slot = "7274180486";
google_ad_width = 728;
google_ad_height = 90;
</script>

<script src="//pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>

Chèn quảng cáo vào sau title mỗi bài viết trên blogspot

Vào Mẫu (Design) - Chỉnh sửa HTML (Edit HTML) - Chọn Mở rộng tiện ích mẫu (Expand Widget Templates)
Tìm đoạn code sau:
<div class='post-header-line-1'/>
Ở đoạn này thì có nhiều bạn tìm đến nhưng chèn vào như chỉ dẫn mà vẫn không được thì tốt nhất bạn hãy cứ tìm đoạn code post-header-line-1 rồi làm theo hướng dẫn vì có một số blogspot không thêm giấu / hoặc là thêm nhiều đoạn code nữa mới > nên tốt nhất là bạn nên tìm như thế
Chèn ngay vào dưới nó đoạn mã sau:
<b:if cond='data:blog.pageType == "item"'>
<p class='ads'>

Mã Adsense đã chuyển đổi (Mã Adsen đồng bộ)

</p>
</b:if>
Chèn quảng cáo vào bên trong bài viết trên Blogspot
Sau khi chèn quảng cáo sẽ xuất hiện sau title

Chèn quảng cáo vào dưới cuối mỗi bài đăng

Bấm (Ctrl + F): Tìm đoạn code tương tự sau:
<div class='post-body entry-content'>
<p><data:post.body/></p>
<div style='clear: both;'/>
Chú ý: Ở đoạn này thì nhiều bạn sẽ không tìm thấy đoạn code nào giống như thế này bằng cách ấn Ctrrl +f. Vầy để chèn quảng cáo dưới mỗi bài đăng thì bạn tìm đoạn code
. sẽ có nhiều đoạn giống thế này bạn phãi tìm sao cho code nào giống với đoạn phía trên rồi làm theo hướng dẫn phía dưới
Chèn vào ngay dưới nó đoạn mã sau:
<b:if cond='data:blog.pageType == "item"'>
<p class='ads'>

Mã Adsense đã chuyển đổi (Mã Adsen đồng bộ)

</p>
</b:if>
Vậy là mình đã hướng dẫn với các bạn xong về Chèn quảng cáo vào bên trong bài viết trên Blogspot. Chúc các bạn thành công và kiếm được nhiều tiền từ quảng cáo google adsense

Friday, December 5, 2014

Tạo Code chèn popup quảng cáo ở góc phải cho blogspot - góc trái màn hình web

Hôm nay chiase69.com xin giới thiệu đến các men làm web cách tạo code chèn popup quảng cáo ở góc phải cho blogspot- góc trái màn hình web. Blogspot là một kho lưu trử dử liệu có thể lưu data số lượng vô hạn và là một web cho làm miễn phí có cấu trúc code tốt cho các seo (vì nó là con của google nên rất dể để seo lên top) vì những lý do trên nên số người lựa chọn làm web bằng blogspot là rất lớn.
Số lượng web làm bằng blogspot lớn kéo theo sẽ có nhiều trang web có số lượng truy cập, các bạn muốn kiếm chút chi phí để trang trải cuộc sống nên lựa chọn đặt quảng cáo lên web. vậy làm sao để đặt quảng cáo vào góc phải hay trái của web khi mình là một người mù code. Hôm nay mình xin giới thiệu cách đặt quảng cáo một cách đơn giản như sau

Code chèn popup quảng cáo ở góc phải màn hình cho website - Blogspot

Tạo Code chèn popup quảng cáo ở góc phải cho blogspot
Tạo Code chèn popup quảng cáo ở góc phải cho blogspot
Chú ý các bạn thay các mục sau cho hợp lý
- http://www.chiase69.com :  Link web của bạn
- width=250 : Chiều rộng khung
- height=200: Chiều cao khung
- Phần link ảnh tronng phần img src=" các bạn thay bằng link ảnh của các bạn nhé
nếu các bạn Chơi quảng cáo Google Adsense thì Thay đoạn code sau bằng code GA của bạn nhé
   <a href="http://www.chiase69.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhva_Qz7KaiYcyjjnz5x-h7rFV11c3kX6_MmaAJN0OcA6dJvVlVIPa7WUv5OO5H4RhV4xKEKLqV8J9BnxVTZYpHDgT8c7MFUrzvN1tPDs0M3ZRSWJbDEDuJAqOSATG_tb9iA_nyscTFBcU/s1600/idc.gif" width="250" height="200"></a>


1. Đối với Blogspot:
Đăng nhập blogspot ==> Bố Cục ==> Thêm tiện ích (vào bố cục thấy đoạn nào có thêm tiện ích thì vào đó, chỉ chọn duy nhất vào một thêm tiện ích thôi nhé tốt nhất nên lựa chọn thêm tiện ich ở góc phải hoặc trái màn hình) ==>  HTML/Javascript rồi copy đoạn code dưới đây

<script type="text/javascript">

function hide_float_right() {

    var content = document.getElementById('float_content_right');

    var hide = document.getElementById('hide_float_right');

    if (content.style.display == "none")

    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_right()">Tắt quảng cáo [X]</a>'; }

        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_right()">Xem quảng cáo...</a>';

    }

    }

</script>

<style>

.float-ck { position: fixed; bottom: 0px; z-index: 9000}

* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}

#float_content_right {border: 1px solid #01AEF0;}

#hide_float_right {text-align:right; font-size: 11px;}

#hide_float_right a {background: #01AEF0; padding: 2px 4px; color: #FFF;}

</style>

<div class="float-ck" style="right: 0px" >

<div id="hide_float_right">

<a href="javascript:hide_float_right()">Tắt Quảng Cáo [X]</a></div>

<div id="float_content_right">

<!-- Start quang cao-->

  <a href="http://www.chiase69.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhva_Qz7KaiYcyjjnz5x-h7rFV11c3kX6_MmaAJN0OcA6dJvVlVIPa7WUv5OO5H4RhV4xKEKLqV8J9BnxVTZYpHDgT8c7MFUrzvN1tPDs0M3ZRSWJbDEDuJAqOSATG_tb9iA_nyscTFBcU/s1600/idc.gif" width="250" height="200"></a>

<!-- End quang cao -->

</div>

</div>



2. Đối với website 
Bạn thêm đoạn code sau lên trên thẻ đóng </body>
<script type="text/javascript">

function hide_float_right() {

    var content = document.getElementById('float_content_right');

    var hide = document.getElementById('hide_float_right');

    if (content.style.display == "none")

    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_right()">Tắt quảng cáo [X]</a>'; }

        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_right()">Xem quảng cáo...</a>';

    }

    }

</script>

<style>

.float-ck { position: fixed; bottom: 0px; z-index: 9000}

* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}

#float_content_right {border: 1px solid #01AEF0;}

#hide_float_right {text-align:right; font-size: 11px;}

#hide_float_right a {background: #01AEF0; padding: 2px 4px; color: #FFF;}

</style>

<div class="float-ck" style="right: 0px" >

<div id="hide_float_right">

<a href="javascript:hide_float_right()">Tắt Quảng Cáo [X]</a></div>

<div id="float_content_right">

<!-- Start quang cao-->

 <a href="http://www.chiase69.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhva_Qz7KaiYcyjjnz5x-h7rFV11c3kX6_MmaAJN0OcA6dJvVlVIPa7WUv5OO5H4RhV4xKEKLqV8J9BnxVTZYpHDgT8c7MFUrzvN1tPDs0M3ZRSWJbDEDuJAqOSATG_tb9iA_nyscTFBcU/s1600/idc.gif" width="250" height="200"></a>

<!-- End quang cao -->

</div>

</div>

Code chèn popup quảng cáo ở góc trái màn hình cho website - Blogspot

1. Đối với Blogspot:
Bước 1: Đăng nhập blogspot ==> Bố Cục ==> Thêm tiện ích ==>  HTML/Javascript rồi copy đoạn code dưới đây vào

<script type="text/javascript">

function hide_float_left() {

    var content = document.getElementById('float_content_left');

    var hide = document.getElementById('hide_float_left');

    if (content.style.display == "none")

    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_left()">Tắt quảng cáo [X]</a>'; }

        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_left()">Xem quảng cáo...</a>';

    }

    }

</script>

<style>

.float-ck { position: fixed; bottom: 0px; z-index: 9000}

* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}

#float_content_left {border: 1px solid #01AEF0;}

#hide_float_left {text-align:left; font-size: 11px;}

#hide_float_left a {background: #01AEF0; padding: 2px 4px; color: #FFF;}

</style>

<div class="float-ck" style="left: 0px" >

    <div id="hide_float_left">

<a href="javascript:hide_float_left()">Tắt Quảng Cáo [X]</a></div>

<div id="float_content_left">

<!-- Start quang cao-->

     <a href="http://www.chiase69.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhva_Qz7KaiYcyjjnz5x-h7rFV11c3kX6_MmaAJN0OcA6dJvVlVIPa7WUv5OO5H4RhV4xKEKLqV8J9BnxVTZYpHDgT8c7MFUrzvN1tPDs0M3ZRSWJbDEDuJAqOSATG_tb9iA_nyscTFBcU/s1600/idc.gif" width="250" height="200"></a>

<!-- End quang cao -->

</div>

</div>

2. Đối với website
Bạn thêm đoạn code sau lên trên thẻ đóng </body>
<script type="text/javascript">

function hide_float_left() {

    var content = document.getElementById('float_content_left');

    var hide = document.getElementById('hide_float_left');

    if (content.style.display == "none")

    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_left()">Tắt quảng cáo [X]</a>'; }

        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_left()">Xem quảng cáo...</a>';

    }

    }

</script>

<style>

.float-ck { position: fixed; bottom: 0px; z-index: 9000}

* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}

#float_content_left {border: 1px solid #01AEF0;}

#hide_float_left {text-align:left; font-size: 11px;}

#hide_float_left a {background: #01AEF0; padding: 2px 4px; color: #FFF;}

</style>

<div class="float-ck" style="left: 0px" >

    <div id="hide_float_left">

<a href="javascript:hide_float_left()">Tắt Quảng Cáo [X]</a></div>

<div id="float_content_left">

<!-- Start quang cao-->

   <a href="http://www.chiase69.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhva_Qz7KaiYcyjjnz5x-h7rFV11c3kX6_MmaAJN0OcA6dJvVlVIPa7WUv5OO5H4RhV4xKEKLqV8J9BnxVTZYpHDgT8c7MFUrzvN1tPDs0M3ZRSWJbDEDuJAqOSATG_tb9iA_nyscTFBcU/s1600/idc.gif" width="250" height="200"></a>

<!-- End quang cao -->

</div>

</div>
Chúc các bạn thành công !

Popular Posts