การตั้งค่าเมนูหลักและเมนูต่างๆ

suttasilo

การตั้งค่าเมนูหลักและเมนูต่างๆ

1.เมนูต่างๆใน discuz จะประกอบไปด้วย  5ประเภท  ในภาพที่เห็นมี 4

• เมนูหลัก
• เมนูด้านบนสุด
• เมนูด้านล่าง
• เมนูส่วนตัว     หรือเรียกชื่อว่า เมนูเพิ่มเติม หรือ เมนูทางด่วน
• เมนูด้านซ้ายหน้าสเปซ     (ต้องเปิดใช้งานเมนู สเปซก่อนครับ)
  

2.โดยไปที่ control Panel(จัดการระบบ)  รูปแบบ/จัดการเมนูหลัก/เมนูหลัก  เมื่อติดตั้งdiscuz3.2 หน้าปรับแต่งเมนูหลักจะเป็นดังภาพนี้

3.ก่อนอื่นเราไปเพิ่มฟังชั่นในโมดูลก่อน ซึ่งในฟังชั่นนี้จะมีเมนูเพิ่มเติมอีกมากเมื่อเราเปิดใช้งาน  โดยไปที่ ทั่วไป/ฟังชั่นการทำงาน/ฟังชั่นในโมดูล คลิกเลือกเปิดให้หมด  โมดูลบางตัวจะมีเลือกเปิดใช้งานได้ 2 ที่  บางตัวเลือกเปิดใช้งานได้ที่เดียว   เลือกตามชอบใจครับ

4.เสร็จแล้วไปที่  รูปแบบ/จัดการเมนูหลัก/เมนูหลัก  ทำตามรูป คลิกเปิดใช้งานบางตัวที่ปิดอยู่เช่น สเปซ เป็นต้น  สามารถเพิ่มเมนูหลักเพิ่มเติมได้โดยคลิกที่ปุ่มเพิ่มเมนูหลัก แล้วคลิกปุ่มตกลง

5.เราจะได้ปุ่มเมนูหลักดังในภาพ

6.การสร้างเมนูย่อย สมมติในที่นี้จะเพิ่มเมนูหลักอีกอันคือ เฟสบุ๊คและให้มีเมนูย่อยของเฟสบุ๊คด้วย ให้คลิกที่ปุ่มเพิ่มเมนูหลัก

7.พิมพ์ชื่อเมนู เฟสบุ๊ค ใส่ลิงค์ คลิกเปิดใช้งาน แล้วปุ่มตกลง

8.ทำการเพิ่มเมนูย่อยตามต้องการ พิมพ์ชื่อและลำดับที่เมนูย่อย  ใส่ลิงค์ แล้วคลิกปุ่มตกลง

9.คลิกที่ช่องเปิดใช้งาน คลิกปุ่มตกลง  ในกรณีที่ต้องการแก้ไข เช่นให้เมนูย่อยเมื่อคลิกแล้วเปิดหน้าต่างใหม่ หรือเปลี่ยนสีตัวอักษรเมนูย่อยให้คลิกที่ปุ่มแก้ไข

10.ทำการแก้ไขตามต้องการ  แล้วคลิกปุ่มตกลง

11.เราจะได้เมนูเฟสบุ๊คที่มีเมนูย่อยห้อยลงมา 4 เมนูดังภาพ

12.วิธีทำเมนูหลัก ให้มีสีสันกันครับ  เครดิตจากท่าน @lahu  http://www.discuzthai.com/forum. ... highlight=hot%2Bnew
ก่อนอื่นอัพโหลดไฟล์  , ขึ้นโฮสต์โฟลเดอร์ images ถ้าไม่มีสร้างขึ้นใหม่ได้เลย

13.เปิด  template\สกินที่ใช้อยู่\common\header.html
ค้นหา

1. <divid="nv">

คัดลอกไปที่คลิปบอร์ด

14.เพิ่มโค้ดนี้ต่อ

1. <imgsrc="images/ghot.gif"style="position:absolute;z-index:1001;margin-left:197px;margin-top:-3px;">
   
2. <img src="images/gnew.gif"style="position:absolute;z-index:1001;margin-left:527px;margin-top:-3px;">

คัดลอกไปที่คลิปบอร์ด

15.ผลที่ได้ดังรูป ทำให้เมนูมีสีสันขึ้น

16.ปรับตำแหน่งรูป ให้แก้ไขตัวเลข ต้องการ เช่น เปลี่ยนจาก 527pxเป็น 327  และสามารถแก้ไขที่เลข 197เพื่อเปลี่ยนตำแหน่งได้ด้วย

1. margin-left:  527px

คัดลอกไปที่คลิปบอร์ด

เปลี่ยนเป็น

1. margin-left:  327px

คัดลอกไปที่คลิปบอร์ด

17.ผลลัพธ์ที่ได้จะเปลี่ยนตำแหน่งทันทีดังรูป

18.เมนูด้านบนสุด สามารถปรับแต่งโดยคลิกที่ปุ่ม เพิ่มเมนูด้านบน

19.ใส่ชื่อเมนู, ลิงค์, คลิกเปิดใช้งาน,หากต้องการแก้ไขเพิ่มเติมคลิกที่ปุ่มแก้ไข

20.เมนูด้านล่าง สามารถปรับแต่งโดยคลิกที่ปุ่ม เพิ่มเมนูด้านล่าง

21.ใส่ชื่อเมนู, ลิงค์, คลิกเปิดใช้งาน,หากต้องการแก้ไขเพิ่มเติมคลิกที่ปุ่มแก้ไข

22.คลิกที่ เมนูส่วนตัว (หรือเรียกชื่อว่า เมนูเพิ่มเติม หรือเมนูทางด่วน) เปิดใช้งานเมนูเพิ่มอีก 3 เมนู

23.คลิกที่ปุ่มเมนูเพิ่มเติม เราได้ปุ่มเมนูส่วนตัว(หรือเรียกชื่อว่า เมนูเพิ่มเติม หรือ เมนูทางด่วน)  ดังภาพ

24.แก้ไขเพิ่มเติมครับ คลิกที่เมนูด้านซ้ายหน้าสเปซ คลิกที่เพิ่มเมนูด้านซ้ายหน้าสเปซเพิ่มเส้นคั่นเมนู,  คลิกที่ปุ่มแก้ไขปรับแต่งได้ตามต้องการแล้วคลิกปุ่มตกลง

25.คลิกที่เมนูหลักสเปซ  จะได้เมนูด้านซ้ายหน้าสเปซ ดังรูป

26.หากใครคลิกแล้วเป็นแบบนี้ไม่ต้องตกใจนี่เป็นค่าเบื้องต้นเมื่อเราติดตั้งdiscuz ใหม่ มันจะแสดงค่า  Forum modulestyle  เราสามารถไปปรับแต่งใหม่ได้

27.ไปที่  รูปแบบ/จัดการรูปแบบ/ทั่วไป/ตั้งค่าเป็นSNS module style และ Personalized DIY style ดังรูป แล้วคลิกตกลง

28.การปรับแต่งเมนูต่างๆก็เสร็จสิ้นพร้อมใช้งาน  ค่าต่างๆนี้เป็นการตั้งค่า เบื้องต้น  ท่านสามารถไปปรับแต่งเพิ่มเติมได้เองตามต้องการครับ

ศึกษารายละเอียดจากวีดีโอด้านล่าง

บทบันทึกการสอน "โครงการคอมพิวเตอร์สมองกลเสริมเยาวชนยุคIT"ชมรมรักพลับพลึงธารคุระบุรีศรีพังงา (pptflower.com)