.Bài viết KTĐN
Cô tôiNhóm Blogger (Blog Code Blogger) đã cập nhật một tính năng mới. Nếu bạn đã kích hoạt Templates điện thoại di động, bạn sẽ có thể để tùy chỉnh các mẫu cho Blogger điện thoại di động bằng cách sử dụng CSS định dạng. Bạn cũng có thể kiểm soát những thành phần được hiển thị và không nên hiển thị. Bạn cũng có thể cấu hình các tiện ích để hiển thị một nội dung thay thế trong giao diện điện thoại di động.Mặc dù điều này có vẻ rất hữ ích, Nhưng namkna đã không thể test tất cả các tính năng này !
Để sử dụng giao diện mobile blogger thì trước tiên ta phải kích hoạt nó lên !
1- Đăng nhập vào Blog
2- Chọn Mẫu (Template)
3- Tại ô điện thoại di động (Mobile template) bấm vào biểu tượng bánh xe để vào mục cài đặt.
Templates Blogger được thiết kế bằng cách sử dụng các Widget. Blogger đã thêm thuộc tính mới (di động) vào thẻ <b:widget/>. Thuộc tính này có thể 'mặc định' giá trị 'yes' (có), 'no'(không) hoặc 'only' (chỉ khi). Và tài thuộc tính này sẽ quy định widget đó có được phép hiển thị trong giao diện điện thoại di động hay không!.
Các widget hiển thị trên điện thoại di động theo mặc định như sau:
Header (Tiêu đề)
Blog (bài đăng)
Profile (thông tin tác giả)
PageList (danh sách trang)
AdSense (quảng cáo bởi google)
Attribution (cung cấp bởi blogger)
Header (Tiêu đề)
Blog (bài đăng)
Profile (thông tin tác giả)
PageList (danh sách trang)
AdSense (quảng cáo bởi google)
Attribution (cung cấp bởi blogger)
1- Nếu bạn muốn ẩn bất kỳ một widget tiện ích nào khi sử dụng điện thoại di động bạn chỉ cần thêm thuộc tính mobile='no' trong thẻ Widget, và tiện ích đó sẽ không còn xuất hiện trong màn hình điện thoại di động.
Ví dụ namkna có thể ẩn tiện ích Attribution khi xem blog bằng điện thoại di động. bằng cách tìm widget sau:
<b:widget id='Attribution1' locked='true' title='' type='Attribution'/>
<b:widget id='Attribution1' locked='true' mobile='no' title='' type='Attribution'/>
Ví dụ: Namkna muốn hiển thị widget lưu trữ Blog Archive thì chỉ cần tìm widet BlogArchive cóid='BlogArchive1'như bên dưới !
<b:widget id='BlogArchive1' title='Blog Archive' type='BlogArchive'>
<b:widget id='BlogArchive1' title='Blog Archive' mobile='yes' type='BlogArchive'>
3- Nếu bạn muốn một widget chỉ xuất hiện trong giao diện điện thoại di động, bạn có thể thiết lập thuộc tínhmobile='only'.
Ví dụ : Namkna chỉ muốn widget Attribution1 (cung cấp bởi google) xuất hiện trên mobile thì ta thêm thuộc tínhmobile='only' như sau:
<b:widget id='Attribution1' locked='true' mobile='only' title='' type='Attribution'/>
- Sử dụng cách này để các wiget hiển thị hoặc biến mất khỏi chế dộ xem blog của bạn bằng di dộng nha.
Tùy biến giao diện và cảm nhận mẫu điện thoại di động của bạn
Bây giờ bạn hoàn toàn có thể tùy chỉnh kiểu dáng của mẫu điện thoại di động của bạn. Body của mẫu điện thoại di động sẽ được theo kiểu lớp động dạng.
<body class='loading mobile'>
<body expr:class='"loading" + data:blog.mobileClass'>
Vì vậy, nếu bạn am hiểu CSS, bạn có thể sử dụng tên class này để tùy chỉnh mẫu điện thoại di động của bạn..mobile .date-header { text-decoration:underline; }
Thay thế nội dung Widget của blogger khi xem trang bằng Di động
Khi bạn chuyển sang các mẫu điện thoại di động tùy chỉnh, bạn có thể thấy rằng các mẫu là quá lớn để phù hợp với một trình duyệt di động. Nếu bạn muốn, sau đó bạn có thể cung cấp nội dung thay thế bên trong một widget.
ví dụ::
<div class="widget-content"> <b:if cond="data:blog.isMobile"> <!-- Show a text link in mobile view.--> <a href="http://www.blogger.com"> Powered By Blogger </a> <b:else/> <!-- Show an image link in desktop view.--> <a href="http://www.blogger.com"> <img expr:src="data:fullButton" alt="Powered By Blogger"/> </a> </b:if> </div>
- Bằng cách sử dụng thẻ điều kiện bạn có thể xác định được độc giả xem blog của bạn trong một trình duyệt di động hay PC.<b:if cond="data:blog.isMobile"/>
Bạn có thể sử dụng việc kiểm tra này để sáng tạo cho blog của mình một cái nhìn hoàn toàn khác với phiên bản di động của blog.
Kết luận.
Hãy chia sẻ nếu bạn đã tạo ra một số mẫu điện thoại di động thực sự tuyệt vời.
Theo : Namkna blog
Không có nhận xét nào:
Đăng nhận xét
Những người bạn