Thứ Ba, 12 tháng 7, 2016

CẤU TRÚC CƠ BẢN CỦA HTML

"Tự hỏi và trả lời các câu hỏi là cách tốt nhất để thực hành một ngôn ngữ"
  
Đầu tiên để cho các trình duyệt của mình hiểu thì tên file mình tạo ra phải đặt là:

Tên file.HTML

Cấu trúc cơ bản trong file HTML như sau:

 
 <html>
      <head>
                <title> TIEU DE DAU TIEN </title>
      </head>
</html>




Trong phần này cặp thẻ <html>     </html> : dùng để báo cho trình duyệt.
                                    <head>    </head>: dùng để khai báo cho tiêu đề
                                     <title>      </title> : dùng để thể hiện nội dung trong cặp thẻ này lên trên thanh tiêu đề.Nếu không dùng <head>    </head> và <title>   </title> thì mặt định nó sẽ lấy tên file.html hiện lên thanh tiêu đề.
Lưu ý : không được viết có dấu vì các chữ sẽ bị mã  hóa

Chúng ta để ý rằng với cấu trúc trên chỉ làm việc với thanh tiêu đề và còn địa chỉ là nơi ta đã lưu file html đó. Tuy nhiên phần nội dung thì chẳng thấy gì . Vậy thì làm cặp thẻ sau sẽ thể hiện phần nội dung trên wed đó là;

<body> </body> nó nằm dưới thẻ </head>
--------------------------------------------------------------
  <html>
      <head>
                <title> TIEU DE DAU TIEN </title>
      </head>
     
<body>

                  Hello Wordl
     </body>
</html>

 Vậy là mình đã tạo ra một trang wed với cấu trúc khá đơn giảng rồi. thật tuyệt vời

Phần tiếp theo: Tìm hiểu các cập thẻ thể hiện trong nội dung gồm những thẻ nào?

HTML LÀ GÌ

    "Tự hỏi và trả lời các câu hỏi là cách tốt nhất để thực hành một ngôn ngữ"

Người ta thường nói HTML là một ngôn ngữ cơ bản dùng để thiết kế wedsite, HTMLđược viết tắc của chữ (Hyper Text Markup Language) tạm dịch là ngôn ngữ đánh dấu văn bản siêu liên kết. Vậy thì mục đính ra đời của HTML dùng để làm gì nhỉ ?.

      Để trả lời việc này, thì theo ý kiến chủ quan của tôi cho rằng nó dùng để tạo ra liên kết cho văn bản để mở ra một file mới theo ý mình đó mà. Mục đích của viêc làm này làm biến khỏi mất công tìm hehe..


Sau đó hình thành các giao diện cho nó đẹp ra, tôi nghĩ rằng cọi nguồn sẽ bắt đầu từ đây, vì sao vậy? nguyên nhân là do người ta muốn tạo kết nối để chia sẽ tại liệu giữa các máy tính với nhau và từ đó hình thành các mạng kết nối với nhau nhưng sau đó lại phát sinh ra nhiều vấn đề giữa các hệ điều hành và các trình duyệt, mỗi người một kiểu không ai hiểu ai và gì vậy cần phải có một qui chuẩn chung đó là W3C (World Wide Web Consortium) do Do Tim Berner Lee phát minh năm 1994. 

Đây là đoạn Code mở màn cho chuẩn đó.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Từ đó nó không còn là các file văn bản để chia sẽ nữa mà phải thể biện bằng các thẻ để thể hiện các văn bản trên trình duyệt và tạo liên kết cho chúng. Vậy các thẻ này dùng để xây dựng để tạo ra giao diện cho các trang để thể hiện trên trình duyệt đồng thời tạo ra các nút liên kết cho văn bản, sau này các thẻ được tạo ra rất nhiều nên gọi chung là ngôn ngữ HTML.

Tóm lại :

HTML là những cập thẻ dùng để xây dựng các thành phần tạo nên giao diện cơ bản cho wedsite. Vậy các thẻ này là gì ? Cấu trúc như thế nào?


Phần tiếp theo : Cấu trúc cơ bản của HTML

Thứ Ba, 5 tháng 7, 2016

HƯỚNG DẪN TẠO MENU NGANG BLOGGER NHIỀU CẤP

Lúc mới bắt đầu làm quen với Blogger mình thường muốn tạo thanh Menu nhiều cấp nhưng không biết làm bằng cách nào, sau mấy ngày tìm hiểu . Hôm nay mình sẽ thực hành làm cái Menu như thế này .

