Laman

▼

Pages

▼

Laman

▼

Jul 30, 2011

Phân tích các thẻ dữ liệu trong bố cục Template

Trong cấu trúc bố cục XML của Blogger Template, có nhiều thẻ khác nhau bạn có thể sử dụng để gộp các mảng dữ liệu riêng biệt trong Template. Tất cả chúng được định dạng là <data:name/> hoặc <data:name1.name2/>, trong đó name là tên của mảng dữ liệu riêng biệt mà bạn muốn sử dụng. Trong ví dụ name1.name2, thì name2 là một hạng mục riêng trong một bộ dữ liệu được gọi là name1, ví dụ trong thẻ <data:post.body/> thì body là phần nói về thân chứa của bài viết.

Dưới đây là danh sách các dữ liệu được chia thành các phần theo thành phần trang, do các kiểu tiện ích khác nhau thì sử dụng các dữ liệu khác nhau:

1. Dữ liệu tổng thể

Thông tin này áp dụng cho toàn bộ trang vì thế bạn có thể sử dụng nó ở bất cứ đâu, không giống như các dữ liệu khác chỉ có thể được dùng trong một tiện ích riêng biệt. Dưới đây là danh sách các thẻ dữ liệu tổng thể:
  • <data:blog.title/>: tiêu đề blog
  • <data:pageType/>: kiểu trang hiện hành, như các kiểu trang 'item', 'archive', 'index'.
  • <data:blog.pageName/>: tên trang
  • <data:blog.pageTitle/>: tiêu đề trang hiện hành
  • data:blog.url: URL của trang hiện hành
  • data:blog.homepageUrl: trang chủ của blog
  • <data:blog.encoding/>: mã hóa để sử dụng cho blog, ví dụ UTF-8
  • data:blog.languageDirection: định dạng ngôn ngữ từ trái sang phải (ltr) hoặc từ phải sang trái (rtl)
  • <data:blog.feedLinks/>: các đường dẫn nguồn cấp tự phát hiện cho tiêu đề trang.

2. Tiện ích Tiêu đề đầu trang

Tiêu đề đầu trang là một tiện ích đơn giản chỉ với hai mảng dữ liệu chính, đó là:
  • <data:title/>: tiêu đề blog
  • <data:description/>: phần mô tả blog

3. Tiện ích Bài đăng Blog

