Tạo thanh menu sổ dọc sử dụng Scriptaculous

Người đăng: yeu mai em on Thứ Ba, 30 tháng 11, 2010

Thư viện Scriptaculous có thể được sử dụng để tạo hiệu ứng động trong việc tạo thanh menu sổ dọc. Ở đây xin giới thiệu kiểu menu sổ dọc do Sven Wappler phát triển có sử dụng Prototype + Scriptaculous.

Xem Demo 1.

Nếu bạn muốn tạo một thanh menu đẹp như vậy thì có thể thực hiện theo các bước sau đây.

1. Đặt toàn bộ đoạn code dưới đây vào trước thẻ </head>

<script src="http://www.wappler.eu/scriptaculous/prototype.js" type="text/javascript"></script>
<script src="http://www.wappler.eu/scriptaculous/scriptaculous.js" type="text/javascript"></script>
<script src="http://www.wappler.eu/scriptaculous/swdropdownmenu/menu.js" type="text/javascript"></script>

<style type="text/css">
#menu{ background:#678;border-bottom:1px solid #ABC;border-top:1px solid #ABC;padding-left:10px;height:32px;width:100%}
#menu ul{ display:block;line-height:1em;list-style:none;margin:0 !important;padding:0 !important;z-index:90}
#menu ul li{ float:left;font-size:12px;line-height:1,5em;list-style-type:none;margin:0;padding:0}
#menu ul li a{ background:transparent;color:GreenYellow;display:block;font-weight:bold;line-height:32px;text-decoration:none;margin:0;padding:0 1em;width:auto}
#menu ul li a:hover{ color:#FFF;text-decoration:none}
#menu ul.level2,#menu ul.level3{ background:#678;border-top:1px solid #ABC;left:0;position:absolute;top:0;visibility:hidden}
#menu ul.level2 li,#menu ul.level3 li{ border-bottom:1px solid #ABC;float:none;margin:0;padding:0;width:150px}
#menu ul.level2 li a,#menu ul.level3 li a{ padding:0 1em}
#menu ul.level2 li a:hover,#menu ul.level3 li a:hover{ background-color:#456}
</style>

