Latest Post

Hiện thị Fanpage của Facebook ra trước web/blog với lightbox

Written By Rurutomi Vanduc on Chủ Nhật, 14 tháng 10, 2012 | 11:23


FanPage của facebook chắc hẵn là mọi người đã không còn xa lạ nữa và việc tạo trang fanpage cũng không quá khó khăn. Bạn hiện tại đang có 1 trang fanpage và muốn đặt chúng vào blog hay website của mình nhưng bạn không biết đặt như thế nào để thu hút khách truy cập click Like fanpage của bạn thì mình nghĩ hãy để chúng show ra trước blog hay web là cách hiệu quả. Với thủ thuật này bạn hoàn toàn có thể hiển thị trang fanpage của mình ra trước blog hay web với 1 khoảng thời gian nhất định kèm theo đó là hiệu ứng lightbox. Trang fanpage sẽ hiện ra, làm tối đi những phần khác trên blog hay web của bạn và sẽ trượt xuống khi bạn cuộn chuột xuống cuối trang, cách này sẽ thu hút sự chú ý của người dùng truy cập click Like cho bạn.
Lưu ý: Cách hiện thị như thế có thể gây phiền hà đến người dùng, chính vì thế bạn không nên lạm dụng mà nên đặt thời gian hiện Fanpage cho hợp lý.

Hiện thị Fanpage của Facebook ra trước web/blog với lightbox

» Bắt đầu thủ thuật

1. Đăng nhập vào tài khoản Blogger
2. Vào phần Template (Mẫu)
3. Chọn chỉnh sửa HTML (Edit HTML) >> Chọn Tiếp tục
4. Chèn tiếp code CSS bên dưới vào trước thẻ ]]></b:skin>
#fancybox-loading {
position: fixed;
top: 50%;
left: 50%;
width: 40px;
height: 40px;
margin-top: -20px;
margin-left: -20px;
cursor: pointer;
overflow: hidden;
z-index: 110004;
display: none;
}
#fancybox-loading div {
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 480px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9nb1o2YKZ6nkQ2fW4HxcWOq0sMVMe6l5CGbdS1SxCEcDtNxDkkrCslwVIdNyZtL8giK0eIpqCE2BF1g1bOlBaJ1LWFemOr0HcCgc1fdsnsDaG5M3ty62jKRos4Ejet4eLa71kHV-tcxlN/s480/fancybox.png');
}
#fancybox-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 110000;
display: none;
}
#fancybox-tmp {
padding: 0;
margin: 0;
border: 0;
overflow: auto;
display: none;
}
#fancybox-wrap {
position: absolute;
top: 0;
left: 0;
padding: 20px;
z-index: 110001;
outline: none;
display: none;
}
#fancybox-outer {
position: relative;
width: 100%;
height: 100%;
background: #fff;
border: 3px dashed #ccc;
}
#fancybox-close {
position: absolute;
top: -15px;
right: -15px;
width: 30px;
height: 30px;
background: transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9nb1o2YKZ6nkQ2fW4HxcWOq0sMVMe6l5CGbdS1SxCEcDtNxDkkrCslwVIdNyZtL8giK0eIpqCE2BF1g1bOlBaJ1LWFemOr0HcCgc1fdsnsDaG5M3ty62jKRos4Ejet4eLa71kHV-tcxlN/s480/fancybox.png') -40px 0px;
cursor: pointer;
z-index: 110003;
display: none;
}
5. Chèn tiếp code bên dưới vào trước thẻ </head>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.min.v1.4.1.js" type="text/javascript"></script>
<script src="http://traidatmuidata.appspot.com/scripts/launch.js" type="text/javascript"></script>
<script src="http://traidatmuidata.appspot.com/scripts/scs.js" type="text/javascript"></script>

<script type="text/javascript">/* <![CDATA[ */
var lb_l_ret = {"fb_id":"301202423307434","display_on_post":"1"," show_once":"15","delay":"5000","display_on_page": "","fancybox":"","display_on_homepage":"","faceboo kheader":"","gaevent":"","eam":"","display_on_arch ive":"","hideonlike":""}; /* ]]> */
</script>

