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.
Tùy chỉnh cấu trúc của mẫu điện thoại di động của bạn.
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)
<b:widget id='Attribution1' locked='true' title='' type='Attribution'/>
và thêm thuộc tính mobile=’no’ vào nó như dưới:
<b:widget id='Attribution1' locked='true' mobile='no' title='' type='Attribution'/>
<b:widget id='BlogArchive1' title='Blog Archive' type='BlogArchive'>
<b:widget id='BlogArchive1' title='Blog Archive' mobile='yes' type='BlogArchive'>
Lúc này truy cập bằng mobile bạn sẽ thấy BlogArchive hoạt động!
<b:widget id='Attribution1' locked='true' mobile='only' title='' type='Attribution'/>
Tùy biến giao diện và cảm nhận mẫu điện thoại di động của bạn
<body class='loading mobile'>
Hãy kiểm tra để chắc chắn rằng mẫu của bạn có thẻ sau:
<body expr:class='"loading" + data:blog.mobileClass'>
.mobile .date-header { text-decoration:underline; }
– Bố cục Phiên bản di dộng
.mobile #outer-wrapper {max-width: 630px; width: auto;}
hoặc:
.mobile #outer-wrapper, .mobile #main-wrapper, .mobile #sidebar-wrapper {float: none; width: auto;}
Thay thế nội dung Widget của blogger khi xem trang bằng Di động
ví dụ::
<div class="widget-content"> <b:if cond="data:blog.isMobile"> <!-- Show a text link in mobile view.--> <a href="//www.blogger.com"> Powered By Blogger </a> <b:else/> <!-- Show an image link in desktop view.--> <a href="//www.blogger.com"> <img expr:src="data:fullButton" alt="Powered By Blogger"/> </a> </b:if> </div>
<b:if cond="data:blog.isMobile"/>
Hoặc.
<b:if cond='data:blog.pageType == "data:blog.isMobile"'>
Bạn có thể sử dụng thẻ này để tạo cho blog của mình hoàn toàn khác với phiên bản di động của blog.
Bố cục giao diện mobile?
Khác với phiên bản máy tính, phiên bản di động hoàn toàn khác.
– trang chủ.
<b:includable id=’mobile-index-post’ var=’post’>
– trang bài viết:
<b:includable id=’mobile-post’ var=’post’>