2. Thiết lập cấu trúc HTML như sau và đặt vào phần thân trang web (giữa 2 thẻ <body>, </body>.

<div id="menu">
<ul class="level1" id="root">
<li>
<a href="#">Menu 1 (+)</a>
<ul class="level2">
<li><a href="#">Submenu 1.1.</a></li>
<li><a href="#">Submenu 1.2. (+)</a>
<ul class="level3">
<li><a href="#">Submenu 1.2.1.</a></li>
<li><a href="#">Submenu 1.2.2.</a></li>
<li><a href="#">Submenu 1.2.3.</a></li>
</ul>
</li>
<li><a href="#">Submenu 1.3.</a></li>
<li>
<a href="#">Submenu 1.4. (+)</a>
<ul class="level3">
<li><a href="#">Submenu 1.4.1.</a></li>
<li><a href="#">Submenu 1.4.2.</a></li>
<li><a href="#">Submenu 1.4.3.</a></li>
<li><a href="#">Submenu 1.4.4.</a></li>
</ul>
</li>
</ul>
</li>
<li class="sep">|</li>
<li><a href="#">Menu 2</a></li>
<li class="sep">|</li>
<li><a href="#">Menu 3</a></li>
<li class="sep">|</li>
<li>
<a href="#">Menu 4 (+)</a>
<ul class="level2">
<li><a href="#">Submenu 4.1.</a></li>
<li>
<a href="#">Submenu 4.2. (+)</a>
<ul class="level3">
<li><a href="#">Submenu 4.2.1.</a></li>
<li><a href="#">Submenu 4.2.2.</a></li>
<li><a href="#">Submenu 4.2.3.</a></li>
</ul>
</li>
<li><a href="#">Submenu 4.3.</a></li>
</ul>
</li>
<li class="sep">|</li>
<li><a href="#">Menu 5</a></li>
</ul>
</div>

Việc bạn cần làm là đặt tên các Menu và Submenu đồng thời đặt đường link tương ứng vào đoạn code ở trên.
More about

☆ CÁC PHƯƠNG PHÁP GỠ BỎ CHƯƠNG TRÌNH DIỆT VIRUS

Người đăng: yeu mai em on Thứ Hai, 29 tháng 11, 2010

Thông thường để gỡ bỏ chương trình (phần mềm) diệt virus ra khỏi máy tính, bạn thực hiện gỡ bỏ (Uninstall; remove) như bao phần mềm khác. Tuy nhiên, đôi lúc một số trường hợp, phần mềm diệt virus trong máy tính của bạn trở nên "cứng đầu", bạn cần phải có những công cụ gỡ bỏ chuyên dụng. Sau đây là những phương pháp để giúp bạn dễ dàng gỡ bỏ chương trình virus ra khỏi máy.
* Theo cách thông thường:
Nếu đang sử dụng Windows XP hoặc cũ hơn, bạn mở Control Panel (bấm nút Start > Settings > Control Panel), bấm đúp chuột lên biểu tượng Add or Remove. Trong cửa sổ hiện ra sau đó, bấm chọn tên phần mềm diệt virus cần gỡ bỏ, bấm nút Remove; sau đó có thể bấm thêm các nút OK, Next, Finish (nếu có).
Nếu đang sử dụng Windows 7, bạn vào Start > Control Panel > Programs > Programs and Features (hoặc mở cửa sổ Control Panel từ cửa sổ My Computer rồi bấm chuột vào biểu tượng Programs and Features). Sau đó, bấm chọn tên phần mềm cần gỡ bỏ, bấm nút Uninstall.
* Dùng phần mềm gỡ bỏ chuyên dụng:
Nếu việc gỡ bỏ phần mềm theo cách thông thường không thành công. bạn thử dùng phần mềm miễn phí gỡ bỏ chuyên dụng như: IObit Uninstaller (bạn xem cách sử dụng và tải IObit Uninstaller TẠI ĐÂY). Trong một số trường hợp, nếu bạn cũng không thể gỡ bỏ được bằng phần mềm chuyên dụng thì bạn thử khởi động máy tính vào chế độ Safe Mode bằng cách bấm F8 ngay khi thấy màn hình khởi động của Windows lúc mở máy tính, rồi chạy chương trình và thử gỡ bỏ lần nữa.
* "Lấy độc trị độc":
Sau 2 cách thức trên, nếu vẫn không gỡ bỏ được phần mềm diệt virus, bạn hãy thử cài lại phần mềm diệt viurs đó với phiên bản đang dùng hoặc mới hơn. Trong quá trình cài đặt thường dừng lại ở cửa sổ có lựa chọn Remove để bạn gỡ bỏ phiên bản đang có trong máy tính. Nếu vẫn không được, bạn hãy chọn chế độ cài đè (update) hoặc cài sửa lỗi (repair), sau khi cài xong, bạn khởi động lại máy tính và việc gỡ bỏ nó có thể được thực hiện một cách dễ dàng... Nếu không thực hiện được trong Windows ở chế độ thông thường, bạn hãy khởi động máy tính vào chế độ Safe Mode để thực hiện.
* Dùng phần mềm gỡ bỏ chuyên dụng của nhà sản xuất phần mềm diệt virus:
Với những cách trên, mà bạn vẫn chưa gỡ bỏ được phần mềm diệt virus "cứng đầu", có lẽ bạn nên dùng phần mềm chuyên dụng của nhà sản xuất phần mềm đó.
- Nếu đang sử dụng bất kỳ phần mềm diệt virus nào của hãng Symantec (miễn là có chữ Norton trong tên gọi), bạn hãy dùng công cụ Norton Removal Tool 2010 tải TẠI ĐÂY.
- Đối với phiên bản của phần mềm Kaspersky, bạn dùng công cụ Kaspersky Virus Removal Tool 2010 tải TẠI ĐÂY.
- Đối với phần mềm BitDefender, bạn hãy sử dụng công cụ BitDefender Uninstall Tool tải TẠI ĐÂY.
- Đối với phần mềm McAfee, bạn sử dụng công cụ McAfee Consumer Product Removal Tool tải TẠI ĐÂY.
- Đối với phần mềm Avast, bạn sử dụng công cụ aswClear tải TẠI ĐÂY.
- Đối với AVG, bạn sử dụng công cụ gỡ bỏ chuyên dụng do AVG phát hành là AVG 2011 Removal Tool 32bit tải TẠI ĐÂY hoặc VÀO ĐÂY để chọn và download đúng phiên bản AVG đang cài trong máy tính để gỡ bỏ...
- Đối với Panda Internet security 2007 > 2010, bạn sử dụng công cụ gỡ bỏ Uninstaller 10 tải TẠI ĐÂY.
Ngoài các phần mềm diệt virus "cứng đầu" kể trên thì các phần mềm diệt virus khác có thể gỡ bỏ bằng cách thông thường...
Lưu ý: Muốn gỡ bỏ chương trình thì bạn phải thoát hoàn toàn chương trình đó khỏi hệ thống (thường thì chương trình diệt virus các bạn hay cho nó khởi động cùng Windows, hiển thị ở trên khay hệ thống, do đó bạn phải exit nó trước rồi mở gỡ bỏ được)
(Sưu tầm từ báo LBVMVT)
More about

Tạo sidebar menu trượt độc đáo sử dụng Scriptaculous

Người đăng: yeu mai em

Scriptaculous là một thư viện JavaScript được xây dựng trên Prototype JavaScript Framework, cung cấp các hiệu ứng động trực quan và các thành phần giao diện người dùng thông qua Document Object Model (DOM).

Scriptaculous có thể được sử dụng để tạo hiệu ứng trượt độc đáo cho thanh menu. Hôm nay xin giới thiệu cách thực hiện kiểu menu trượt của tác giả Andrew Sellick. Tôi đã có điều chỉnh đôi chút so với bản gốc của tác giả. :47)