- delay":"5000" chính là thời gian hiển thị Fanpage, đơn vị là giây, ở đây 5000 tương ứng là 5 giây.
- Bạn thay id 301202423307434 thành ID trang Fanpage của bạn

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

EximiousSoft GIF Creator 5.81 | Tạo ảnh động chuyên nghiệp

Written By Rurutomi Vanduc on Thứ Năm, 4 tháng 10, 2012 | 13:08

Một phần mềm thiết kế ảnh động chuyên nghiệp với giao diện trực quan dễ sử dụng nhưng đầy sức mạnh...
Với hàng tá các hiệu ứng đặc biệt, EximiousSoft GIF Creator cho phép bạn thiết kế các hoạt cảnh tuyệt vời hoặc banner trong thời gian ngắn. Chương trình cung cấp nhiều công cụ chỉnh sửa ảnh chuyên nghiệp bao gồm các công cụ lựa chọn Magic wand, Lasso cũng như các công cụ lựa chọn hình học khác. Một khi bạn thực hiện một lựa chọn, bạn có thể chỉnh sửa trực tiếp lên vùng này mà không làm ảnh hưởng tới vùng khác. Thêm nữa, bạn có thể sao chép, di chuyển hay xóa vùng này theo yêu cầu.

EximiousSoft Gif Creator hỗ trợ mạnh cho đồ họa vecto, bạn có thể sử dụng nó để vẽ ra các đường thằng, hình chữ nhật, đường tròn và các dạng hình học khác mịn. Bên cạnh đó, chương trình có thể tạo ra nhiều văn bản hay biểu tượng với chất lượng đáng kinh ngạc.

Tất cả các chỉnh sửa của chương trình đều trực quan, bạn có thể xem trực tiếp các kết quả chỉnh sửa cũng như hủy bỏ bất kỳ thao tác bất cứ lúc nào, EximiousSoft Gif Creator rất dễ sử dụng và thuận tiện. Các định dạng ảnh có thể được nhập vào chương trình: GIF, BMP, JPG, PCX, PNG, TIFF, TGA, PSD, ICO, CUR, ANI.

Tên phần mềm: EximiousSoft GIF Creator 5.81
Chức năng chính: Tạo ảnh động chuyên nghiệp
Dung lượng: 3.7 MB

Hướng dẫn thiết kế template Blogger hoàn chỉnh.

"Một số điều cần lưu ý trước khi thiết kế mẫu Blogger:"
 1.Không nên thiết kế ngay trên Blog chính của mình. Bạn nên tạo một trang blog khác chỉ để phục vụ cho việc thiết kế. Sau khi thiết kế hoàn thành hãy đem cái template mới đó về áp dụng cho blog chính của mình. 
 2.Trên hướng dẫn này mình chỉ viết về cấu trúc template. Những vấn đề về css bạn xem ở bài viết này nha.
 3.Trước khi thiết kế bạn nên phát thảo ra giấy về hình dạng trang blog mình mong muốn sẽ như thế nào. Việc này giúp bạn định hình được việc chính mình cần phải làm là gì, tránh lang mang không biết bắt đầu từ đâu.

Bắt đầu công việc chính:
1.Cấu trúc cơ bản template của 1 blog có dạng như sau:
<htmlxmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:skin><![CDATA[

]]></b:skin>
</head>
<body>
<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Thanh điều hướng' type='Navbar'/>
</b:section>
</body>
</html>
Việc bạn cần làm là vào thiết kế → Chỉnh sửa HTML xóa toàn bộ đoạn code bên trong đó và paste đoạn code trên vào rồi save lại. Khi save lại sẽ xuất hiện 1 mục cảnh báo dạng như hình bên dưới. Bạn chọn vào mục xóa tiện ích.