Xem hình dưới dây



Cách làm như sau:
Bước 1:
Truy cập vào Blogger.com tiếp theo chọn mẫu - vào chỉnh sửa HTML
Bạn nhấn Ctrl + F  tìm thẻ  ]]></b:skin> 


 Lưu ý: Search bạn chỉ lấy thẻ </b:skin> sau đó bạn nhấn chổ tam giác cho nó sổ ra thì lúc đó mình tìm mới thấy được, sau đó bạn sẽ thấy thẻ như sau:

]]
  </b:skin>

Bước 2Bạn copy đoạn code dưới đây dán trước thẻ ]]</b:skin> 
 -------------------------------------------------------------------------------------------------------------
 /* Drop menu by http://thuchanhmemnu.blogspot.com/ */
/* ddsmoothmenu */
.ddsmoothmenu{
font: bold 12px Verdana;
background: #414141; /*Màu nền của thanh menu phần khi chưa có Menu con*/
width: 100%;
}
.ddsmoothmenu ul{
z-index:100;
margin: 0;
padding: 0;
list-style-type: none;
}
/*Top level list items*/
.ddsmoothmenu ul li{
position: relative;
display: inline;
float: left;
}
/*Top level menu link items style*/
.ddsmoothmenu ul li a{
display: block;
background: #414141; /*Màu nền của thanh menu khi chứa menu con*/
color: white;
padding: 8px 10px;
border-right: 1px solid #778;
color: #2d2b2b;/*Màu chữ */
text-decoration: none;
}
* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}
.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
color: white;
}
.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: black;
color: white;
}
.ddsmoothmenu ul li a:hover{
background: black; /*background of menu items during onmouseover (hover state)*/
color: white;
}
/*1st sub level menu*/
.ddsmoothmenu ul li ul{
position: absolute;
left: 0;
display: none; /*collapse all sub menus to begin with*/
visibility: hidden;
}
/*Sub level menu list items (undo style from Top level List Items)*/
.ddsmoothmenu ul li ul li{
display: list-item;
float: none;
}
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.ddsmoothmenu ul li ul li ul{
top: 0;
}
/* Sub level menu links style */
.ddsmoothmenu 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;
}
/* Holly Hack for IE \*/
* html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/
/* ######### CSS classes applied to down and right arrow images  ######### */
.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}
.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}
/* ######### CSS for shadow added to sub menus  ######### */
.ddshadow{
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
background: silver;
}
.toplevelshadow{ /*shadow opacity. Doesn't work in IE*/
opacity: 0.8;
}
/* ddsmoothmenu-v */
.ddsmoothmenu-v ul{
margin: 0;
padding: 0;
width: 170px; /* Main Menu Item widths */
list-style-type: none;
font: bold 12px Verdana;
border-bottom: 1px solid #ccc;
}
.ddsmoothmenu-v ul li{
position: relative;
}
/* Top level menu links style */
.ddsmoothmenu-v ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: white;
text-decoration: none;
padding: 6px;
border-bottom: 1px solid #778;
border-right: 1px solid #778;
}
.ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active{
background: #414141; /*background of menu items (default state)*/
color: white;
}
.ddsmoothmenu-v ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: black;
color: white;
}
.ddsmoothmenu-v ul li a:hover{
background: black; /*background of menu items during onmouseover (hover state)*/
color: white;
}
/*Sub level menu items */
.ddsmoothmenu-v ul li ul{
position: absolute;
width: 170px; /*Sub Menu Items width */
top: 0;
font-weight: normal;
visibility: hidden;
}
/* Holly Hack for IE \*/
* html .ddsmoothmenu-v ul li { float: left; height: 1%; }
* html .ddsmoothmenu-v ul li a { height: 1%; }
/* End */
 -------------------------------------------------------------------------------------------------------------
Trong đó #414141 là màu nền của thanh Menu

Bước 3Tiếp theo  nhấn Ctrl + F tìm th  </head> bạn copy  đoạn code bên dưới dán vào trước thẻ  </head>.
-------------------------------------------------------------------------------------------------------------
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script src='http://namkna-tratt.googlecode.com/files/ddsmoothmenu-namkna.js' type='text/javascript'></script>
<script type='text/javascript'>