Xem Demo.

Bạn có thể tạo một kiểu menu như vậy cho website/webblog của mình theo các bước sau đây.

1. Đặt toàn bộ phần code dưới đây vào trước thẻ </head>.

<script type='text/javascript' src="http://www.google.com/jsapi"></script>
<script>
google.load("prototype", "1.6.0.3");
google.load("scriptaculous", "1.8.2");
</script>
<script type="text/javascript" src="http://hacodeproject.googlecode.com/files/side-bar.js"></script>
<style type='text/css'>
#menuBar a{outline:none}
#menuBar a:active{outline:none}
#menuBar{text-align:left}
#menuBar h2{color:#FFF;font-size:110%;font-family:arial;margin:10px;font-weight:bold !important}
#menuBar h2 span{font-size:125%;font-weight:normal !important}
#menuBar ul{margin:0;padding:0}
#menuBar li{margin:0 10px 3px;padding:2px;list-style-type:none;display:block;background-color:#DA1074;width:147px;color:#FFF}
#menuBar li a{width:100%}
#menuBar li a:link,#menuBar li a:visited{color:#FFF;font-family:verdana;font-size:100%;text-decoration:none;display:block;margin:0;padding:0;width:100%}
#menuBar li a:hover{color:#FFF;text-decoration:none;background-color:#000}
#menuBar{position:fixed;width:auto;height:auto;top:170px;right:-5px;background-image:url(http://bit.ly/gLVyXX);background-position:top left;background-repeat:repeat-y}
#menuBarTab{float:left;height:137px;width:28px}
#menuBarTab img{border:0 solid #FFF}
#menuBarContents{float:left;overflow:hidden !important;width:175px;height:170px}
#menuBarContentsInner{width:200px}
</style>

Bạn có thể tùy ý điều chỉnh thuộc tính CSS.

