Cộng đồng Blogger - Blogspot Việt Nam
Rất vui khi bạn ghé thăm Diễn đàn Cộng đồng Blogger Việt Nam
Chúc bạn vui vẻ và tìm được thông tin mong muốn!
Hãy đăng ký thành viên để góp sức xây dựng Cộng đồng Blogger Việt Nam đoàn kết, cùng phát triển nhá!

Join the forum, it's quick and easy

Cộng đồng Blogger - Blogspot Việt Nam
Rất vui khi bạn ghé thăm Diễn đàn Cộng đồng Blogger Việt Nam
Chúc bạn vui vẻ và tìm được thông tin mong muốn!
Hãy đăng ký thành viên để góp sức xây dựng Cộng đồng Blogger Việt Nam đoàn kết, cùng phát triển nhá!
Cộng đồng Blogger - Blogspot Việt Nam
Bạn có muốn phản ứng với tin nhắn này? Vui lòng đăng ký diễn đàn trong một vài cú nhấp chuột hoặc đăng nhập để tiếp tục.
Top posters
99 Số bài - 29%
72 Số bài - 21%
55 Số bài - 16%
31 Số bài - 9%
29 Số bài - 9%
15 Số bài - 4%
14 Số bài - 4%
10 Số bài - 3%
9 Số bài - 3%
6 Số bài - 2%
Latest topics
Poll
Statistics
Diễn Đàn hiện có 636 thành viênChúng ta cùng chào mừng thành viên mới đăng ký: Nhã VyTổng số bài viết đã gửi vào diễn đàn là 503in 165 subjects

Go down
Admin
Admin
Admin
Tổng số bài gửi : 99
Được cảm ơn : 8
Ngày gia nhập : 02/05/2011
Tuổi : 33
Đến từ : Cộng đồng Blogger Việt Nam
http://forum.bloggervn.tk

Tạo đường dẫn breadcrumb cho Blogger/Blogspot Empty Tạo đường dẫn breadcrumb cho Blogger/Blogspot

8/6/2011, 10:02 am
Tạo đường dẫn breadcrumb cho Blogger/Blogspot Tips-for-blogger
Thanh điều hướng breadcrumbs xuất hiện nằm ngang trên đầu trang web, thường nằm dưới hoặc trên tiêu đề bài viết. Chúng cung cấp đường dẫn trở lại trang trước, đến một chủ đề nào đó hoặc trở về trang chủ. Nhìn chung người thiết kế thường sử dụng các dấu phân cách như > hoặc ».

Thanh điều hướng breadcrumbs điển hình trông như thế này:

Trang Chủ » Thủ thuật Blogger » Tạo đường dẫn breadcrumb cho Blogger/Blogspot

Tạo đường dẫn breadcrumb cho Blogger/Blogspot Duong+dan+breadcrumb+cho+blogger

Bước 1:

- Lưu Template hiện tại của bạn.
- Đăng nhập >> Thiết kế (Design) >> Chỉnh sửa HTML( Edit HTML) >> Đánh dấu chọn Mở rộng Mẫu tiện ích(Expand Widget Template).

Bước 2: Thêm CSS:
Tìm ]]></b:skin> (Ctrl + F >> ]]></b) và thêm ngay trước nó đoạn mã:

Code:
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}

Bước 3:

- Tìm đoạn mã (Ctrl + F để tìm ):
Code:
<b:include data='top' name='status-message'/>
Thêm ngay dưới nó đoạn mã :
Code:
<b:include data='posts' name='breadcrumb'/>
- Tìm tiếp :
Code:
<b:includable id='main' var='top'>

Và thêm trước nó đoạn mã:

Code:
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- khong hien thi breadcrumb o trang chu -->
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb cho bai dang -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Trang Chủ</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb cho nhan, trang tim kiem, luu tru blog.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Trang Chủ</a> »
<data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<a expr:href='data:blog.homepageUrl'>Trang Chủ</a> »
<b:else/>
<a expr:href='data:blog.homepageUrl'>Trang Chủ</a> »
<data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

Bấm chọn LƯU TEMPLATE, xem thành quả bằng cách bấm vào bài viết bất kì thôi ^^!
Lưu ý nếu bạn sử dụng nhiều nhãn (label) cho một bài viết thì breadcrumbs chỉ hiển thị nhãn cuối cùng mà bạn đã thêm vào

Nguồn : http://www.buitruonganh.tk/2011/06/tao-duong-dan-breadcrumb-cho.html
Admin
Admin
Admin
Tổng số bài gửi : 99
Được cảm ơn : 8
Ngày gia nhập : 02/05/2011
Tuổi : 33
Đến từ : Cộng đồng Blogger Việt Nam
http://forum.bloggervn.tk

Tạo đường dẫn breadcrumb cho Blogger/Blogspot Empty Re: Tạo đường dẫn breadcrumb cho Blogger/Blogspot

13/6/2011, 1:26 am
Mới được bạn Lê Nam góp ý, mình đã fix lại lỗi, rất cảm ơn bạn.
Bay lên nào!Very Happy
Về Đầu Trang
Permissions in this forum:
Bạn không có quyền trả lời bài viết