เมนูของเรา
ถ้าเรานำเมนูนี้ไปแสดงใน Module ก็จะออกมาเป็นแบบนี้
อันดับแรกเราก็ทำการ overrides Module: Menu ของเราออกมาก่อน โดยจุดประสงของเราก็คือเราจะต้องให้คำสั่ง css ที่ชื่อว่า display:inline-block เพื่อให้เราเมนูแต่ละเมนูแสดงในบรรนทัดเดียวกัน
ให้เราลองสังเกตุที่การเมนูของเราขึ้นบรรทัดใหม่เพราะว่าเมนูแต่ละเมนูจะมีแท็ก li อยู่ให้เราลองดูที่โค้ดก็จะมีการใช้ class เป็นตัวแปลอยู่แบบนี้
โค้ด: เลือกทั้งหมด
echo '<li class="' . $class . '">';
โค้ด: เลือกทั้งหมด
$class = 'item-' . $item->id;
โค้ด: เลือกทั้งหมด
$class = 'item-' . $item->id . ' inline-manu';
จากนั้นให้ไปที่หน้า css ของเราแล้วใช่คำสั่ง display:inline-block โดยการเลือก css แบบนี้
โค้ด: เลือกทั้งหมด
.moduletable .inline-manu{
display:inline-block;
}
ผลลัธท์ที่ได้
เท่านี้ joomla Module: Menu ของเราก็จะแสดงเมนูออกมาเป็นแนวนอนแล้ว
เป็นอย่างไรบ้าครับสำหรับวิธีนี้ที่จะทำให้ joomla Module: Menu ของเราก็จะแสดงเมนูออกมาเป็นแนวนอนยาวไม่ยากอย่างที่คิดใช้ไหมล่ะครับก็หวั่งว่าทุกท่านที่เข้ามาอ่านบทความนี้จะเข้าใจวิธีที่ผมทำนะครับทางผู้เขียนบทความแชร์ความรู้นี้ก็หวังเป็นอย่างยิ่งผู้ที่ได้รับความรู้นี้จะนำความรู้นี้ส่งต่อความรู้ให้กับผู้ที่สนใจการพัฒนาเว็บไซต์เหมือนกับเรานะครับขอบคุณครับ