2. Thiết lập cấu trúc HTML như sau và đặt vào phần thân trang web (giữa 2 thẻ <body>, </body>.

<div id="menuBar">
<a href="#" id="menuBarTab"><img src="http://bit.ly/eA8PG7" alt="menuBar" title="menuBar" /></a>
<div id="menuBarContents" style="display:none;">
<div id="menuBarContentsInner">
<h2>Menu<span>bar</span></h2>
<ul>
<li><a href='http://huynh-nhat-ha.blogspot.com/' title='Home'>Home</a></li>
<li><a href='http:// huynh-nhat-ha.blogspot.com/feeds/posts/default' title='Suscribe Post Feed'>RSS</a></li>
<li><a href='http://huynh-nhat-ha.blogspot.com/feeds/comments/default' title='Suscribe Comment Feed'>Comment RSS</a></li>
<li><a href='http://huynh-nhat-ha.blogspot.com/p/contact.html' title='Contact'>Contact</a></li>
</ul>
</div>
</div>
</div>
Lúc này bạn chỉ việc thay đổi các tên menu và liên kết tương ứng trong cấu trúc HTML ở trên là bạn sẽ có một kiểu menu trượt độc đáo rồi đấy. Kiểu menu này có thể được cài đặt dễ dàng cho Blogger.
More about

Hệ thống nhận xét Disqus trên các trang tĩnh (static page)

Người đăng: yeu mai em

Về mặc định sau khi cài đặt Hệ thống nhận xét Disqus cho Blogger thì hệ thống này chỉ xuất hiện trên các trang bài viết (item) và không xuất hiện trên các trang tĩnh (static page). Và khi đó thì các trang tĩnh vẫn giữ nguyên hệ thống nhận xét mặc định của Blogger. Như vậy blog của bạn sẽ tồn tại 2 hệ thống nhận xét, làm cho blog thiếu đi sự đồng nhất.

Lúc này bạn sẽ nghĩ ngay đến việc làm cách nào để hiển thị Hệ thống nhận xét Disqus trên các trang tĩnh. Muốn làm được điều này bạn chỉ cần thực hiện theo hướng dẫn sau đây.

Đăng nhập Blogger vào chỉnh sửa Template, chọn Expand Widget Templates. Tìm đến những dòng mã có dạng tương tự như sau:

<b:includable id='main'>
<script type='text/javascript'>
var disqus_shortname = &#39;huynh-nhat-ha&#39;;
var disqus_blogger_current_url = &#39;<data:blog.url/>&#39;;
</script>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#comments {display:none;}
</style>
<script type='text/javascript'>
(function() {
var bloggerjs = document.createElement(&#39;script&#39;);
bloggerjs.type = &#39;text/javascript&#39;;
bloggerjs.async = true;
bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_item.js&#39;;
(document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
})();
</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.post-comment-link { visibility: hidden; }
</style>
</b:if>
<script type='text/javascript'>
(function() {
var bloggerjs = document.createElement(&#39;script&#39;);
bloggerjs.type = &#39;text/javascript&#39;;
bloggerjs.async = true;
bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_index.js&#39;;
(document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
})();
</script>
</b:includable>

Bạn chỉ việc xóa những dòng mã được đánh dấu màu đỏ rồi lưu Template là OK. Hy vọng bạn sẽ giải tỏa phiền muộn nếu gặp tình huống này :27).
More about

Tùy biến CSS cho Hệ thống nhận xét Disqus

Người đăng: yeu mai em on Chủ Nhật, 28 tháng 11, 2010

Tôi đã sử dụng Hệ thống nhận xét Disqus cho blog của mình đã được một tuần lễ và tôi cảm thấy rất hài lòng :6). Có một điều tôi mới phát hiện là chúng ta có thể điều chỉnh phần Comment trên Hệ thống nhận xét Disqus như chúng ta từng có thể làm điều đó dễ dàng trên hệ thống nhận xét mặc định của Blogger.

Bạn có thể điều chỉnh màu nền, font chữ… cho phần nhận xét một cách dễ dàng bằng những thuộc tính CSS đơn giản. Nếu background Template của bạn có màu sáng thì có thể không cần phải chỉnh Disqus Comment làm gì, tuy nhiên nếu background Template của bạn có màu tối thì cũng nên điều chỉnh background cho Disqus Comment.

Để làm được điều này, trước tiên bạn cần đăng nhập tài khoản Disqus trên trang Disqus.com, sau đó vào Admin >> Settings >> Appearance kéo xuống dưới cùng ở phần Custom CSS rồi dán đoạn mã dưới đây vào phần khung chỉnh sửa CSS. Sau đó nhấn Save Changes để lưu.

/* Everything Disqus on your page is contained within this. */
#disqus_thread {
background-color: #000000;
color: #ffffff;
border-style: solid;
border-color: #cccccc;
padding: 5px;
}

Nếu bạn rành về CSS thì bạn có thể tha hồ khám phá và thêm những thuộc tính theo ý thích của bạn vào đoạn mã CSS dưới đây.

/*The header at the top of posts.*/
.dsq-comment-header {
background-color: #ffffff;
font-family:"verdana",sans-serif;
font-size: 12px;
height: 50px;
}

/*The comments.*/
.dsq-comment-message {
font-family:"verdana",sans-serif;
font-size: 11px;
color: #cccccc;
}

/*The box where a post is typed into.*/
textarea {
background-image: none;
background-repeat: repeat;
border: #00A8D6 2px solid; /* light blue border */
}

texarea:after {
}

/*"Add New Comment" and "# Comments" are enclosed in h3 tags.*/
h3 {}

/*The entire comment thread list.*/
#dsq-comments {}

/*A single comment in the thread.*/
.dsq-comment {
border: #00A8D6 2px solid; /* light blue border */
margin-botom: 15px;
}

/*The avatar image for the registered.*/
.dsq-header-avatar img {}

/*The message body of a single comment post.*/
#dsq-content #dsq-comments .dsq-comment-body { }

/*The footer contains the link to "reply."*/
.dsq-comment-footer {}

/* The form elements (Name, Email, Website). */
input.form-text {
font-size: 100%;
}

/* The submit button "Post". */
input.submit {
background-color: #ffffff;
}

/* The main wrapper for the comment system. */
#dsq-content {
}

/* The toggle button for the thread options. */
#dsq-options-toggle {
/* display: none; */
}

