หน้า 1 จากทั้งหมด 1

วิธีใช้งาน Breadcrumbs ของ Joomla แบบละเอียด

โพสต์แล้ว: 07/01/2017 1:55 pm
โดย AePongsak

Breadcrumbs
เป็น Module Joomla สำหรับบอกเส้นทางและบอกตำแหน่งปัจจุบันของผู้ใช้บนหน้าเว็บไซต์ สามารถคลิกย้อนกลับไปยังหน้าเดิมได้
ตัอวย่าง คุณอยู่ที่: » หน้าแรก » เมนู หน้าที่ 2 จะมีลิงค์กลับไปที่ หมวดหลักของแต่ละลิงค์ หรือออกไปที่หน้าหลักของเว็บ

ขั้นตอนที่ 1:
Mod Breadcrumbs สำหรับบอกเส้นทางและบอกตำแหน่งปัจจุบัน เข้าหน้า Modules
เลือกที่ Extensions > Modules
1.png
1.png (53.74 KiB) เปิดดู 1756 ครั้ง

ขั้นตอนที่ 2: เมื่อติดตั้งโมดูล Breadcrumbs แล้ว จะแสดงรายละเอียดต่างๆ เช่น สถานะ ชื่อโมดูล ตำแหน่ง
2.png
2.png (36.38 KiB) เปิดดู 1756 ครั้ง

ขั้นตอนที่ 3: ส่วนต่างๆในการกำหนด Breadcrumbs แบ่งเป็น 4 เมนู Module, Menu Assignment Module Permissions, Advanced
- Title ชื่อที่แสดงหน้าเว็บ
- เมนูต่างๆ สำหรับกำหนดการตั้งค่า
- Show "You are here" เปิด-ปิด คำแจ้งตำแหน่ง คุณอยู่ที่
- Show Home เปิด - ปิด แสดงคำหน้าแรก
- Text for Home Entry กำหนดคำแทน หน้าแรก
- Show Last เปิด - ปิด คำต่อท้ายลิ้ง
- Text Separator กำหนดคำต่อท้ายลิ้ง
3.png
3.png (49.48 KiB) เปิดดู 1756 ครั้ง

ตัวอย่าง การแสดง Breadcrumbs หน้าเว็บ
4.png
4.png (28.86 KiB) เปิดดู 1756 ครั้ง

3.1 การกำหนด Title ชื่อที่แสดงหน้าเว็บ และส่วนแสดงผลหน้าเว็บ
ส่วน Control Panel
5.png
5.png (24.35 KiB) เปิดดู 1756 ครั้ง

ส่วนแสดงหน้าเว็บไซต์
6.png
6.png (28.09 KiB) เปิดดู 1756 ครั้ง

3.2 การกำหนด Show "You are here" ชื่อที่แสดงหน้าเว็บ และส่วนแสดงผลหน้าเว็บ
ส่วน Control Panel
7.png
7.png (26.08 KiB) เปิดดู 1756 ครั้ง

ส่วนแสดงหน้าเว็บไซต์
8.png
8.png (30.07 KiB) เปิดดู 1756 ครั้ง

ปิดการใช้งาน
9.png
9.png (19.12 KiB) เปิดดู 1756 ครั้ง

3.3 การกำหนด Show Home ชื่อที่แสดงหน้าเว็บ และส่วนแสดงผลหน้าเว็บ
ส่วน Control Panel เลือก Yes จะแสดงช่องให้กำหนด
10.png
10.png (27.25 KiB) เปิดดู 1756 ครั้ง

ส่วนแสดงหน้าเว็บไซต์
11.png
11.png (28.58 KiB) เปิดดู 1756 ครั้ง

เลือก No จะไม่แสดงช่องให้กำหนด
12.png
12.png (24.44 KiB) เปิดดู 1756 ครั้ง

3.4 การกำหนด Show Last ชื่อที่แสดงหน้าเว็บ และส่วนแสดงผลหน้าเว็บ
ส่วน Control Panel เลือก Yes จะแสดงช่องให้กำหนด
13.png
13.png (27.52 KiB) เปิดดู 1756 ครั้ง

ส่วนแสดงหน้าเว็บไซต์
14.png
14.png (28.53 KiB) เปิดดู 1756 ครั้ง

ขั้นตอนที่ 4: การตั้งค่า Menu Assignment คือการตั้งค่าโมดูลแสดงในหน้าเว็บไหนบ้าง
เลือก On all pages เพื่อกำหนดให้โมดูลนี้แสดงทุกหน้าเว็บ
15.png
15.png (35.67 KiB) เปิดดู 1756 ครั้ง

ขั้นตอนที่ 5: การตั้งค่า Module Permissions คือการตั้งค่ากำหนดสิทธิ์ในการใช้โมดูล
ขั้นตอนที่ 6: การตั้งค่า Advanced คือการกำหนดการแสดงผลของโมดูล เช่น ปรับขนาด Header