การแทรก Module ต่างๆ เข้าไปที่บทวามบนเว็บไซต์ จริงๆ การแทรก
Module โมดูล joomla คืออะไร คือรูปแบบแสดงข้อมูลที่แบ่งตาม
position ที่ได้ตั้งไว้สามารถกำหนดการแสดงผลต่างๆ ได้ตามตำแหน่งที่เราต้องการ Moodule เป็นส่วนเสริมตัวนึงที่ joomlaใช้ ยกตัวอย่างเช่น เราจะแสดง from login เราก็ต้องสร้าง from module ของ login ขึ้นมาแล้วทำการ set position ว่าเราจะให้ from
login แสดงส่วนไหนของหน้าจอ และ ถ้าเรามีบทความอยู่ในหน้า main เราต้องการสร้างและแทรก module ลงไปในบทความเรามาดูวีดีโอนี้กันเลยครับ ในการแทรก Module นี้สามารถแทรกได้ทุก position ของเนื้อหาที่มีอยู่ใน joomla ทั้งหมดเพราะว่าการสร้างโมดูลมาเพื่อให้ ข้อมูลที่จะแสดงมีความสวยงามและเรียบร้อยต่อการแสดงผล เราไม่จำเป็นต้องเขียนโค้ดเพราะ module เป็นฟอร์มสำเร็จรุป สามารถเลือกได้เลยว่า เราต้องการ จะเพิ่ม Menu ส่วนใดบ้าง
วิธีแรกให้เราเข้า ส่วนของหน้า Admin หรือ หลังบ้าน จะได้ดังภาพ
แล้วกดที่ Extension > Module
- Selection_999(189).png (58.29 KiB) Viewed 581 times
กด New Module ใหม่
แล้วเลือก Custom
- Selection_999(191).png (45.48 KiB) Viewed 581 times
แล้วให้เรามา1. ใส่ Title สำหรับ Module ที่จะแสดง ในที่นี้ผมจะเทสเป็น ปุ่ม Action ให้กด นำโค๊ดที่สร้างปุ่มไปใส่ไว้ที่ข้อ 2
แล้วจะได้ดังภาพ ให้เรากด OK (แต่โค้ดปุ่มของผม มีอย่างอื่นด้วยครับเลยดูแปลก ๆ แต่ผมจะมีโค้ดตัวอย่างปุ่มไว้ด้านล่างครับ)
- Selection_999(193).png (34.26 KiB) Viewed 581 times
สามารถเลือกใช้ปุ่มได้เลยครับ แต่ต้องมี script ของ bootstrap นำโค้ด script ไปวางได้เลยครับ โค้ด >>
โค้ด: เลือกทั้งหมด
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
Code: ของปุ่ม
โค้ด: เลือกทั้งหมด
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-secondary">Secondary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>
<button type="button" class="btn btn-link">Link</button>
แล้วมาที่ Content คลิก คอนเท้นที่เราได้สร้างไว้แล้ว มาทดสอบว่า การเพิ่ม Module ในข้อความทำอย่างไร
- Selection_999(199).png (5.04 KiB) Viewed 581 times
ผมจะทดลองวาง Module กลางข้อความ Module ของผมคือ ปุ่ม Action 1 ปุ่มนะครัย
- Selection_999(200).png (184.28 KiB) Viewed 581 times
พอคลิก ที่ Module จะมี Module ต่างๆ ที่เราเคยสร้างไว้มาให้เพิ่มครับ
- Selection_999(201).png (38.85 KiB) Viewed 581 times
พอกดเพิ่ม จะมีโค้ดมาหนึงตัวครับ ว่าเราเรียก id นี้มาใช้งาน
- Selection_999(202).png (29 KiB) Viewed 581 times
หลังจากเราได้เพิ่มไปแล้ว ลองรันดูจะได้ผลลัพธ์ดังนี้ครับ
- Selection_999(203).png (33.39 KiB) Viewed 581 times
