+44(0) 1234 567 890 info@domainname.com

Friday, February 7, 2014

Cách tạo menu hiển thị trên mobile cho blogspot

7:12 AM

Share it Please
Cách tạo menu hiển thi trên mobile cho blogspot

Cách tạo menu hiển thị trên mobile cho blogspot.Cách tạo menu hiển thị trên di động cho blogspot. Cách tạo menu cho blogspot hiển thị tốt mobile.Hướng dẫn cách tạo menu hiển thị trên mobile cho blogspot

Thấy có bạn hỏi về vấn đề này nên mình viết bài hướng dẫn cách tạo menu hiển thị trên mobile cho blogspot.Như các bạn biết blogspot có cái hay nà nó hiển thị khá tốt trên mobile cái mà nhiều website thông thường chưa có và muốn có thì lại phải thuê code về chỉnh sửa lại và nó cũng là điểm mạnh của Blogspot mà mình thấy thích ở nó.

Để thêm chức năng này cho blog thì các bạn cần check xem blog mình có menu khi vào di động chưa nhé để check các bạn đọc bài sau ==> Cách check giao diên blogspot trên mobile không cần dùng điện thoại

Vậy để hiển thị menu trên Mobile chúng ta phải làm gì các bạn làm theo hướng dân dưới đây:

Cách tạo menu hiển thi trên mobile cho blogspot

Bước 1: Đăng nhập Blogspot ==> Mẫu(Template) => Các nhìn sang phần Di động (Mobile) Click vào setting rồi tích vào phần cho phép hiển thị trên di động rồi lưu lại

Cách tạo menu hiển thi trên mobile cho blogspot


Bước 2:  Tiếp tục các bạn vào phần Mẫu(Template) ==> Chỉnh sửa HTML ==> Các bạn copy đoạn code lên trên thẻ ]]></b:skin>

#sidebaratas{display:none;}

Bước 3:  Tiếp tục các bạn vào phần Mẫu(Template) ==> Chỉnh sửa HTML ==> Các bạn copy đoạn code dưới xuống dưới thẻ <body>

<div id='sidebaratas'>
       <b:section id='navtop' preferred='yes'>
         <b:widget id='PageList1' locked='true' title='Pages' type='PageList'>
           <b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content'>
    <b:if cond='data:mobile'>
      <select expr:id='data:widget.instanceId + &quot;_select&quot;'>
        <b:loop values='data:links' var='link'>
          <b:if cond='data:link.isCurrentPage'>
            <option expr:value='data:link.href' selected='selected'><data:link.title/></option>
          <b:else/>
            <option expr:value='data:link.href'><data:link.title/></option>
          </b:if>
        </b:loop>
      </select>
      <span class='pagelist-arrow'>&amp;#9660;</span>

    <b:else/>
      <div></div>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
         </b:widget>
       </b:section>

</div>

Nhấn lưu lại.

Lưu ý : Cái phần <b:section id='navtop' preferred='yes'>  <b:widget id='PageList1' locked='true' title='Pages' type='PageList'> phần chữ màu đỏ phải là chưa tồn tại nếu thấy báo lỗi thì đổi tên nó đi để không bị trùng nhé. Nếu lưu dc ko lỗi là ok

Bước 4. Bắt đầu tạo menu cho di động

Để tạo các phần cho menu chúng ta sẽ làm như sau

Các bạn click vào phần Pages(Trang) ==> Trang mới (New pages) ==> Rồi chọn cái thứ 2 ở dưới ==> Rồi điền đầy đủ thông tin rồi nhấn lưu ,xem hình dưới

Cách tạo menu hiển thi trên mobile cho blogspot



Cách tạo menu hiển thi trên mobile cho blogspot

- Các bạn muốn tạo menu với nhiều chuyên mục thì các bạn cứ tạo thêm vài cái trang như ở trên là ok.
(Chú ý các bạn không nhấn vái cái lưu ở góc phải màn hình nhé,nhấn vào đó là nó sẽ thành không hiển thị nhé)

- Muốn sắp xếp các phần menu cho hiển thị trên dưới thì các bạn lại vào phần Bố Cục(Layout) ==> Tìm cái tên là Pages click vào chỉnh sửa rồi kéo nó vào vị trí bạn muốn vậy là ok.

Vậy rà xong bây giờ các bạn check thử xem nos hiển thị ra sao là ok

Chúc các bạn thành công !

Bài viết được viết bởi http://bittuot.blogspot.com/ -  Bít Tuốt Blog . Chú ý ghi rõ nguồn khi copy bài viết này

0 comments:

Post a Comment

Tags

