HomeCách tạo menu hiển thị 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é .
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
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 + "_select"'>
<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'>&#9660;</span>
<b:else/>
<div></div>
</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
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á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 liên quan