ddsmoothmenu.init({
mainmenuid: "smoothmenu1", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
//customtheme: ["#1c5a80", "#18374a"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})

ddsmoothmenu.init({
mainmenuid: "smoothmenu2", //Menu DIV id
orientation: 'v', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu-v', //class added to menu's outer DIV
//customtheme: ["#804000", "#482400"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})
</script>
------------------------------------------------------------------------------------------------------------
Bước 4: Tiếp theo tìm thẻ  </header>  Copy đoạn code dưới dây trước thẻ </header>
---------------------------------------------------------------------------------------------------------------------------------
<div id="smoothmenu1" class="ddsmoothmenu">
<ul>
<li><a href="http://thuchanhmemnu.blogspot.com/">Home</a></li>
<li><a href="#"> Tên menu </a>
  <ul>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  </ul>
</li>
<li><a href="#"> Tên menu </a>
  <ul>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  </ul>
</li>
<li><a href=" địa chỉ trang "> Tên menu </a></li>
<li><a href="#"> Tên menu </a>
  <ul>
  <li><a href=" địa chỉ trang "> Tên trang </a></li>
  <li><a href="#"> Tên trang </a>
    <ul>
    <li><a href=" địa chỉ trang "> Tên trang </a></li>
    <li><a href=" địa chỉ trang "> Tên trang </a></li>
    <li><a href="#"> Tên trang </a>
  <ul>
      <li><a href=" địa chỉ trang "> Tên trang </a></li>
      <li><a href=" địa chỉ trang "> Tên trang </a></li>
      <li><a href=" địa chỉ trang "> Tên trang </a></li>
      <li><a href=" địa chỉ trang "> Tên trang </a></li>
      <li><a href=" địa chỉ trang "> Tên trang </a></li>
  </ul>
    </li>
    <li><a href=" địa chỉ trang "> Tên trang </a></li>
    </ul>
  </li>
  </ul>
</li>
<li><a href=" địa chỉ trang "> Tên trang </a></li>
</ul>
<br style="clear: left" />
</div> 

-----------------------------------------------------------------------------------------------------------------------------------
Sau đó lưu lại và xem kết quả.
Chúc các bạn thành công.





Chủ Nhật, 3 tháng 7, 2016

LINK NHÃN LÀ GÌ ?

    
   Theo email yêu cầu, của một số bạn mới sử dụng Blogspot - thắc mắc về cách đặt bài viết vào từng chuyên mục (nhãn) trong Blogspot. Để đỡ mất thời gian trả lời email riêng cho từng bạn, Caocongkien 360 viết bài này để chia sẻ những băn khoăn, thắc mắc trên.  

Nhãn là gì?

"Nhãn" (Labels) - trong Blogspot: Có nghĩa là tên của một tập hợp các bài viết cùng chủ đề, thể loại nào đó. Ví dụ: Trong trang Caocongkien 360 này "THỦ THUẬT BLOG" là nhãn của các bài viết về thủ thuật blog; "TÔI VÀ THƠ" là nhãn của các bài thơ,...

Cách tạo "Nhãn" cho các bài viết:

- Từ giao diện soạn thảo hoặc chỉnh sửa bài viết như hình dưới, các bạn vẫn viết bài như bình thường. Viết xong, nhìn sang bên phải - ngay dưới cột "Cài đặt bài đăng" có một biểu tượng màu đen và chữ "Nhãn"
- Bấm chuột vào chữ "Nhãn" [1] (xem các ảnh dưới) sẽ có một khung nhỏ hiện ra, đây là nơi các bạn đặt tên cho "Nhãn" của bài viết đang thực hiện. 


Bắt đầu tạo"Nhãn" và dặt tên cho"Nhãn"

- Sau khi đã đặt tên cho "Nhãn" của bài viết, bấm vào nút "Hoàn thành" [2] để lưu lại. Bây giờ, một "Nhãn" đã hiển thị với dòng chữ màu xanh, bên dưới khung vừa đặt tên "Nhãn". Các bạn chỉ cần bấm "Xuất bản" [3] là xong. 
- Nếu muốn tạo một "Nhãn" khác, thì viết một bài nữa và tiếp tục gắn (đặt tên) cho "Nhãn" mới - lặp lại thao tác như trên.
- Nếu viết một bài nữa và muốn đặt vào nhãn cũ thì chỉ việc bấm vào nhãn cũ đã tạo (hiển thị với chữ màu xanh ngay bên dưới khung đặt tên "Nhãn") rồi bấm "Hoàn thành" [2] là bài viết sẽ được hệ thống tự động chuyển vào "Nhãn" đó. Chỉ cần bấm "Xuất bản" [3] là được. (Thao tác tạo các "Nhãn" này có thể làm trước hoặc sau khi viết bài đều được).

Thay tên cho"Nhãn"

- Nếu muốn chuyển các bài viết từ nhãn này sang nhãn khác, chỉ cần vào "Chỉnh sửa bài viết" thay tên "Nhãn" bằng tên đã có hoặc tạo "Nhãn" mới và bấm "Hoàn thành" [2] rồi bấm "Xuất bản" [3] hoặc "Cập nhật" [4] là xong việc.

     Chúc các bạn thành công và có những trang blog như ý!


Nguyễn Văn Cường (Caocongkien) 

CODE HAY CHO BLOGGER

Trong blogspot, khi bạn bắt đầu tạo lập một website thì những tiện ích được chia sẻ ngay sau đây sẽ rất hữu ích để tăng tính chuyên nghiệp cho sản phẩm của bạn. Hãy khám phá Tổng Hợp Các Code Tiện Ích Hay Dùng Cho Blogspot.
Code-tong-hop
Các tiện ích code hay dùng
1. Code widget Hỗ Trợ Trực Tuyến
<p style="text-align: center"><span style="font-size: large"><span style="font-family: Verdana"><span style="color: 
rgb(0,0,255)"><span style="color: rgb(0,0,128)"><span class="style5"><span style="color: rgb(0,128,128)">Mr. Định</span> <a href="ymsgr:sendim?dinhdkchick_1990">
<img src='http://opi.yahoo.com/online?u=dinhdkchick_1990&m=g&t=2'/></a></span></span></span></span></span></p>
<div style='text-align: center;'> 
<b><span class='Apple-style-span' style="font-size:200%;color:red;">0935.611.619</span></b></div>
 Sửa những nội dung tô màu xanh thành thông tin liên hệ của bạn.
Code này hỗ trợ trực tuyến cho yahoo. hình ảnh hiển thị như bên dưới:
2. Code Đếm ngược thời gian
 Rất tiện dụng dành cho những trang mua hàng có giới hạn thời gian mua sắm
<script type="text/javascript">
var year=2014;//năm
var month=5;//tháng 
var day=15;//ngày
var h=12;//giờ
var i=0;//phút
var s=0;//giây
dateFuture1 = new Date(year,month,day,h,i,s);
function GetCount(ddate,iid){

dateNow = new Date(); //grab current date
amount = ddate.getTime() - dateNow.getTime(); //calc milliseconds between dates
delete dateNow;

// if time is already past
if(amount < 0){
document.getElementById(iid).innerHTML="Now!";
}
// else date is still good
else{
days=0;hours=0;mins=0;secs=0;out="";

amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

days=Math.floor(amount/86400);//days
amount=amount%86400;

hours=Math.floor(amount/3600);//hours
amount=amount%3600;

mins=Math.floor(amount/60);//minutes
amount=amount%60;

secs=Math.floor(amount);//seconds
out += (days<=9?'0':'')+days +" "+((days==1)?"Ngày":"Ngày")+", ";
out += (hours<=9?'0':'')+hours +" "+((hours==1)?"hour":"Giờ")+", ";
out += (mins<=9?'0':'')+mins +" "+((mins==1)?"min":"Phút")+", ";
out += (secs<=9?'0':'')+secs +" "+((secs==1)?"sec":"Giây")+", ";
out = out.substr(0,out.length-2);
document.getElementById(iid).innerHTML=out;

setTimeout(function(){GetCount(ddate,iid)}, 1000);
}
}

window.onload=function(){
GetCount(dateFuture1, 'countbox1');
//you can add additional countdowns here (just make sure you create dateFuture2 and countbox2 etc for each)
};
</script>
<div id="countbox1"></div>
 Chú ý: 
- Tháng phải trừ đi 1
Ví dụ: 
Ngày bạn kết thúc: 12:00:00 14-6-2014
Thì chuyển thành: 12:00:00 14-5-2014     
- Bạn chỉnh sửa lại thông tin cho phù hợp:
var year=2014;//năm
var month=5;//tháng 
var day=15;//ngày
var h=12;//giờ
var i=0;//phút
var s=0;//giây
- Thời gian bắt đầu là thời gian mật định trên máy của khách hàng

3. Code chạy hình ảnh từ dưới lên
<marquee height="200" direction="UP" scrolldelay="5" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()"> 
<a href="Your link"><img border="0" src="http://4.bp.blogspot.com/-M3DZdGFLF2M/T7KO_o-TnHI/AAAAAAAAAHE/Qfqr-wkqyaI/s1600/tomato.jpg" width="290" height="250" />
<a href="Your link"><img border="0" src="http://3.bp.blogspot.com/-HHq4XLq5GTc/U4Sr1tBaC6I/AAAAAAAAAAo/nIn9fLLhRYg/s1600/google-drive.jpg" width="290" height="150" /></a>
<a href="Your link"><img border="0" src="http://4.bp.blogspot.com/-M3DZdGFLF2M/T7KO_o-TnHI/AAAAAAAAAHE/Qfqr-wkqyaI/s1600/tomato.jpg" width="290" height="250" />
</a>
<a href="Your link"><img border="0" src="http://1.bp.blogspot.com/-IUM3hbOU8mM/T7KRQIFKyqI/AAAAAAAAAHg/3kpBvjaGfcQ/s1600/15.JPG" width="290" height="250" />
</a>
</marquee>
 Bạn điều chỉnh các nội dung sao cho phù hợp:
- height="200": Chiều cao của khung ảnh chạy
- "Your link": Thay bằng link bạn muốn liên kết đến
http://3.bp.blogspot.com/-HHq4XLq5GTc/U4Sr1tBaC6I/AAAAAAAAAAo/nIn9fLLhRYg/s1600/google-drive.jpg: Thay hết bằng hình ảnh bạn muốn hiển thị. 

4. Code banner chạy dọ 2 bên web
Lựa chọn 1: Banner cố định khi lăn chuột
<div id="left_ads_float">
        <a href="Your Link" target="_blank"><img border="0" src="http://3.bp.blogspot.com/-NyRs0qSZyqE/U5sQmqOLbOI/AAAAAAAAAKs/ZxafFowRyzY/s1600/banner-truot-2-ben.png" width="120" /></a>
    </div>
    <div id="right_ads_float">
       <a href="Your Link" target="_blank"><img border="0" src="http://3.bp.blogspot.com/-NyRs0qSZyqE/U5sQmqOLbOI/AAAAAAAAAKs/ZxafFowRyzY/s1600/banner-truot-2-ben.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>
Bạn chỉnh sửa "your link" thành đường dẫn bạn muốn trỏ đến. Nếu bạn biết về code thỉ chỉnh sửa thêm phần tô đỏ. Nếu không bạn giữ nguyên.

Lựa chọn 2: Banner trượt khi lăn chuột 
<div id="divAdRight" style="display: none; position: absolute; TOP: 0px">    
<a href="your link"><img src="http://3.bp.blogspot.com/-NyRs0qSZyqE/U5sQmqOLbOI/AAAAAAAAAKs/ZxafFowRyzY/s1600/banner-truot-2-ben.pngwidth="125" /></a>
</div>    
<div id="divAdLeft"  style="display: none; position: absolute; TOP: 0px">    
<a href="your link"><img src="http://3.bp.blogspot.com/-NyRs0qSZyqE/U5sQmqOLbOI/AAAAAAAAAKs/ZxafFowRyzY/s1600/banner-truot-2-ben.pngwidth="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>
Bạn thực hiện chỉnh sửa tương tự như lựa chọn 1. Có thêm chú ý sau:
LeftAdjust = 5: khoảng cách từ mép trái trang blog đến banner
RightAdjust = 5: khoảng cách từ mép phải trang blog đến banner
TopAdjust = 10: khoảng cách từ mép trên trang blog đến banner

5. Code chèn Facebook like box vào blogspot
Cách 1:  Bạn copy code bên dưới, sau đó tạo một widget HTML/javascript và dán code này vào
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fquangcaobanghieuledlaidinhdanang&amp; width=295&amp; height=350&amp; colorscheme=light&amp; show_faces=true&amp; border_color&amp; stream=false&amp; header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:295pxheight:350px;" allowtransparency="true"></iframe>
Bạn chỉnh sửa phần tô đậm màu đỏ thành tên fanpage của bạn. width:295pxheight:350px là chiều rộng và chiều cao của like box
Cách 2: Bạn vào đăng nhập vào fanpage và điều chỉnh như mong muốn theo đường dẫn phía dưới
https://developers.facebook.com/docs/plugins/like-box-for-pages
Nguồn: www.ikhampha.com

Popular Posts

Recent Posts

Unordered List

Text Widget