Chia sẻ Template blogspot bán hàng free đẹp, chuyên nghiệp
Mẫu Template blogspot bán hàng free này thiết kế 2 cột, có menu dọc, nhang, slider ảnh, và toàn bộ tính năng của một template bán hàng blogspot. Ngoài ra bạn còn có thể đăng kèm tin tức trên mẫu này để dễ dang seo cũng như truyền tải thông tin đến cho khách hàng tốt hơn.
 |
| Template blogspot bán hàng free đẹp, chuyên nghiệp |
HƯỚNG DẪN SỬ DỤNG TEMPLATE BLOGSPOT BÁN HÀNG FREE NÀY!
Khi trước share template blogspot bán hàng free này nhưng chưa có bản hướng dẫn đầy đủ thì nay bài này sẽ đi chi tiết hơn giúp các bạn không biết gì cũng có thể sửa đổi được các tiện ích trên trang.
Khi download template blogspot bán hàng này về bạn sẽ có gì?
+ File atom.xml : Data bài viết
+ Template… : Đây chính là code giao diện
+ Code giỏ hàng : Để tích hợp giỏ hàng
Làm sao để tải code lên blog?
Để tải code template blogspot bán hàng lên blog bạn mở file template… bằng notepad+++ coppy toàn bỏ vào phần Chủ đề > Chỉnh sửa HTML.
Cách sử dụng file atom.xml
Đây là data bài viết của template blogspot bán hàng free này khi tải lên tất cả bài viết sẽ hiển thị giống như mẫu demo. Để làm việc này các bạn vào Cài đặt > Khác > Ở mục Nhập và Sao lưu các bạn chọn Nhập nội dung và chọn đến file atom để tải lên nhé.
Cách sử dụng file code giỏ hàng
Để thiết kế giỏ hàng giống như mẫu template blogspot bán hàng demo bạn mở file này bằng Notepad+++ coppy toàn bộ code vào vào phần Trang > Tạo trang mới > Chọn tab Html dán code vào, đặt tiêu đề là Giỏ Hàng và bấm lưu nhé.
Cài đặt bố cục trang chủ cho template blogspot bán hàng free này?
<div class=’menuleft’>
<div class=’bg-menuleft’>
<div class=’dropdown-toggle’ data-toggle=’dropdown’ itemscope=’itemscope’ itemtype=’http://schema.org/SiteNavigationElement’>
<span>
<i aria-hidden=”true” class=”fa fa-home fa-2x”></i> DANH MỤC SẢN PHẨM
</span>
</div>
<ul class=’menuleft dropdown-menu homecat’ role=’menu’ >
<li><a href=’#LINK‘ title=”><i class=”fa fa-angle-right” aria-hidden=”true”></i>
Tinh Dầu Nguyên Chất</a></li>
<li><a href=’#LINK‘ title=”><i class=”fa fa-angle-right” aria-hidden=”true”></i> Đèn Xông Tinh Dầu</a></li>
<li><a href=’#LINK‘ title=”><i class=”fa fa-angle-right” aria-hidden=”true”></i> Máy Khuyếch Tán Tinh Dầu</a></li>
<li><a class=’atop’ href=’#LINK‘><i class=”fa fa-angle-right” aria-hidden=”true”></i> Tinh Dầu Làm Đẹp</a>
</li>
<li><a class=’atop’ href=’#LINK‘><i class=”fa fa-angle-right” aria-hidden=”true”></i> Nến Thơm Greenleaf</a>
</li>
<li><a href=’#LINK‘ title=”><i class=”fa fa-angle-right” aria-hidden=”true”></i> Phụ Kiện</a></li>
<li><a href=’#LINK‘ title=”><i class=”fa fa-angle-right” aria-hidden=”true”></i> Phụ Kiện</a></li>
</ul>
</div>
</div>
<div class=’menuright’>
<ul class=’mrul’>
<li class=’mrli’>
<a class=’mratop mdrop’ href=’#LINK‘>Công Dụng Và Cách Dùng</a>
</li>
<li class=’mrli’><a class=’mratop mdrop’ href=’#LINK‘>Hướng dẫn mua hàng</a>
</li>
<li class=’mrli’><a class=’mratop mdrop’ href=’#LINK‘>Cửa hàng và đối tác</a>
</li>
<li class=’mrli’><a class=’mratop mdrop’ href=’#LINK‘>Liên hệ – tuyển dụng</a></li>
</ul></div>
Trong đó :
- Thay #LINK bằng đường dẫn liên kết
- Còn các chữ đằng sau thay thế bằng tên menu hiển thị
Slider ảnh và modul chính sách bên phải
Tiếp tục tại phần bố cục của template blogspot bán hàng free này các bạn chỉnh sửa phần Slider ảnh và dán đoạn code
<div class=’slide-auto’>
<div class=’slideshow’>
<div class=’nivoSlider’ id=’slideshow’ style=’background: url('https://1.bp.blogspot.com/-4xrTiWNr6_o/V43kjWLls3I/AAAAAAAAFbA/zV9fwpXWXicbxooW-WDeokJ2QaO6IPozQCLcB/s682/tinh%2Bdau%2Bonline%2B1.png') no-repeat; position: relative;’>
<a class=’nivo-imageLink’ href=’#’ >
<img alt=”” src=’https://1.bp.blogspot.com/-vIBxs6Jh6MU/V43lKBu6OPI/AAAAAAAAFbE/GQdNstK_weA4yXiuW3LZPPG3yG0AJ4eegCLcB/s682/tinh%2Bdau%2Bonline%2B2.png‘ style=’width:682px’ />
</a>
<a class=’nivo-imageLink’ href=’#’ style=’display: block;’>
<img alt=”” src=’https://3.bp.blogspot.com/-PCxEsQShR-w/V43mLWU1CUI/AAAAAAAAFbU/j1Os55wDg1IgZ6VFAjiyhDd1n9BrGDWnQCLcB/s682/tinh%2Bdau%2Bonline%2B3.png‘ style=’width:682px’ />
</a>
</div>
</div>
<div class=”doi-tac”>
<div class=”col-lg-4 col-md-4 top-right-detail”>
<div id=”policy”>
<ul>
<li class=”item_policy first”>
<i class=”fa fa-umbrella”></i>BÁN HÀNG<br /> CHÍNH HÃNG </li>
<li class=”item_policy”>
<i class=”fa fa-usd”></i>CAM KẾT <br />GIÁ TỐT </li>
<li class=”item_policy”>
<i class=”fa fa-truck”></i>GIAO HÀNG<br />TOÀN QUỐC </li>
<li class=”item_policy”>
<i class=”fa fa-calendar”></i>DỊCH VỤ <br />HỖ TRỢ 24/7 </li>
<li class=”item_policy yahoo-sky last”>
<p class=”bg-hl”>
Hỗ trợ trực tuyến<br /><span>0967 84 99 34</span>
</p>
<a class=”yahoo” href=”ymsgr:sendIM?b0y.k0_ol”>
<img alt=”Yahoo” src=”https://2.bp.blogspot.com/-KicJ7VQiBIE/V9D0uNp8POI/AAAAAAAAGTo/Ynts8M9c4MgEliu7alVOkrm8nJ1hNffVACLcB/s1600/yahoo.png”/>
</a>
<a class=”skyper” href=”skype:hieu.dev?chat”>
<img alt=”Skyper” src=”https://3.bp.blogspot.com/-Sehjnza-EIU/V9D0uGsWKII/AAAAAAAAGTk/NswlVbQYzbICpRsCL4UmmgdivEt-KC-tgCLcB/s1600/skype.png”/>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
Trong đó
- Thay 3 link ảnh bôi đậm bằng link ảnh slide chạy với kích thướt hình ảnh là 682 x 302
- Thay đổi số điện thoại và thông tin chổ chính sách
Bài viết hiển thị theo label (Nhãn) ở trang chủ
Template blogspot bán hàng free này bài viết show trang chủ hiển thị theo Label và để làm được việc này vẫn dán thêm 1 đoạn code ở bố cục bên dưới silder ảnh khi nãy.
<ul class=”product_list_widget”>
<script>
//<![CDATA[
document.write(“<script src=”/feeds/posts/default/-/Tinh Dầu Nguyên Chất?max-results=”+5+”&orderby=published&alt=json-in-script&callback=labelproduct3″></script>”);
//]]>
</script>
</ul>
Trong đó
- Tinh dầu nguyên chất : là nhãn khi các bạn viết bài đặt cho nó
Nếu chưa hiểu bước nào về phần hướng dẫn cho mẫu template blogpsot bán hàng này có thể xem thêm video bên dưới nhé các bạn
Thế đấy lúc bạn bạn đã thành công và có một template blogspot bán hàng free cực đẹp và đẳng cấp đúng không nào. Hãy chia sẻ bài viết này cho bạn bè để họ cũng được như bạn nhé, mọi thắc mắc có thể để lại bình luận để được trợ giúp nha.