Template blogspot bán hàng (MIỄN PHÍ) đẹp, chuyên nghiệp, chuẩn seo

Lời đầu tiên Azaseo gởi lời chào đến tất cả các độc giả, đây là bài viết đầu tiên về template blogspot của chúng tôi, với mục đích muốn chia sẻ một template blogspot bán hàng cho các bạn nào đó đang cần mà chưa có tiền để mua, thì đây là mẫu hợp lý cho các bạn.

Template blogspot bán hàng tinh dầu miễn phí

Template blogspot bán hàng (MIỄN PHÍ) đẹp, chuyên nghiệp, chuẩn seo
Ảnh demo trang chủ template blogspot bán hàng miễn phí
Sau khi download về giản nén file zip ra các bạn sẽ được 3 file đình kèm đó là
  • Atom1 : Đây là file đa ta bài viết
  • Template.. : Đây là file giao diện
  • Code giỏ hàng : đây là code để tạo giỏ hàng nhé

1 . Hướng dẫn up giao diện lên blogger

Để up giao diện lên blogger mình yêu cầu các bạn phải cài đặt notepad++ TẠI ĐÂY Sau khi cài đặt hoàn tất các bạn click chuột phải vào file Template... và chọn Edit With Notepad++ cửa số hiện ra là toàn bộ code html các bạn Coppy tất cả sau đó vào Blogger > Chủ để > Chỉnh sửa HTML và dán toàn bộ code này vào > Bấm lưu mẫu.

Như vậy là đã hoàn thành xong phần up mẫu rồi nhưng vẫn chưa giống demo đúng không nào vậy hãy làm các bước tiếp theo nhé.

PHẦN LOGO

 Phần này các bạn chỉ cần vào Bố Cục > Header chỉnh sửa và tải logo có sẵn trên máy tính lên là ok nhé.

PHẦN MENU SHOP

Menushop vẫn tiếp chục trên phần Bố Cục > Menu shop Chỉnh sửa bố cục có sẵn và dán vào đó đoạn code sau :
<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='#'><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>

  • #LINK : Thay bằng đường dẫn khi click vào menu nhé 

PHẦN SLIDER ẢNH

 Tiếp tục chỉnh sửa phần Slider bở bố cục và dán đoạn code
<div class='slide-auto'>
<div class='slideshow'>
<div class='nivoSlider' id='slideshow' style='background: url(&apos;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXR4TI7B_9-LevnPgNnKANFuvat7O5ODF2-K-F5Yyw_DF-Uaw28hdanmhlcIp2gXvqgM1xjediKm-mkn2YChQ-sRL-Ys_b_0PNs-PvbjyM_tbjphIa_wQfgt_6MrV0tnp1AsAreJ7Zs_yZ/s682/tinh+dau+online+1.png&apos;) no-repeat; position: relative;'>
<a class='nivo-imageLink' href='#' >
<img alt="" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrfHE2kLs_FtwySarR7la7Ixk7WXCsEwzx46fW0d-48QCRfdFYg4IBrmen2GN9eq0cGdj5UHvs_UtEk5olJMZ-OhawTP4EGvqDIMUU1JyHKNDM_c-2xx4BJSL042ARO5sJfFwhq1vckcj8/s682/tinh+dau+online+2.png' style='width:682px' />
</a>
<a class='nivo-imageLink' href='#' style='display: block;'>
<img alt="" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixDtjorQxxtWkQZL6zkX5-vs1EMYSPhQA6YcRuC0aJAXHbUTX8nxRaLYjwPPLG0pGnqMoVailhy6DbpT2NDnztdmM-EStqyakOGLU3MRRmo8-K6IqYVR26U4dXEDtJM_ofdGq0kvQsbSq9/s682/tinh+dau+online+3.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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYlNHNdd_FEH4IHHYw2huTG41evGU888rwJKgTpk2joy4cj9SjYc_eSX7jGX4XfleHTMYqCzeupc9DR8tBhLg7QY_qth9C7RXDaQH3JYCnadepzvY0dI4wYE_j7Gepv_fGZyLSmfzSTeGx/s1600/yahoo.png"/>
</a>
<a class="skyper" href="skype:hieu.dev?chat">
<img alt="Skyper" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIOk6ptqRS8lizc-tmvQofXvaNzj0ZDUBfgj6ofiF1CrrQhyeta4ZiPsa7_r8aIeGMq8gpxZ9dzWpK-Z9BGnfy6rra9w7FptrmW0EX9EN0kyzftjUTNI6l0NLM51P0TEM-0pNM5-u9gCMn/s1600/skype.png"/>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>

  • Thay link ảnh bôi đậm bằng link ảnh slider ảnh chạy
 PHẦN HIỂN THỊ BÀI VIẾT SẢN PHẨM Ở SIDEBAR

Phần này thì ở bố cục cũng có tiện ích Sidebar các bạn chỉnh sửa và thêm đoạn code 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>

  • Thay Tinh Dầu Nguyên Chất thành nhãn khi các bạn viết bài và muốn hiển thị ra nhé

2. File atom1 :


File này là file data bài viết trong file này có demo bài viết tin tức và bài sản phẩm, các bạn vào phần Cài Đặt > Khác > Nhập nội dung và chọn đến file atom1 này là tất cả bài viết sẽ hiển thị ra cho các bạn thôi.

  • Lưu ý đây chỉ là bài viết demo các bạn có thể sửa lại hoặc có thể coppy nó và tạo 1 bài đăng mới dán vào và chỉnh sửa thông tin theo ý muốn nhé.

3. Tạo giỏ hàng

Các bạn thực hiện mở file giỏ hàng bằng Notepad+++ và coppy tất cả sau đó vào mục trang trong phần quản trị > Tạo trang mới > Chuyển sang tab HTML và dán toàn bộ code này vào và đặt tiêu đề là Giỏ Hàng nhé.

Tiếp đó là phần cài đặt giỏ hàng kết nối vớ Google Docs các bạn có thể xem và làm theo video bên dưới nha.

Như vậy là phần hướng dẫn và chia sẻ template blogspot bán hàng miễn phí của mình đã xong rồi, làm hết các bước trên chắc các bạn cũng đã có một website bán hàng siêu đẹp rồi nhỉ. Chúc các bạn thành công nha.

Chia sẻ https://azaseo.blogspot.com/ cho người biết hơn để họ cũng như bạn nhé.
autor

Chuyên thiết kế templates blogspot bán hàng, bất đông sản, tin tức...Chuẩn seo, load nhanh tư vấn seo miễn phí cho khách hàng. Hotline : 0967 84 99 34

Gọi ngay:0967 84 99 34 (Mr Hồng)