/* The links within the thread Options */
#dsq-extra-links {
/* display: none; */
}

/* The comment rating arrows for posts. */
.dsq-comment-rate {
}

/* This is the meta information about the post (time stamp and points). */
.dsq-header-meta {
}

/* The message body of a single comment post.
.dsq-comment-body {
}

/* This contains and determines the style for the pagination links. */
#dsq-pagination {
}
More about

☆ FreeFlashFLV MP3 Converter 3.0 - TRÍCH ÂM THANH FLV THÀNH MP3

Người đăng: yeu mai em

FreeFlash FLV Mp3 Converter 3.0 (FMC) là phần mềm dùng để trích xuất âm thanh của các file FLV thành mp3. FMC có giao diện đơn giản, dễ dùng, tốc độ chuyển đổi khá nhanh, xuất ra file Mp3 với chất lượng cao.
Bạn có thể tải FMC TẠI ĐÂY, dung lượng nhỏ gọn 4.26MB tương thích với hầu hết các hệ điều hành Windows và hoàn toàn miễn phí.
Khi tải về, bạn kích hoạt để cài đặt chương trình, chọn nút No nếu bắt gặp hộp thoại Confirm rồi đóng lại cửa sổ trình duyệt Web vừa được mở ra. Giao diện FMC sẽ hiện ra. Muốn chuyển đổi tập tin FLV nào thì bạn bấm nút Add files nằm ở góc bên trái của giao diện để mở hộp thoại Open. Từ hộp thoại thả xuống Look in, bạn hãy tìm đến thư mục có chứa tập tin FLV mà bạn muốn trích âm rồi bấm Open, ngay lập tức trên giao diện bạn sẽ thấy tên tập tin đó.
Trong vùng làm việc Mp3 Settings, bạn bỏ dấu chọn Default settings để có thể chọn chanels là Mono (đơn âm) hoặc Stereo (âm thanh nổi) còn không thì bạn cứ để mặc định, trên mục Bitrate bạn có thể chọn tốc độ phát như mong muốn (tốc độ bit càng lớn thì chất lượng âm thanh càng cao nhưng tập tin sẽ có dung lượng lớn).
Trong vùng General, bạn có thể chọn thư mục để lưu tập tin sau khi được chuyển đổi.
Sau khi chọn lựa xong, bạn bấm nút Start Converting để bắt đầu chuyển đổi, trong quá trình chuyển đổi bạn cũng có thể hủy bỏ công việc bằng cách bấm nút Stop. Khi kết thúc quá trình chuyển đổi, hộp thoại Conversion Completed sẽ xuất hiện, hãy bấm chuột lên nút Yes nếu như bạn muốn mở nhanh thư mục chứa tập tin Mp3 vừa chuyển đổi xong.

More about

