วิธีแทรก Module ลงในบทความ Joomla

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

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

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

วิธีแทรก Module ลงในบทความ Joomla

โพสต์โดย Patipat » 05/07/2019 4:37 pm

การแทรก Module ต่างๆ เข้าไปที่บทวามบนเว็บไซต์ จริงๆ การแทรก Module โมดูล joomla คืออะไร คือรูปแบบแสดงข้อมูลที่แบ่งตาม position ที่ได้ตั้งไว้สามารถกำหนดการแสดงผลต่างๆ ได้ตามตำแหน่งที่เราต้องการ Moodule เป็นส่วนเสริมตัวนึงที่ joomlaใช้ ยกตัวอย่างเช่น เราจะแสดง from login เราก็ต้องสร้าง from module ของ login ขึ้นมาแล้วทำการ set position ว่าเราจะให้ from login แสดงส่วนไหนของหน้าจอ และ ถ้าเรามีบทความอยู่ในหน้า main เราต้องการสร้างและแทรก module ลงไปในบทความเรามาดูวีดีโอนี้กันเลยครับ ในการแทรก Module นี้สามารถแทรกได้ทุก position ของเนื้อหาที่มีอยู่ใน joomla ทั้งหมดเพราะว่าการสร้างโมดูลมาเพื่อให้ ข้อมูลที่จะแสดงมีความสวยงามและเรียบร้อยต่อการแสดงผล เราไม่จำเป็นต้องเขียนโค้ดเพราะ module เป็นฟอร์มสำเร็จรุป สามารถเลือกได้เลยว่า เราต้องการ จะเพิ่ม Menu ส่วนใดบ้าง

วิธีแรกให้เราเข้า ส่วนของหน้า Admin หรือ หลังบ้าน จะได้ดังภาพ
Selection_999(188).png


แล้วกดที่ Extension > Module
Selection_999(189).png
Selection_999(189).png (58.29 KiB) เปิดดู 70 ครั้ง


กด New Module ใหม่
Selection_999(190).png


แล้วเลือก Custom
Selection_999(191).png
Selection_999(191).png (45.48 KiB) เปิดดู 70 ครั้ง


แล้วให้เรามา1. ใส่ Title สำหรับ Module ที่จะแสดง ในที่นี้ผมจะเทสเป็น ปุ่ม Action ให้กด นำโค๊ดที่สร้างปุ่มไปใส่ไว้ที่ข้อ 2
Selection_999(192).png


แล้วจะได้ดังภาพ ให้เรากด OK (แต่โค้ดปุ่มของผม มีอย่างอื่นด้วยครับเลยดูแปลก ๆ แต่ผมจะมีโค้ดตัวอย่างปุ่มไว้ด้านล่างครับ)
Selection_999(193).png
Selection_999(193).png (34.26 KiB) เปิดดู 70 ครั้ง


สามารถเลือกใช้ปุ่มได้เลยครับ แต่ต้องมี 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
Selection_999(199).png (5.04 KiB) เปิดดู 70 ครั้ง


ผมจะทดลองวาง Module กลางข้อความ Module ของผมคือ ปุ่ม Action 1 ปุ่มนะครัย
Selection_999(200).png
Selection_999(200).png (184.28 KiB) เปิดดู 70 ครั้ง


พอคลิก ที่ Module จะมี Module ต่างๆ ที่เราเคยสร้างไว้มาให้เพิ่มครับ
Selection_999(201).png
Selection_999(201).png (38.85 KiB) เปิดดู 70 ครั้ง


พอกดเพิ่ม จะมีโค้ดมาหนึงตัวครับ ว่าเราเรียก id นี้มาใช้งาน
Selection_999(202).png
Selection_999(202).png (29 KiB) เปิดดู 70 ครั้ง


หลังจากเราได้เพิ่มไปแล้ว ลองรันดูจะได้ผลลัพธ์ดังนี้ครับ
Selection_999(203).png
Selection_999(203).png (33.39 KiB) เปิดดู 70 ครั้ง
If you fall, let you stand. :)

  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

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

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

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