Đây là phần trung tâm của blog và là phần phức tạp nhất. Dưới đây là danh sách các dữ liệu trong tiện ích này:
  • data:feedLinks: Danh sách nguồn cấp cho trang. Trên trang chính, nó chứa nguồn cấp cho cả blog; trên các trang item, nó chứa các nguồn cấp nhận xét. Mỗi hạng mục chứa các phần sau:
    • data:feedLinks.url: URL của nguồn cấp
    • <data:feedLinks.name/>: tên nguồn cấp (ví dụ 'Posts' hoặc 'Comments').
    • <data:feedLinks.feedType/>: kiểu nguồn cấp (Atom hay RSS).
    • <data:feedLinks.mimeType/>: kiểu biểu thị nguồn cấp
  • data:olderPageUrl: nếu có các bài đăng cũ hơn so với trang hiện hành thì đây là URL đến các bài đăng đó (không phải trang nào cũng có đường dẫn này)
  • <data:olderPageTitle/>: tiêu đề đường dẫn đến trang các bài đăng cũ hơn
  • data:newerPageUrl: nếu có các bài đăng mới hơn so với trang hiện hành thì đây là URL dẫn đến các bài đăng đó
  • <data:newerPageTitle/>: tiêu đề đường dẫn đến trang cái bài đăng mới hơn
  • <data:homeMsg/>: dòng text liên kết đến trang chủ (Home)
  • <data:commentLabel/>: thẻ dùng để hiển thị số nhận xét (Comments)
  • <data:authorLabel/>: thẻ dùng để chỉ người viết bài (Posted by)
  • <data:timestampLabel/>: thẻ dùng để chỉ thời gian bài được đăng (posted at)
  • <data:postLabelsLabel/>: thẻ để giới thiệu danh sách các nhãn bài viết (labels for this post)
  • <data:backlinksLabel/>: thẻ để mô tả liên kết ngược đến bài viết (links to this post)
  • data:posts: danh mục tất cả bài viết trong trang. Mỗi bài viết chứa các phần sau đây:
    • <data:post.dateHeader/>: ngày tháng xuất bản bài viết, chỉ có mặt nếu bài đầu tiên trong danh sách được đăng trong ngày hiện hành
    • <data:post.id/>: chuỗi số ID cho bài viết
    • <data:post.title/>: tiêu đề bài viết
    • <data:post.body/>: nội dung bài viết
    • <data:post.author/>: tên hiển thị tác giả bài viết
    • data:post.url: liên kết cố định của bài viết
    • <data:post.timestamp/>: định dạng thời gian bài viết, tồn tại ở mọi bài viết
    • data:post.labels: danh mục các nhãn cho bài viết. Mỗi nhãn chứa các phần sau đây:
      •  <data:label.name/>: dòng text biểu thị tên nhãn
      •  data:label.url: URL của trang liệt kê tất cả các bài viết trong blog thuộc nhãn hiện hành
      •  data:lable.isLast: true hoặc false/ chỉ định nhãn có phải là nhãn cuối cùng trong danh mục (sử dụng các dấu phẩy giữa các nhãn)
    • <data:post.allowComments/>: dùng 'True' nếu bài viết cho phép các nhận xét
    • <data:post.numComments/>: số nhận xét trên bài viết
    • <data:post.showBacklinks/>: có hay không hiển thị liên kết ngược đến bài viết
    • <data:post.numBacklinks/>: số liên kết ngược cho bài viết
    • data:post.addCommentUrl: URL của dòng 'add a comment' cho bài viết
    • data:post.emailPostUrl: URL của dòng 'email this post' cho bài viết
    • data:post.editUrl: URL cho liên kết chỉnh sửa nhanh bài viết
    • <data:post.feedLinks/>: danh mục các nguồn cấp riêng biệt cho bài viết (khác với nguồn cấp chung cho cả blog), có thể chứa cả nguồn cấp cho phần nhận xét của bài viết. Mỗi nguồn cấp chứa các phần sau đây:
      • data:f.url: URL nguồn cấp
      • <data:f.name/>: tên nguồn cấp ('Posts' hay 'Comments')
      • <data:f.feedType/>: kiểu nguồn cấp (Atom hay RSS)
      • <data:f.mimeType/>: kiểu biểu thị nguồn cấp
    • <data:post.comments/>: danh mục tất cả các nhận xét trong bài viết (chỉ trên các trang item). Mỗi nhận xét chứa các phần sau đây:
      • <data:comment.id/>: số ID của nhận xét
      • <data:comment.body/>: phần nội dung nhận xét
      • <data:comment.timestamp/>: thời gian tạo nhận xét
      • <data:comment.author/>: tên hiển thị tác giả nhận xét
      • data:comment.authorUrl: URL đến trang hồ sở của tác giả nhận xét, nếu nhận xét không phải nặc danh
      • data:comment.deleteUrl: URL để xóa nhận xét
      • data:comment.isDeleted: liệu nhận xét đã bị xóa hay chưa

4. Tiện ích Lưu trữ Blog

