Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down  Thông điệp [Trang 1 trong tổng số 1 trang]


Cấp bậc !
•Bang Chủ•
avatar
•Bang Chủ•

[KiNg]_[PiN]-BB

Trước đây, mình đã từng hướng dẫn bạn cài đặt Next Post và Previous Post cho blogspot, theo đó giúp bạn thay đổi các liên kết Newer Posts, Older Posts
ở các trang item thành các tiêu đề bài viết như phong cách ở các trang
Wordpress. Thủ thuật này có sử dụng thư viện jQuery. Hôm nay mình sẽ
giúp bạn thực hiện một thủ thuật có chức năng tương tự song chỉ sử dụng
đến Javascript.

Xem DEMO.



Để cài đặt tính năng này bạn hãy thực hiện theo các bước sau đây.

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn
Expand Widget Templates. Dùng từ khóa blog-pager tìm đến đoạn code liên
quan đến thuật phân trang như bên dưới:

Code:
<blockquote><b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl'
expr:id='data:widget.instanceId +
"_blog-pager-newer-link"'
expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl'
expr:id='data:widget.instanceId +
"_blog-pager-older-link"'
expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class='clear'/>
</b:includable></blockquote>
Thay đoạn code ở trên bằng đoạn code bên dưới:

Code:
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[
// Next Post and Previous Post Script by www.thuthuatblogger.info
function search(json,urlsearch) {

max_post=500;

txt_next='Next Post';
txt_previous='Previous Post';
var prev_posturl='';
var prev_posttitle='';
var next_posturl='';
var next_posttitle='';
post_found=0;
var i=0;
var j=0;

for (i = 0; i < max_post; i++) {
var post = json.feed.entry[i];
var posttitle = post.title.$t;
var posturl;

if (i == json.feed.entry.length) break;
for (var k = 0; k < post.link.length; k++) {
if (post.link[k].rel == 'alternate') {
posturl = post.link[k].href;
break;
}
}

if (posturl == urlsearch) {
j=i;
i=max_post;
post_found=1;
}
else{
next_posturl=posturl;
next_posttitle=posttitle;
}
}

if (post_found == 1) {
j=j+1;
post = json.feed.entry[j];
prev_posttitle = post.title.$t;
for (var k = 0; k < post.link.length; k++) {
if (post.link[k].rel == 'alternate') {
prev_posturl = post.link[k].href;
break;
}
}
}

if (next_posturl != '') {
entry_next_post = '<br /><span id="blog-pager-newer-link">' +
 txt_next + ': <a href="' + next_posturl + '" title="' +
next_posttitle + '" class="blog-pager-newer-link">' + next_posttitle +
 '</a></span>';

document.write(entry_next_post)
}

if (prev_posturl != '') {
entry_prev_post = '<br /><span id="blog-pager-older-link">' +
 txt_previous + ': <a href="' + prev_posturl + '" title="' +
prev_posttitle + '" class="blog-pager-older-link">' + prev_posttitle +
 '</a></span><br />';

document.write(entry_prev_post)
}

}

function searchpost(json) {
url=document.URL;
search(json,url);
}
//]]>
</script>
<script src='/feeds/posts/default?alt=json-in-script&callback=searchpost'>
</script>
<b:else/>

<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl'
expr:id='data:widget.instanceId +
"_blog-pager-newer-link"'
expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl'
expr:id='data:widget.instanceId +
"_blog-pager-older-link"'
expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>


<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>
Bước 2. Dùng từ khóa blog-pager tìm đến code CSS liên quan đến phân trang, cắt hết chúng rồi đặt đoạn code như sau vào sau dòng ]]>.

Code:
<b:if cond='data:blog.pageType == "item"'>
<style>
#blog-pager {margin:0px;padding:10px 0 20px;float: left}
#blog-pager-newer-link, #blog-pager-older-link {float:left;text-align:left}
</style>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<style>
#blog-pager {display:none}
</style>
<b:else/>
<style>
[color=red]Đặt code CSS vừa bị cắt vào đây nha[/color]
</style>
</b:if></b:if>
Lưu Template là xong.

Hãy xây dựng diễn đàn cùng [KiNg]_[PiN]-BB bạn nhé !!!


Admin không phải cái gì cũng biết
Admin chỉ mở ra một cộng đồng để những người hiểu biết và mới biết, trao đổi học tập !
Mong Các bạn đừng đánh giá hay nói bất cứ một lời lẽ nào khích tướng OK...

Không Hay Đừng Nói Lời Cay Đắng

[*]Diễn đàn đẹp nhất với trình duyệt web Mozilla Firefox
[*]Còn với mấy loại còn lại chắc là thuộc dang diễn đàn tồi nhất !!!
Xem lý lịch thành viên http://a1k44.thptbatbat.com
Loading

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

Permissions in this forum:
Bạn không có quyền trả lời bài viết

 
  • Free forum | © PunBB | Free forum support | Liên hệ | Report an abuse | Create a blog
© 2012 A1K44BB
FM PunBB - Edit by HOàng Hải