Thủ thuật pc Góc Làm Đẹp Làm Đẹp Da Thủ Thuật Blogspot - Wordpress - Joomla Thủ Thuật Network Giải trí Thủ Thuật Hay thu-thuat-blogspot ASP.NET Danh bạ Lập trình CSDL Thủ Thuật Blog Lập trình Thủ thuật Excel Phần Mềm Góc Phụ Nữ SEO TT Windows Lý Thuyết CCNA Dịch Vụ Hot CCNA Sức Khỏe - Đời Sống Office Thủ Thuật Mobile Thủ Thuật Win 8 Download Xây dựng liên kết Android Thủ thuật Word Website thu-thuat-internet Forum PHP Tư Vấn Làm Đẹp Mẹo Vặt tien-ich-widget Đọc báo ASP.NET MVC Ca nhạc Hỏi Đáp Thơ Vui Thủ Thuật Game vui-nhon Download Phần Mềm - Crack VBA Excel thu-thuat-facebook Cuộc sống Download Game Photoshop Thủ thuật Blogspot VBA trong Excel Widget Blogspot Địa Điểm Hot C# CSS Giới Tính Tài Liệu Đại học Chuyện lạ Clip Hài - Video Hot Góc Kỹ Năng Góc Sinh Viên Liên Minh Huyền Thoại Sao Sức Khỏe Giới Tính Thủ Thuật Tin Học template-blogger Chuyện Của Sao Design Pattern Kiến thức cơ bản PM hệ thống Thủ thuật Facebook Tin nổi bật Đề thi LAB CCNA Love story Học và hỏi Môn toán Spring.NET Tủ Sách Video lam-quen-voi-blogger Ảnh Vui Bảng Giá Con trai Cẩm nang du học Dependency Injection Hình ảnh Kinh nghiệm học Kỹ Năng Xin Việc Luật Pháp ORM Tin nóng Tiện ích Truyện cười Việt Nam hinh-anh-hai-huoc tho-vui-con-coc thu-thuat-phan-mem Blogspot Distributed Technologies Hợp Tác Kinh Doanh Khám phá MVP NHibernate Photoshop Action Thủ Thuật Win 7 Trẻ Tư Vấn Tiêu Dùng VietYeah TV Xã Hội thu-thuat-SEO Blogger Templates Game flash Khối B Nghịch Nhân vật Phong Cách Slider Thư giãn Thủ thuật Youtube WCF facebook hinh-anh-dep thu-thuat-may-tinh Đời Sống 2010 Con gái Download Game Mobile Drivers External Post Học Nấu Ăn Học vui Làm Đẹp Tóc MVC N-Tier PM hệ điều hành Sao Quốc tế Thủ thuật internet Thông Tin Tin Tức Hot Tivi Truyện Hay Tuyển Dụng Xả Stress Youtube anh-bia-facebook san-pham-google ung-dung-website Đáp án Đề thi thử AOP Abstract Factory Cool stuffs Design Principles Khối A Thông tin mạng Tình yêu lập trình viên phan-mem-van-phong thu-thuat-windows-7 thu-thuat-windows-8 Điện Tử Ảnh Nghệ Thuật 2009 2011 2012 Adapter Pattern Công Nghệ Factory Method Game Hình sự Khối D Kiếm Tiền Qua Mạng Kỹ Năng Nơi Công Sở LinQ Menu Miễn phí Photoshop PSD Sexy Singleton Sành điệu Thủ Thuật Di Động Tin nhắn SMS phan-mem-do-hoa phan-mem-tien-ich Đọc xong vọc liền .NET Remoting 10-thing series 2013 Ajax Bridge Pattern Bóng đá Castle Windsor Chơi Game Online Cover Facebook Có Thể Bạn Chưa Biết Download Phim Dịch vụ Fedora Garbage Collection Google Plus Góc Tâm Sự HTML Hibernate Hài hước IoC JSF Javascript Jquery Khối C Kỹ Năng Bán Hàng Kỹ Năng Thuyết Trình Lazy Load Linux Lock Log4Net MWC Memory Management Mock Multi-Thread MySQL Môn sử Mặc Đẹp Mẹ Và Bé Mỹ Tâm NUnit Ngọc Trinh Nhịp sống trẻ PM văn phòng POCO Passive View Photoshop tách ảnh Phạm Băng Băng Phầm Mềm Crack PostSharp Primefaces Shop Bít Tuốt Strategy Pattern Supervising Controller Sự kiện Thể thao Thủ Thuật Office Tin đặc biệt Toán Tình bạn Tình dục Tốt nghiệp Unit Testing VBA Word Virtual Server Văn WMC 2012 Windows Service acc fshare acc mien phi anh-nghe-thuat cntt di dong di động dropbox dung luong dropbox fshare hinh nen hinh nen dep hình nền job mac os mang xa hoi may ao mạng xã hội social tang dung luong dropbox thu-thuat-mobile thu-thuat-windows-xp tháng 2 top truyen-cuoi tăng dung lượng dropbox vmware Ảnh đẹp