Về trang chủ bạn sẽ thấy nó trắng toát không còn gì trên đó hết.
2. Chèn thẻ meta và title cho blog - cấu trúc template
Giải thích 1 tí về vị trí thêm code vào đoạn code ở bước 1.
» Meta, tags sẽ được chèn dưới thẻ <head> và trên thẻ <b:skin>
Để blog bạn được các công cụ tìm kiếm chú ý đến thì phần này là phần quan trọng nhất.
Bạn có thể xem hình bên dưới để hiểu ý nghĩa của phần meta tags là gì.
Ở dòng đầu là khi search ra trang chủ. Nó sẽ hiển thị tên blog vào đó.
Dòng bên dưới là khi search ra nội dung trong bài viết. Nó sẽ hiển thị kiểu Tên bài viết - Tên Blog
Nói chung phần này bạn cũng không cần hiểu nhiều làm gì. Chỉ cần chèn đoạn code sau vào vị trí đó là được:
<title><data:blog.pageTitle/></title>
<meta content='Mô tả về blog của bạn' name='description'/>
<meta content='Các từ khóa trên blog của bạn' name='keywords'/>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
<meta expr:content='data:blog.pageName + &quot; - Mô tả về blog của bạn&quot;' name='description'/>
<meta expr:content='data:blog.pageName + &quot;, Các từ khóa trên blog của bạn&quot;' name='keywords'/>
</b:if>
Thay đổi những dòng màu đỏ cho phù hợp với blog của bạn là được rồi. 
» Những đoạn css qui định về thuộc tính các module trên blog sẽ được chèn phía trên thẻ ]]></b:skin>
Để hiểu về các thuộc tính của css thì bạn đọc bài viết này nha.
» Các module hiển thị trên blog sẽ được chèn bên trong thẻ <body> Module hiển thị trên blog </body>
Để hiểu cách gọi ra các module bạn xem phần đầu của bài viết này nha.
3. Bố cục các thành phần bạn muốn có trên blog của mình ra giấy (đây là bước đầu tiên để bạn tạo được sự khác biệt cho blog của mình. Ví dụ mình muốn blog mình có cấu trúc dạng như hình vẽ bên dưới.
Thành phần blog này bao gồm 3 phần chính:
» Ở đầu trang là header.
» Ở giữa gồm 3 phần là 1 sidebar bên trái (sidebar1) 1 sidebar bên phải (sidebar2) và phần nội dung bài viết ở giữa.(post)
» Ở cuối trang là footer.
Tất nhiên đây chỉ là những module lớn. Bên trong mỗi module lớn này sẽ còn được chia thành nhiều module nhỏ nữa. Vấn đề này mình sẽ đề cập sau. Việc bây giờ bạn cần làm là tạo ra các module ban đầu cho blog.
4. Tạo Module đầu tiên trên blog. 
Module lớn nhất của blog là body. Đây là module mặc định chứa tất cả các module khác trên blog.
Bạn cần khai báo một số thuộc tính css cho module body này vào phía trên thẻ ]]></b:skin> theo dạng như sau:
body{
background: #cccccc;  /* Màu nền toàn blog (mặc định là màu trắng) */ 
font: 16px georgia;  /* Cỡ chữ và font chữ cho toàn blog */ 
thuộc tính khác; /* Một số thuộc tính khác cho toàn blog */ 
...;
}
Chú ý: Bạn có thể tìm hiểu thêm về các thuộc tính khác ở bài viết này sau này mình sẽ không đề cập đến cái này nữa. tất cả những gì liên quan đến thuộc tính css thì bạn cứ vào bài viết trên.
Tiếp theo mình sẽ tạo 1 module với ID là box nằm trong body và chứa tất cả các module còn lại của blog.
Cách làm: ở giữa thẻ <body> và </body> bạn thêm 1 đoạn code như bên dưới:
<div id='box'>
Nội Dung Blog
</div>
Tiếp tục chèn thêm thuộc tính css cho id box này bằng cách thêm đoạn code này ở trên thẻ]]></b:skin>
#box{
Background:#3399bb; /* Màu nền của module box */ 
Width: 990px;  /* Chiều rộng của trang blog */ 
Margin:0 auto; /* Cân bằng vị trí module này vào giữa trang */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
Save template lại rồi về trang chủ bạn sẽ thấy có 1 module mới được hình thành.