Giới thiệu một kiểu phân trang đẹp cho Blogger

Người đăng: yeu mai em

Có nhiều kiểu phân trang đẹp :7) cho Blogger. Hôm nay xin giới thiệu một kiểu phân trang về cơ bản cũng khá giống với nhiều kiểu khác song hơi khác một chút về cách cài đặt.

Trước khi cài đặt, bạn nên xem trang Demo.

Bước 1. Đăng nhập Blogger, vào chỉnh sửa Template. Đặt đoạn code css dưới đây vào trước dòng ]]></b:skin>.

.showpageArea a {
text-decoration:underline;
background: #ffffff;
padding: 10px 10px 10px 10px;
font-size:11px;
font-weight:bold;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #9aafe5;
margin:0 1px;
padding:3px 4px;
}
.showpageNum a:hover {
border: 1px solid #9aafe5;
background-color:#33CCFF;
color:#fff;
}
.showpagePoint {
color:#fff;
text-decoration:none;
border: 1px solid #2e6ab1;
background: #2e6ab1;
margin:0 1px;
padding:3px 4px;
font-size:11px;
font-weight:bold;
}
.showpageOf {
text-decoration:none;
padding:3px 4px;
margin: 0 1px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #9aafe5;
padding:3px 4px;
}
.showpage a:hover {
text-decoration:none;
color: #33CCFF;
}

Bước 2. Đặt đoạn code dưới đây vào trước thẻ </body>.

<script type='text/javascript'>
var pageCount=10;
var displayPageNum=4;
var upPageWord ='&#171; Prev';
var downPageWord ='Next &#187;';
</script>
<script type='text/javascript'>
//<![CDATA[
function showpageCount(json){var thisUrl=home_page_url;var htmlMap=new Array();var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='';var downPageHtml='';for(var i=0,post;post=json.feed.entry[i];i++){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(title!=''){if(itemCount==0||(itemCount%pageCount==(pageCount-1))){if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}if(title!='')postNum++;htmlMap[htmlMap.length]='/search?updated-max='+timestamp+'&max-results='+pageCount}}itemCount++}for(var p=0;p<htmlMap.length;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml='<span class="showpage"><a href="/">'+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html+='<span class="showpageNum"><a href="/">1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){html=''+upPageHtml+' '+html+' '}html='<div class="showpageArea" style="padding:10px 10px 10px 10px;"><span style="COLOR: #2e6ab1;" class="showpageOf"> Total: ('+(postNum-1)+')</span>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}function showpageCount2(json){var thisUrl=home_page_url;var htmlMap=new Array();var isLablePage=thisUrl.indexOf("/search/label/")!=-1;var thisLable=isLablePage?thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length):"";thisLable=thisLable.indexOf("?")!=-1?thisLable.substr(0,thisLable.indexOf("?")):thisLable;var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='';var downPageHtml='';var labelHtml='<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';var thisUrl=home_page_url;for(var i=0,post;post=json.feed.entry[i];i++){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(title!=''){if(itemCount==0||(itemCount%pageCount==(pageCount-1))){if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}if(title!='')postNum++;htmlMap[htmlMap.length]='/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount}}itemCount++}for(var p=0;p<htmlMap.length;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml=labelHtml+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html=labelHtml+'1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){if(!isLablePage){html=''+upPageHtml+' '+html+' '}else{html=''+upPageHtml+' '+html+' '}}html='<div class="showpageArea"><span style="COLOR: #000;" class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}var home_page_url=location.href;var thisUrl=home_page_url;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){var lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{var lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}}var home_page="/";if(thisUrl.indexOf("?q=")==-1){if(thisUrl.indexOf("/search/label/")==-1){document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')}}
//]]>
</script>

Tiếp theo bạn cần định cấu hình bài đăng trên trang chính là 10 bài đăng. Vào Phần tử trang (Page Elements) >> Chỉnh sửa Bài đăng trên Blog (Edit Blog Posts) chọn Số bài đăng trên trang chính là 10.

Tất nhiên bạn có thể thay đổi những con số theo ý thích của bạn. Ví dụ nếu bạn đặt số bài đăng trên trang chính là 7 thì dòng var pageCount=5; phải được đổi thành var pageCount=7;.
More about