Tiện ích này gồm một số thẻ dữ liệu chính như sau:
  • <data:title/>: tiêu đề tiện ích
  • data:style: kiểu bố trí liệt kê các bài viết lưu trữ theo dạng 'MENU', 'FLAT', hoặc 'HIERARCHY'.
  • data:data: danh mục của mỗi đơn vị lưu trữ, chứa các phần sau:
    • <data:i.name/>: tên của các khoảng thời gian lưu trữ (ví dụ "August 2010"
    • data:i.url: đường dẫn đến trang chứa các bài viết từ khoảng thời gian lưu trữ
    • <data:i.post-count/>: bao nhiều bài viết có trong khoảng thời gian lưu trữ

5. Tiện ích Hồ sơ

Đối với blog chỉ có một tác giả thì tiện ích Hồ sơ chứa những thông tin sau đây.

  • <data:title/>: tiêu đề tiện ích
  • data:userUrl: URL đến hồ sơ của tác giả
  • data:location: vị trí từ hồ sơ của tác giả
  • data:aboutme: thông tin "About Me" từ hồ sơ
  • <data:displayname/>: tên hiển thị tác giả
  • data:photo: ảnh hồ sơ người dùng, gồm tác phần sau đây
    • data:photo.url: URL đến ảnh
    • data:photo.width: chiều rộng ảnh (đơn vị pixel)
    • data:photo.height: chiều cao ảnh (đơn vị pixel)
    • data:photo.alt: dòng text chỉ thuộc tính "alt" cho ảnh

Đối với các blog nhóm (team blogs), tiện ích hồ sơ chứa ít thông tin hơn về các tác giả, như sau:
  • <data:title/>: tiêu đề tiện ích
  • data:authors: danh sách các tác giả, mỗi tác giả chứa các phần sau đây:
    • data:displayname: tên hiển thị tác giả
    • data:userURL: URL đến trang hồ sơ của tác giả

Nếu bạn muốn thiết kế Template dùng cho cả blog một tác giả và blog nhiều tác giả thì bạn có thể sử dụng biến data:team để phân biệt giữa hai trường hợp. Ví dụ:
<b:if cond='data:team == "true"'> <!-- team blog profile -->
<ul><b:loop values='data:authors' var='i'> <li><a expr:href='data:i.userUrl'><data:i.display-name/></ a></li> </b:loop></ul>
<b:else/> <!-- normal blog profile -->
<b:if cond='data:photo.url != ""'><a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a></b:if>
<dl class='profile-datablock'> <dt class='profile-data'><data:displayname/></dt>
<b:if cond='data:showlocation == "true"'> <dd class='profile-data'><data:location/></dd> </b:if>
<b:if cond='data:aboutme != ""'><dd class='profile- textblock'><data:aboutme/></dd></b:if> </dl>
<a class='profile-link' expr:href='data:userUrl'><data:viewProfileMsg/></a>
</b:if>
6. Tiện ích Text / HTML / JavaScript

Tiện ích Text và tiện ích HTML/JavaScript hoạt động giống nhau và có cùng hai mảng dữ liệu:
  • <data:title/>: tiêu đề tiện ích
  • <data:content/>: nội dung tiện ích

7. Tiện ích Nguồn cấp

Nội dung tiện ích nguồn cấp được load bằng cách sử dụng Google AJAX API sau khi blog được trình diễn trong công cụ trình duyệt. Bạn chỉ có thể định dạng nó bằng cách sử dụng CSS. Tiện ích này gồm 2 mảng dữ liệu sau:

  • <data:title/>: tiêu đề tiện ích
  • data:feedUrl: URL của nguồn cấp

8. Tiện ích Ảnh

Một tiện ích ảnh chứa một ảnh riêng biệt, cung cấp tất cả các dữ liệu liên quan đến ảnh này.
  • <data:title/>: tiêu đề tiện ích
  • data:sourceUrl: URL nguồn ảnh
  • data:width: bề rộng của ảnh (đơn vị pixel)
  • data:height: chiều cao ảnh (đơn vị pixel)
  • data:caption: chú thích ảnh

9. Tiện ích Nhãn

Tiện ích Nhãn gồm danh mục tất cả các nhãn được sử dụng trong blog. Gồm các mảng dữ liệu sau đây:
  • <data:title/>: tiêu đề tiện ích
  • data:labels: danh mục các nhãn, mỗi nhãn chứa các phần sau:
    • <data:label.name/>: text biểu thị tên nhãn
    • <data:label.count/>: số bài viết có trong nhãn
    • data:label.url: đường dẫn đến trang hiển thị tất các các bài viết trong nhãn

10. Tiện ích Danh sách blog

Tiện ích này chứa danh sách các hạng mục chỉ là các URL riêng biệt.

  • <data:title/>: tiêu đề tiện ích
  • data:items: danh sách các hạng mục, gồm các phần sau đây:
    • data:displayStyle: định dạng hiển thị là display:block
    • <data:timePeriodSinceLastUpdate/>: khoảng cách thời gian kể từ lúc cập nhật bài viết mới
    • <data:blogTitle/>: tiêu đề blog
    • data:blogUrl: URL đến blog
    • data:blogIconUrl: URL đến favicon của blog
    • <data:itemTitle/>: tiêu đề bài viết
    • <data:itemSnippet/>: đoạn trích dẫn bài viết
    • data:itemUrl: URL đến bài viết
    • data:itemThumbnail: ảnh đại diện bài viết
    • data:itemThumbnail.height: chiều cao ảnh đại diện
    • data:itemThumbnail.width: chiều rộng ảnh đại diện
    • data:itemThumbnail.url: URL của ảnh đại diện

11. Tiện ích Danh sách liên kết

Tiện ích này gồm danh sách các liên kết, mỗi liên kết có hai phần: text và link.

  • <data:title/>: tiêu đề tiện ích
  • data:links: danh mục các liên kết, mỗi liên kết chứa các phần sau:
    • <data:link.name/>: dòng text biểu thị liên kết
    • data:link.target: URL của liên kết

12. Tiện ích Logo

Tiện ích này đơn giản nhất, chỉ có một mảng dữ liệu:
  • data:fullButton: URL của nút Blogger mà bạn chọn.

Toàn bộ cấu trúc XML của nút Blogger như thế này:
<b:widget id='BloggerButton1' locked='false' title='' type='BloggerButton'>
<b:includable id='main'>
<div class='widget-content'>
<a href='http://www.blogger.com'><img alt='Powered By Blogger' expr:src='data:fullButton'/></a>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Hy vọng với phân tích chi tiết về các thẻ dữ liệu trong bố cục Template, bạn sẽ hiểu sâu hơn về cấu trúc XML của Blogger Template, hỗ trợ thêm cho bạn kiến thức về thiết kế Template.
vào lúc

1 comment:

Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D