1. Tra cứu thẻ điều kiện của Blogger
1. Trang IndexTrang Index là tổng hợp gồm các trang như trang chủ, trang hiển thị nhãn, và trang archive.
<b:if cond='data:blog.pageType == "index"'>2. Trang bài viết
<b:if cond='data:blog.pageType == "item"'>3. Trang tĩnh hay còn gọi là Trang trống
<b:if cond='data:blog.pageType == "static_page"'>4. Trang Archive
<b:if cond='data:blog.pageType == "archive"'>5. Trang chủ
<b:if cond='data:blog.url == data:blog.homepageUrl'>6. Trang có URL bất kì
<b:if cond='data:blog.url == "ĐẶT_URL_VÀO_ĐÂY"'>7. Trang bài viết và trang tĩnh
<b:if cond='data:blog.url == data:post.url'>8. Trang xem nhãn
<b:if cond='data:blog.searchLabel'>9. Bài viết đầu tiên
<b:if cond='data:post.isFirstPost'>
Sử dụng câu điều kiện
Nội dung cần sử dụng sẽ được đặt vào giữa 2 thẻ <b:if cond…> và </b:if> ví dụ:
<b:if cond='data:blog.pageType == "item"'> Nội dung (để thực thi nếu điều kiện đúng) </b:if>mình cũng sử dụng các này để chèn quảng cáo vào bài viết ở bài trước:
Nếu bạn muốn thực hiện một nội dung khác nếu điều kiện sai, bạn cần thêm thẻ vào ví dụ:
<b:if cond='data:blog.pageType == "item"'> Nội dung 1 (để thực thi nếu điều kiện đúng)
<b:else/> Nội dung 2 (để thực thi nếu điều kiện sai) </b:if>Ở tất cả những gì mình đã hướng dẫn ở trên đều sử dụng phép so sánh bằng == nếu bạn muốn so sánh không bằng hay còn gọi là khác thì bạn có thể thay đổi == thành != ví dụ:
<b:if cond='data:blog.pageType != "item"'> Nội dung (để thực thi nếu điều kiện đúng) </b:if>
2. Tra cứu Thẻ data :
Cấu trúc khai báo thẻ data :
<data:[giá trị]/>
Bảng tham khảo giá trị (khai báo thẻ data) :
| 1. Phần chung của toàn bộ blog: - blog.title - blog.pageType - blog.url - blog.homepageUrl - blog.pageTitle - blog.encoding ... 2. Phần header: - title - description ... 3. Phần trong bài đăng: - post.dateHeader - post.timestamp - post.title - post.id - post.body - post.author - post.authorUrl - post.authorProfileUrl - post.addCommentUrl - post.firstImageUrl - data:blog.postImageThumbnail - data:post.thumbnailUrl - post.url - post.snippet ... 4 Phần label: - label.name - label.url - label.isLast ... 5 Phần comment: - comment.body - comment.timestamp - comment.author - comment.authorUrl - comment.deleteUrl - post.numComments ... 6 Phần widget: - title - content |
Hiển thị tiêu đề của blog Kiểu trang trên blog (item, archive, index, search...-thường kèm điều kiện). Hiển thị URL của trang hiện hành. Hiển thị URL trang chủ blog. Hiển thị tiêu đề trang hiện tại. Áp dụng mã chuẩn cho blog (VD: UTF-8). Hiển thị tiêu đề blog. Hiển thị phần mô tả của blog. Hiển thị ngày tháng đăng bài. Hiển thị thời gian của bài đăng Hiển thị tiêu đề bài đăng. Hiển thị ID của bài đăng. Hiển thị nội dung bài đăng. Hiển thị tên tác giả bài đăng. Hiển thị đường dẫn mặc định tới hồ sơ của tác giả bài đăng. Hiển thị đường dẫn tới hồ sơ của tác giả bài đăng. Hiển thị đường dẫn tới phần thêm nhận xét. Hiển thị hình ảnh đầu tiên trong bài đăng. Hiển thị hình ảnh với kích thước 72x72 px Hiển thị hình ảnh thu nhỏ ngoài trang chủ Hiển thị url bài đăng Hiển thị mô tả ngắn của bài đăng. Hiển thị nhãn của bài đăng. Hiển thị đường dẫn tới trang nhãn của bài đăng. Nhãn được hiển thị cuối cùng của bài đăng (Kèm điều kiện). Hiển thị nội dung nhận xét. Hiển thị thời gian của nhận xét. Hiển thị tên tác giả nhận xét. Hiển thị đường dẫn tới hồ sơ tác giả nhận xét. Hiển thị liên kết để xóa nhận xét. Hiển thị số nhận xét của bài đăng Hiển thị tiêu đề widget. Hiển thị nội dung widget. |
3. Thẻ b:include và b:includable là gì?
Khi mà bạn muốn sử dụng nhiều lần một đoạn mã (HTML hay JS) nhiều lần trong một widget bất kỳ, nhưng đoạn mã đó quá dài, hai thẻ này chính là giải pháp dành cho bạn.
Các thực hiện rất đơn giản, đầu tiên bạn tạo ra một thẻ b:includable gắn cho nó một cái id và ghi toàn bộ nội dung của đoạn mã mà bạn muốn sử dụng nhiều lần vào trong đó. Sau đó khi cần lấy ra sử dụng ở đâu bạn đơn giản chỉ cần sử dụng thẻ b:include để lấy dữ liệu trong đoạn mã đó ra để sử dụng.
Cú pháp sử dụng
<b:includable id='ten-id' var='ten-gia-tri'> [ĐOẠN MÃ HOẶC NỘI DUNG BẤT KỲ] </b:includable>
Các thuộc tính cho thẻ b:includable
- id (bắt buộc): Bạn có đặt với chữ số không dấu bất kì, viết liền và không dấu. Mỗi widget phải có tối thiểu một thẻ includable vời id='main' là thẻ đầu tiên mà widget thực thi.
- var (không bắt buộc) Bạn có thể đặt với chữ và số, đây là biến tạo ra để sử dụng tham chiếu dữ liệu.
Một lưu ý là khi bạn tạo ra thẻ b:includable thì nó hoàn toàn không xuất hiện cho đến khi bạn gọi nó ra bằng the b:include. Các gọi như sau, nếu bạn đặt thẻ b:includable với id='ksl', thì khi đó bạn gọi nó ra bằng thẻ <b:include name='ksl' />, thuộc tính name chính là tên của id của thẻ includable.
Các thuộc tính cho thẻ b:include
- name (bắt buộc): Phải trùng với ID của thẻ b:includable đã tạo ra trước đó.
- data (không bắt buộc): Là dữ liệu bạn muốn truyền vào thẻ b:includable bạn đã tạo trước đó. Có nghĩa là giá trị của thằng này sẽ chuyển vào cho cái biến mà bạn đã đặt cho var cho thằng kia.
- cond (không bắt buộc) Điều kiện thực thi thẻ include. Tương tự không khác gì thẻ b:if.
4. Thẻ b:section (phần, khu vực) :
Blogspot sử dụng thẻ b:section để phân chia trang blog ra thành nhiều khu vực như header (phần đầu trang), sidebar (cột nằm bên cạnh bài viết), main (phần chính hiển thị bài viết), footer (phần chân trang), v.v... Mỗi section trong template đều có một thẻ mở và một thẻ đóng.
Ví dụ:
<b:section id='header' class='header' maxwidgets='1'showaddelement='no'>
<!-- Ben trong chua the b:widget -->
</b:section>
Một thẻ section có thể có những thuộc tính sau :
| Thuộc tính | Giải thích |
| id | (bắt buộc) là một id duy nhất dùng để đặt tên cho section. |
| class | Thường được đặt là 'nav', 'header', 'main', 'sidebar', 'footer'. Nếu sau này bạn thay đổi template, những tên này sẽ giúp cho Blogger xác định được cách tốt nhất để chuyển đổi nội dung của bạn. Tuy nhiên, bạn vẫn có thể đặt những tên khác nếu bạn muốn. |
| maxwidgets | Số lượng widget tối đa có thể được đặt trong section đó. |
| showaddelement | Có thể là 'yes' (có), hoặc 'no' (không), mặc định là 'yes'. Thuộc tính showaddelement cho phép hiển thị hoặc không hiển thị liên kết "Thêm Tiện ích" cho section trong phần Page Elements (bố cục) của Blogger. |
| growth | Có thể là 'horizonal' (nằm ngang), hoặc 'vertical' (thẳng đứng), mặc định là vertical. Thuộc tính growth xác định cách sắp xếp các widget trong section nằm cạnh nhau hay xếp chồng lên nhau. |
Một section có thể chứa một hoặc nhiều widget nhưng nó không thể chứa code hoặc section khác. Nếu bạn muốn chèn thêm code vào giữa hoặc xung quanh các widget trong một section, bạn cần phải chia section đó thành hai hay nhiều section mới.
5. Thẻ b:widget (tiện ích) :
Widget là phần tử con của section, các dữ liệu thực tế trong mỗi widget được lưu trữ trong cơ sở dữ liệu của blogger và chỉ được truy cập khi widget đó cần được hiển thị. Code widget có dạng như sau (ví dụ widget cho phần đầu trang 'header') :<b:widget id='Header1' locked='false' title='Title Blog' type='Header'>
<b:includable id='main'>
<b:if cond='data:useImage'>
<!--Show the image only-->
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
</a>
</b:if>
</b:includable>
<b:includable id='description'>
<p><data:description/></p>
</b:includable>
<b:includable id='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
Một thẻ widget có thể có những thuộc tính sau :
| Thuộc tính | Giải thích |
| id | (bắt buộc) là một id duy nhất dùng để đặt tên cho widget. |
| type | Cho biết kiểu của widget, widget của blogger gồm những kiểu sau : BlogArchive, Blog, Feed, Header, HTML, SingleImage, LinkList, List, Logo, BlogProfile, Navbar, VideoBar, NewsBar. |
| locked | Có thể là 'yes' (có), hoặc 'no' (không), mặc định là 'no'. Nếu một widget có thuộc tính locked='yes' thì widget đó không thể xóa hoặc di chuyển trong phần Page Element (bố cục) của Blogger. |
| title | Hiển thị tiêu đề cho widget, nếu không chỉ định thuộc tính title, tiêu đề hiển thị mặc định sẽ là 'List1'. |
| pageType | Có thể là 'all', 'archive', 'main', 'item', mặc định là 'all'. Các widget chỉ hiển thị trên các trang được chỉ định trong blog của bạn (trong phần Page Element (bố cục) của Blogger, tất cả các widget đều được hiển thị). |
| mobile | Có thể là 'yes' (có), 'no' (không) hoặc 'only' (chỉ khi), nếu không chỉ định thuộc tính mobile, mặc định sẽ là 'default'. Thuộc tính mobile cho phép ('yes'), hoặc không cho phép ('no') widget hiển thị trên thiết bị di động. Với thuộc tính mobile='only' thì widget đó chỉ hiển thị trên thiết bị di động mà không hiển thị trên máy tính bàn hoặc laptop. Khi không chỉ định thuộc tính mobile cho widget ('default'), chỉ có những widget thuộc kiểu sau có thể hiển thị được trên thiết bị di động : Header, Blog, Profile, PageList, AdSense, Attribution. |
Lưu ý : Khi blog được xuất bản, các thẻ b:section và b:widget sẽ được thay thế bằng thẻ div với các id đã được chỉ định. Vì vậy, khi thiết lập giao diện cho blog bằng css các bạn có thể ghi : div#header, div#myList, v.v...
Nguồn :
http://www.kslzone.net
http://www.toilaquantri.com
https://duongtronghieu.blogspot.com/2016/05/kien-thuc-ve-ma-nguon-blogger-blogspot-cua-google.html