5. Chia nhỏ Module box thành 3 phần: header, main-outer, footer
Việc tiếp theo là tạo ra 3 phần chính trên blog như mình đã đề cập ở trên bao gồm header, main-outer, footer. Cách làm cũng tương tự như gọi ra ID box cụ thể là:
ở giữa thẻ <div id='box'> và thẻ đóng </div> của box bạn thêm 1 đoạn code như bên dưới:
<div id='header'>
Nội Dung header
</div>
<div id='main-outer'>
Nội Dung Blog
</div>
<div id='footer'>
Nội Dung Footer
</div>
Tiếp tục chèn thêm thuộc tính css cho 3 id vừa tạo bằng cách thêm đoạn code css của nó ở trên thẻ ]]></b:skin>
#header{
Background:#4499bb; /* Màu nền của module header */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
#main-outer{
Background:#113366; /* Màu nền của module main-outer */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
#footer{
Background:#6600ee; /* Màu nền của module footer */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
Save template lại rồi về trang chủ bạn sẽ thấy có 3 module mới được hình thành.

6. Chia nhỏ Module main-outer thành 3 phần: sidebar1, main, sidebar2
Tiếp tục lại chia nhỏ module Main-outer ra thành 3 module nhỏ là sidebar1, main và sidebar2. Cách làm cũng tương tự như bạn chia nhỏ mudule box ở trên:
Cụ thể là ở giữa thẻ <div id='main-outer'> và thẻ đóng </div> của main-outer bạn thêm 1 đoạn code như bên dưới:
<div id='sidebar1'>
Nội Dung sidebar1
</div>
<div id='main'>
Nội Dung Bài Viết
</div>
<div id='sidebar2'>
Nội Dung sidebar2
</div>
<div style='clear:both'/>
Chú ý: do 3 module trên sử dụng thuộc tính dời module qua trái, qua phải nên phía dưới nó cần có thêm  <div style='clear:both'/> để dừng hiệu ứng dời module.

Tiếp tục chèn thêm thuộc tính css cho 3 id vừa tạo bằng cách thêm đoạn code css của nó ở trên thẻ ]]></b:skin>
#sidebar1{
Background:#884400; /* Màu nền của module sidebar1 */ 
width:200px; /* Chiều rộng của module sidebar1 */ 
float:left; /* Dời module sidebar1 qua trái */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
#main{
Background:#646853; /* Màu nền của module main */ 
width:590px; /* Chiều rộng của module main */ 
float:left; /* Dời module main qua trái */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
#sidebar2{
Background:#518643; /* Màu nền của module sidebar2 */ 
width:200px; /* Chiều rộng của module sidebar2 */ 
float:right; /* Dời module sidebar2 qua phải */ 
thuộc tính 1; /* Một số thuộc tính khác */ 
thuộc tính 2; /* Một số thuộc tính khác */ 
...;
}
Chú ý: Do lúc tạo module Main-outer có chiều rộng là 990px (như đã qui định ở trên). Nên tổng chiều rộng 3 module bên trong nó không được lớn hơn 990px nếu tổng chiều rộng 3 module con lớn hơn 990px thì sidebar2 sẽ bị đẩy xuống dưới.
Và cứ bằng cách làm như trên bạn có thể chia nhỏ module trên blog của bạn ra bao nhiêu phần cũng được. Việc bạn cần làm là cứ chèn module vào đúng vị trí của nó, qui định kích thước và áp dụng những thể css phù hợp cho module đó phía trên thẻ ]]></b:skin> là ok.

7. Điều chỉnh sidebar (tạo mục Thêm Tiện Ích của blogspot cho sidebar)
Lẽ ra việc tiếp theo mình cần làm là điều chỉnh header trước nhưng như vậy sẽ có 1 số thứ phải điều chỉnh hơi lằng nhằng nên mình hướng dẫn điều chỉnh sidebar trước, sau này điều chỉnh header sẽ tiện hơn.
Như bạn cũng đã biết ở mục Thiết kế → Phần tử trang. Trên sidebar có mục Thêm Tiện Ích để tiện việc cho bạn bổ sung những tiện ích cần thiết cho blog. Và bây giờ mình sẽ hướng dẫn các bạn tạo ra mục này.
Như trên template mình đưa ra ban đầu thì có 2 sidebar 1 nằm bên trái và 1 nằm bên phải. mình sẽ hướng dẫn cho sidebar bên trái và bạn là tương tự với sidebar bên phải nha.
Trong template mình đã tạo thì sidebar bên trái có ID là sidebar1.
Ở giữa thẻ <div id='sidebar1'> và thẻ đóng </div> của sidebar1 bạn chèn đoạn code sau:
<b:section class='sbar1' id='sbar1' showaddelement='yes'/>
Save template lại.
 » Về mục Phần tử trang bạn sẽ thấy xuất hiện mục thêm tiệc ích. Lúc này nó sẽ nằm ở giữa. Nhưng không sao, cứ để nó ở đó sau này nó sẽ tự điều chỉnh lại.
 » Về trang chủ bạn sẽ thấy xuất hiện thanh Navbar ở đầu blog. Nếu bạn không muốn xài thanh navbar này thì chèn đoạn code sau vào trước thẻ ]]></b:skin> rồi save lại là xong.
