Các điều kiện hiển thị dữ liệu trong tùy chọn trang bài viết của widget Blog1 version 2
Khi các bạn vào phần Bố cục tiện ích chọn chỉnh sửa Bài đăng trên Blog và trong hộp thoại Định cấu hình bài đăng trên Blog có các tùy chọn hiển thị trong ô vuông tích vào là hiển thị còn bỏ tích là không hiển thị.
Định cấu hình bài đăng trên Blog |
Như vậy trong mẩu template cũng cần có điều kiện hiển thị bằng b:if cho một mục nào đó, dưới đây là danh sách các mục hiển thị, phần mình đánh dấu màu xanh là điều kiện hiền thị và đánh dấu màu đỏ là tụy chọn hiển thị.
1. Hiển thị tác giả:
<b:if cond='data:widgets.Blog.first.allBylineItems.author'>
<span class='post-author'>
<data:widgets.Blog.first.allBylineItems.author.label/>
<a expr:href='data:post.author.profileUrl' expr:title='data:post.author.name'>
<data:post.author.name/>
</a>
</span>
</b:if>
<data:widgets.Blog.first.allBylineItems.author.label/> Tùy chọn hiển thị tên ví dụ ghi chữ "Bởi" thì html sẽ hiển thị chữ "Bởi" còn nếu bỏ trống sẽ không hiển thị.
2. Hiển thị thời gian đăng bài
<b:if cond='data:widgets.Blog.first.allBylineItems.timestamp'>
<data:widgets.Blog.first.allBylineItems.timestamp.label/>
<span class='post-lastupdated'>
<data:post.lastUpdated/>
</span>
</b:if>
<data:widgets.Blog.first.allBylineItems.timestamp.label/> Tùy chọn hiển thị tên ví dụ ghi chữ "Lúc" thì html sẽ hiển thị chữ "Lúc" còn nếu bỏ trống sẽ không hiển thị.
3. Hiển thị số nhận xét
Tùy chọn này sẽ tắt luôn khung nhận xét của bài viết
<b:if cond='data:widgets.Blog.first.allBylineItems.comments'>
<a expr:href='data:post.commentsUrl' expr:onclick='data:post.commentsUrlOnclick' expr:title='data:messages.postAComment'>
<data:post.numberOfComments/>
</a>
</b:if>
4. Các liên kết với bài này
<b:if cond='data:widgets.Blog.first.allBylineItems.backlinks.label'>
<div class='backlinks-container'>
<a expr:href='"https://www.blogger.com/blog-this.g?u=" + data:post.url.canonical + "&n=" + data:post.title + "&t=" + data:post.snippets.long' expr:title='data:widgets.Blog.first.allBylineItems.backlinks.label' target='_blank'>
<data:widgets.Blog.first.allBylineItems.backlinks.label/>
</a>
</div>
</b:if>
<data:widgets.Blog.first.allBylineItems.backlinks.label/> Tùy chọn hiển thị tên ví dụ ghi chữ "Tạo một liên kết" thì html sẽ hiển thị chữ "Tạo một liên kết" còn nếu bỏ trống sẽ không hiển thị.
5. Hiển thị nhãn (label)
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:widgets.Blog.first.allBylineItems.labels'>
<data:widgets.Blog.first.allBylineItems.labels.label/>
<span class='label'>
<a expr:href='data:label.url' expr:title='data:label.name'>
<data:label.name/>
</a>
</span>
</b:if>
</b:loop>
<data:widgets.Blog.first.allBylineItems.labels.label/> Tùy chọn hiển thị tên ví dụ ghi chữ "Nhãn" thì html sẽ hiển thị chữ "Nhãn" còn nếu bỏ trống sẽ không hiển thị.
6. Hiển thị phản ứng:
<b:if cond='data:widgets.Blog.first.allBylineItems.reactions'>
<span class='reactions'>
<span class='reactions-label'>
<data:widgets.Blog.first.allBylineItems.reactions.label/>
</span>
<iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/>
</span>
</b:if>
<data:widgets.Blog.first.allBylineItems.reactions.label/> Tùy chọn hiển thị tên ví dụ ghi chữ "Phản ứng" thì html sẽ hiển thị chữ "Phản ứng" còn nếu bỏ trống sẽ vẫn hiển thị chữ "Phản ứng".
7. Hiển thị Liên kết Bài qua Email
<b:if cond='data:widgets.Blog.first.allBylineItems.icons'>
<span class='post-icons'>
<a expr:href='data:post.emailPostUrl' expr:title='data:messages.emailPost'>
<b:include data='{ iconClass: "touch-icon sharing-icon" }' name='emailIcon'/>
</a>
</span>
</b:if>
8. Hiển thị nút chia sẻ
<b:if cond='data:widgets.Blog.first.allBylineItems.share'>
<div class='byline post-share-buttons goog-inline-block'>
<b:include data='{ sharingId: (data:sharingId ?: (data:widget.instanceId + "-byline-" + data:post.id)), shareUrl: data:post.shareUrl, originalUrl: data:post.url }' name='sharingButtons'/>
</div>
</b:if>
9. Hiển thị vị trí
10. Hiển thị hồ sơ tác giả bên dưới bài đăng
<b:if cond='data:post.author.aboutMe and data:view.isPost'>
<div class='author-profile'>
<b:if cond='data:post.author.authorPhoto.url'>
<img class='author-image' expr:src='data:post.author.authorPhoto.url' width='50px'/>
<div class='author-about'>
<b:include data='post' name='aboutPostAuthor'/>
</div>
<b:else/>
<b:include data='post' name='aboutPostAuthor'/>
</b:if>
</div>
</b:if>