Joomshopping Thai Edition เป็นส่วนเสริมเพื่อเพิ่มความสามารถให้กับ Joomla สามารถนำไปใช้ในการทำเว็บไซต์ขายสินค้าออนไลน์ได้ ใน Joomshopping Thai Edition จะมีหลายโมดูล ซึ่งหนึ่งในนั้นก็คือโมดูล Jshopping Last Products ที่ใช้สำหรับแสดงสินค้าใหม่หรือสินค้าล่าสุด หากใช้ใน Bootstrap3 การแสดงผลจะแสดงเป็นแนวตั้ง สำหรับบทความนี้จะเป็นการแนะนำการปรับ โมดูล Jshopping Last Products ให้แสดงสินค้าเป็นแนวนอนและมีเส้นกรอบของแต่ละสินค้า
1.เข้า localhost ส่วนของผู้ดูแลระบบ เลือก Extensions เลือก Templates
2.คลิกที่ชื่อของเทมเพลต
3.คลิก ที่เมนู Create Overrides
4.คลิกที่ mod_jshopping_lastest_products เป็นการ Override Module
5.เปิดโปรแกรม Netbeans ในโฟลเดอร์ html จะได้โฟลเดอร์ mod_jshopping_lastest_products ขึ้นมา
6.ทดลองรันในหน้าเว็บ joomshopping จะแสดงสินค้าล่าสุด
7.ปรับการแสดงสินค้าให้อยู่ในแนวนอน โดยแทรกโค้ด row และ col-lg-3 col-md-3 col-sm-6 col-xs-12 แทรกลงในไฟล์ default.php
<div class="latest_products jshop jshop_list_product row">
<?php if(count($rows)) foreach($rows as $product){ ?>
<div class="block_item block_product product col-lg-3 col-md-3 col-sm-6 col-xs-12">
8.รันหน้าเว็บ joomshopping จะแสดงสินค้าล่าสุดเป็นแนวนอน
9.ปรับการแสดงสินค้าให้แต่ละสินค้ามีเส้นขอบของช่อง โดย แทรกโค้ด ลงในไฟล์ user.css ที่อยู่ในโฟลเดอร์ css
.product-thumb {
border: 1px solid #ddd;
margin-bottom: 20px;
overflow: auto;
}
10.รันหน้าเว็บ joomshopping จะแสดงสินค้าล่าสุดเป็นแนวนอนและมีเส้นขอบของแต่ละช่อง
เนื้อหาเพิ่มเติม