#navbar-iframe {height:0px;visibility:hidden;display:none}
Làm tương tự với sidebar2 có 1 điều cần lưu ý là nhớ chuyển sbar1 trong đoạn code ở sidebar1 thành sbar2. Nếu bạn không chuyển cái này thì template sẽ báo lỗi.

Khi tạo ra được 2 sidebar rồi bạn hãy thử thêm 1 tiện ích gì đó vào blog xem nói hoạt động như thế nào.
Rất dễ thấy là mặc định tiêu đề của blog mới tạo bị dư 1 khoãng khá lớn ở trên và ở dưới. Để khắc phục điều này bạn chỉ cần chèn đoạn code sau phía trên thẻ ]]></b:skin> rồi save lại là xong.
h2 {padding:0; margin:0}

8. Điều chỉnh header (tạo header như mẫu header mẫu của blogspot)
Như đã đề cập ở mục 7. Phần tiếp theo mình cần điều chỉnh là header của blog. Header mặc định của blog là một tiện ích cho phép thay đổi tiêu đề và mô tả của blog. ngoài ra còn cho phép thay đổi banner cho header.
Và bây giờ mình sẽ hướng dẫn bạn gọi ra tiện ích này cho header.
Vào template (KHÔNG mở rộng mẫu tiện ích). Trong template này header mình đã tạo ban đầu có ID là header.
Ở giữa thẻ <div id='header'> và thẻ đóng </div> của header bạn chèn đoạn code sau:
<b:section class='head' id='head' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='(Tiêu đề)' type='Header'/>
</b:section>
Save template lại. Về mục phần tử trang bạn sẽ thấy tiện ích của header đã được tạo ra. Bạn chỉ việc thay đổi tiêu đề và mô tả cho blog hoặc thay đổi banner cho blog là được. Về trang chủ để kiểm tra kết quả nào.

9. Điều chỉnh phần bài đăng (main) (hiển thị nội dung các bài viết ra blog)
Trong template này mình đã cho các bài viết nằm trong ID main. Để hiển thị nội dung các bài viết ra blog bạn chỉ việc thực hiện như sau:
Vào template (KHÔNG mở rộng mẫu tiện ích) ở giữa thẻ <div id='main'> và thẻ đóng</div> của main bạn chèn đoạn code sau:
<b:section class='mainpost' id='mainpost' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Bài đăng trên Blog' type='Blog'/>
</b:section>
 Save template lại. Về mục Phần tử trang bạn sẽ thấy tiện ích Bài Đăng Trên Blog đã hiện ra. Bạn chỉ việc chỉnh sửa tiện ích này lại cho phù hợp với blog là ok rồi. Về trang chủ các bài đăng có trên blog cũng đã được hiện ra. Như vậy là ok rồi.

10. Điều chỉnh footer blog. 
Thông thường footer blog là nơi người ta đặt thông tin về tên template. Người thiết kế ra template (ghi tên mình zô liền. mình tự thiết kế mà)  nên bạn cứ đặt những code thông thường vào đó là được rồi.
Cũng có một số bạn muốn đặt thêm một số tiện ích vào phần footer. Việc bạn cần làm là thực hiện y như bước 7 nhưng thay chữ sbar1 thành foot là được rồi.

11. Những điều chỉnh khác.
Về cơ bản template blogspot chỉ có bao nhiêu đó thôi. Ngoài ra cũng chẳng còn gì nữa.
Tiếp theo là bạn áp dụng những thủ thuật khác để tạo ra những nét đặc trưng riêng cho blog của mình là được rồi.
Tiếp theo là tùy biến Code và thiết kế theo tư duy và ý thức của bạn!

