การใช้งานแสดงสินค้าโดยใช้ Grid ใน Joomla

แชร์ ความรู้ในการ พัฒนา Joomla Component Extension Module Plugin

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
Patipat
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 979
ลงทะเบียนเมื่อ: 10/06/2019 10:12 am

การใช้งานแสดงสินค้าโดยใช้ Grid ใน Joomla

โพสต์โดย Patipat » 24/07/2019 5:06 pm

ปกติแล้ว เราทำหน้า Grid บนเว็บไซต์ ปัจจุบันเราก็ใช้ Grid ของ Bootstrap ที่มีเวอร์ชันใหม่ แต่ตัวใน Joomla นั้นถ้าจะใช้งาน Grid 2.3 โดยการเขียนการใช้งาน Grid ก็ต่างกันด้วย โดย Joomla จะใช้ เช่น <div class=span12>" แต่ ใน grid ทั่วไป เช่น <div class="col-sm-12"> ในตัว sm นั้น ก็จะแปลว่า small จะเป็นขนาดจอที่เล็กกว่า 567 จะแสดงเป็น Respovsive รวมถึงการแสดงผลที่แบ่งเป็น gird อีกด้วย สามาถศึกษาเรื่อง Grid ได้ที่ Grid ในค่า grid แถวนึงจะรวมกันได้ 12 เราก็ควรแบ่ง div ให้ได้เท่ากับ 12

โค้ด คือ

โค้ด: เลือกทั้งหมด

<div class="row">
    <div class="span5">
            <center> 
                <?php foreach ($setid as $product): ?>
                  <div>
                      <center> <img src="<รูปสินค้า>" width="100px" heigh="100px" title="test" alt="test"></a><center>
                      <br>
                      <center> <?php echo (ชื่อสินค้า])  ?><br></center>
                      <?php echo (ราคา])  ?>
                  </div>      
            </center>    
                <?php endforeach; ?>
        </div>  


<div class="span4"></div>
<div class="span3"></div>
</div>


ผลลัพธ์ จะได้แบ่งตาม Grid นะครับ จะเห็นได้ว่า divแรกใส่5 และ divที่สองเราใส่span4 divที่สามเราใส่span3 ก็จะเห็นการแบ่งดังรูปเลยครับ

*เราสามารถนำ div ที่เหลือ ที่เราไม่ได้ใส่ข้อมูล นำข้อมูลอื่น ๆ มาใส่ได้ครับผม
Selection_999(398).png
Selection_999(398).png (16.76 KiB) เปิดดู 93 ครั้ง
If you fall, let you stand. :)

ภาพประจำตัวสมาชิก
thatsawan
PHP VIP Members
PHP VIP Members
โพสต์: 18166
ลงทะเบียนเมื่อ: 31/03/2014 10:02 am
ติดต่อ:

Re: การใช้งานแสดงสินค้าโดยใช้ Grid ใน Joomla

โพสต์โดย thatsawan » 24/07/2019 5:18 pm

Joomla ใช้ Bootstrap เก่าจังเนาะ

ภาพประจำตัวสมาชิก
Patipat
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 979
ลงทะเบียนเมื่อ: 10/06/2019 10:12 am

Re: การใช้งานแสดงสินค้าโดยใช้ Grid ใน Joomla

โพสต์โดย Patipat » 24/07/2019 7:10 pm

เป็นบาง template ครับที่ใช้ bootstrap เก่า :cry:
If you fall, let you stand. :)


ย้อนกลับไปยัง

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: 4 และ บุคคลทั่วไป 0 ท่าน