(http://www.voquocan.com/)
Chúc các bạn thành công!

Các thành phần trong template blogger


Bài viết này liệt kê các thành phần cần có của 1 blog. Các bạn có thể tuỳ chỉnh hoặc để nó mặc định.Tạo hộp search.
vị trí: thường đặt ở top hoặc thanh menu ngang.

<div id='search'> <form expr:action='data:blog.homepageUrl + &quot;search/&quot;' id='searchform' method='get'> <input id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search my site...&quot;;}' onfocus='if (this.value == &quot;Search my site...&quot;) {this.value = &quot;&quot;}' type='text' value='Search my site...'/> <input id='searchsubmit' type='submit' value=''/> </form> </div>
<head> & Tiêu đề <title>
<!-- các thẻ ở phần <head> --><b:include data='blog' name='all-head-content'/><title> <b:if cond='data:blog.homepageUrl == data:blog.url'> <data:blog.title/> <b:else/> <data:blog.pageName/> | <data:blog.title/> </b:if></title>
Thiết kế CSS
<b:skin><![CDATA[/*Thiết kế CSS tại đây*/]]></b:skin>
BlogArchiveVị trí: thường đặt ở sidebar.
<b:section><b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/></b:section>


Page MenuVị trí: thanh ngang, ngay dưới banner.
<b:section id='pages' maxwidgets='1' showaddelement='no'> <b:widget id='PageList1' locked='false'  type='PageList'/></b:section>
Phần nội dung.
Có chức năng:
  • liệt kê (show) tất cả các bài viết:
  • tiêu đề.
  • nội dung.
  • thông tin người gửi, comment, nhãn.
  • hiển thị chi tiết 1 bài viết.
  • tiêu đề.
  • nội dung
  • thông tin người gửi, comments, thuộc nhãn.
  • hiển thị chi tết các comments.
  • chi tiết từng comment.
  • form gửi comment
  • thanh điều hướng tới bài khác.
  • Toàn bộ chức năng chỉ gói gọn trong đoạn code dưới đây :D.
<b:section class='main' id='main' showaddelement='no'><b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/></b:section>
Đây là code sử lý mặc định của template blogger. Nếu bạn muốn tuỳ chỉnh thì nhớ chọn vào Expand Widget Templates để xem đầy đủ code.


PopularPosts (Xem nhiều nhất)Widget các bài viết phổ biến được xem nhiều nhất.
Mặc định:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>Đầy đủ:<ul>       <b:loop values='data:posts' var='post'>       <li>         <b:if cond='data:showThumbnails == &quot;false&quot;'>           <b:if cond='data:showSnippets == &quot;false&quot;'>             <!-- (1) No snippet/thumbnail -->             <a expr:href='data:post.href'><data:post.title/></a>           <b:else/>             <!-- (2) Show only snippets -->             <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>             <div class='item-snippet'><data:post.snippet/></div>           </b:if>         <b:else/>           <b:if cond='data:showSnippets == &quot;false&quot;'>             <!-- (3) Show only thumbnails -->             <div class='item-thumbnail-only'>               <b:if cond='data:post.thumbnail'>                 <div class='item-thumbnail'>                   <a expr:href='data:post.href' target='_blank'>                     <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>                   </a>                 </div>               </b:if>               <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>             </div>             <div style='clear: both;'/>           <b:else/>             <!-- (4) Show snippets and thumbnails -->             <div class='item-content'>               <b:if cond='data:post.thumbnail'>                 <div class='item-thumbnail'>                   <a expr:href='data:post.href' target='_blank'>                     <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>                   </a>                 </div>               </b:if>               <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>               <div class='item-snippet'><data:post.snippet/></div>             </div>             <div style='clear: both;'/>           </b:if>         </b:if>       </li>       </b:loop>     </ul>     <b:include name='quickedit'/><!-- can edit on interface -->

Danh mục.
Liệt kê các danh mục categories.
<b:widget id='Label1' locked='false' title='Category List' type='Label'/>
Hiển thị ngày tháng của bài viết.
<b:if cond='data:post.dateHeader'> <script>document.write("<data:post.dateHeader/>");</script></b:if>
Link tiêu đề của bài viết.
<b:if cond='data:post.title'> <h2 class='post-title entry-title'> <b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> </b:if> </h2></b:if>

"Tạo khung đăng ký nhận bài viết thông qua feedburner"

Nếu bạn là một blogger chắc hẳn bạn đã một lần nghe nói đến từ FeedburnerFeedburner là một công cụ của Google để giúp bạn quản lý và tối ưu feed của mình, tự động gửi bài viết tới email của thành viên, thống kê số người đọc tin, gắn quảng cáo vào feed để kiếm tiền… Tuy nhiên việc làm sao để có thể tạo feed và làm sao để chèn vào blog của mình. Điều này tuy đơn giản với những người đã quen thuộc với tính năng này, nhưng cũng là rắc rối cho những ai chưa tiếp cận nó.

Upload lấy link direct và code chèn blog file Flash [swf]




HOST - FILEDEN.COM

A.Hướng dẫn đăng kí tài khoản :

Bước 1 : bạn vào trang này http://fileden.com/

Ở ngay trên đầu trang có chữ Register hoặc Creat acount,ấn vào đó để bắt đầu công việc đăng kí tài khoản :



Nhớ là chọn free nhé,ko mất tiền 

Bước 2 : sau khi ấn create account sẽ hiện ra một bảng,chọn cái Sign Up ở cột đầu tiên nhé :
3.Bước 3 : Tiếp theo sẽ hiện lên một bảng,bắt điền thông tin,nhập thông tin của các bạn vào như trong hình dưới nhé :
4.Bước 4 :Sau khi điền đầy đủ thông tin như trên bạn Ấn nút Register :
Oke như vậy là đã đăng kí xong rùi đó,sẽ hiện lên bảng như thế này :
5.Bước 5 : Kích hoạt tài khoản : vào mail yahoo mà bạn đã điền ở trên đó,trang fileden.com  đã gửi về mail của bạn một tin có dạng : Account activation để kích hoạt tài khoản rùi !
Giờ thì bạn đã có một tài khoản trên trang fileden.com  rùi đó,bạn vào lại tranghttp://fileden.com/ đăng nhập tên tài khoản mà mình vừa đăng kí vào,sau đó up file flash lên thôi

B.Hướng dẫn up file flash lên http://fileden.com/

1.Đăng nhập tên tài khoản của bạn:
2. Ấn upload để up file :

3.Chọn Continue to file uploader

4. Chọn browse Files :để tìm đến file flash của bạn,sau đó ấn Start Upload :để bắt đầu up file flash :
Code:
<embed allowscriptaccess="never"
type="application/x-shockwave-flash"
src="http://i173.photobucket.com/albums/w49/chiplove9xpro/Flash/Share/chiploveFlashloader.swf?file=Link_flash" wmode="transparent" width="600" height="200">

Nguồn: Namkna's blog

HOST - SWFCABIN.COM


Vào trang http://www.swfcabin.com để upload, giao diện khá đơn giản, không cần phải mất công đăng ký mà vẫn upload ngon lành.


Sau khi upload, bạn sẽ nhận được dòng thông báo và url sau: 
Your swf file has successfully been published and is now available at the below url:

Bạn lấy link direct để chèn vào code bằng cách thay chữ open bằng swf-files và thêm đuôi .swf vào sau cùng
Ví dụ với link trên, ta có link direct sau:
http://www.swfcabin.com/swf-files/1349340354.swf
Cuối cùng để chèn vào Blog, bạn dán link của file flash lúc nãy vào code phía dưới đây:
<embed bgcolor="#FFFFFF" height="250" width="1000" pluginspage="http://www.macromedia.com/go/getflashplayer" src="Dán link file flash của bạn ở đây " type="application/x-shockwave-flash" ></embed>
Nguồn: TraiDatMui & DungHennessy Blog

Định nghĩa tiêu đề HTML với Tag


Định nghĩa và sử dụng

  • Tag <hx>: Sử dụng để định nghĩa tiêu đề cho HTML.
  • Với <hx> có giá trị từ <h1> tới <h6>.
  • Trong đó thành phần quan trọng cũng giảm từ <h1> tới <h6> (hay từ tiêu đề lớn nhất là <h1>, và tiêu đề nhỏ nhất là <h6>).
  • <h1> là thành phần quan trọng nhất trong trang HTML, thường người ta sử dụng <h1> cho logo, hoặc dòng mô tả trang web (mục đích SEO).

Sự khác nhau giữa HTML và XHTML

HTML4.01XHTML1.0XHTML1.1
Không có sự khác biệt

Cấu trúc

<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

Ví dụ

Html viết:

<h1>Đây là tiêu đề quan trọng nhất (lớn nhất)</h1>
<h2>Đây là tiêu đề quan trọng thứ nhì (lớn thứ nhì)</h2>
<h3>Đây là tiêu đề quan trọng thứ ba (lớn thứ ba)</h3>
<h4>Đây là tiêu đề quan trọng thứ tư (lớn thứ tư)</h4>
<h5>Đây là tiêu đề quan trọng thứ năm (lớn thứ năm)</h5>
<h6>Đây là tiêu đề ít quan trọng nhất (nhỏ nhất)</h6>

Hiển thị trình duyệt:

Đây là tiêu đề quan trọng nhất (lớn nhất)

Đây là tiêu đề quan trọng thứ nhì (lớn thứ nhì)

Đây là tiêu đề quan trọng thứ ba (lớn thứ ba)

Đây là tiêu đề quan trọng thứ tư (lớn thứ tư)

Đây là tiêu đề quan trọng thứ năm (lớn thứ năm)
Đây là tiêu đề ít quan trọng nhất (nhỏ nhất)

Trình duyệt hỗ trợ

  • Internet Explorer 6
  • Internet Explorer
  • Firefox
  • Opera
  • Google Chrome
  • Safari
<hx> được hỗ trợ trong đa số các trình duyệt.

Thuộc tính

Cách sử dụng: <hx thuoctinh="giatri"></hx>

Thuộc tính tùy chọn

Thuộc tínhGiá trịVí dụMô tả
alignleft
center
right
justify
align="left"Được dùng để sắp xếp vị trí cho văn bản.
Không khuyến khích sử dụng, sử dụng thuộc tính text-align của css để thay thế.
Không được hỗ trợ trong DTD Strict

Thuộc tính tổng quát (xem thêm)

Thuộc tínhGiá trịVí dụMô tả
classTên classclass="section"Tên class
dirrtl
ltr
dir="rtl"Xác định hướng văn bản cho các nội dung trong một thành phần.
idTên idid="layout"Xác định tên id cho thành phần, mỗi thành phần chỉ có một id duy nhất (hoặc một id chỉ có trong một thành phần) trong một văn bản HTML
langMã ngôn ngữlang="vi"Xác định mã ngôn ngữ cho nội dung trong một thành phần.
styleKiểu định dạngstyle="color: red"Xác định một định dạng cho một thành phần.
titleTexttitle="Đây là title"Xác định thêm thông tin cho thành phần.
xml:langMã ngôn ngữlang="vi"Xác định mã ngôn ngữ cho nội dung trong một thành phần, trong văn bản XHTML.

Thuộc tính sự kiện

Không được hỗ trợ trong DTD Strict
Thuộc tínhGiá trịVí dụMô tả
onclickCode scriptonclick="code"Script chạy khi click chuột.
ondblclickCode scriptondblclick="code"Script chạy khi double click chuột.
onmousedownCode scriptonmousedown="code"Script chạy khi button chuột được nhấn.
onmousemoveCode scriptonmousemove="code"Script chạy khi di chuyển con trỏ chuột.
onmouseoutCode scriptonmouseout="code"Script chạy khi di chuyển con trỏ chuột ra khỏi thành phần.
onmouseoverCode scriptonmouseover="code"Script chạy khi di chuyển con trỏ chuột di chuyển trên thành phần.
onmouseupCode scriptonmouseup="code"Script chạy khi button chuột được thả ra.
onkeydownCode scriptonkeydown="code"Script chạy khi nút trên bàn phím được nhấn.
onkeypressCode scriptonkeypress="code"Script chạy khi nút trên bàn phím được nhấn và thả ra.
onkeyupCode scriptonkeyup="code"Script chạy khi nút trên bàn phím được thả ra.
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Rurutomi's Blog - All Rights Reserved
Template Created by Creating Website - Edit by Mua Rẻ Đức Kiên
Proudly powered by Blogger