วิธีปรับแต่งหน้าพอร์ทัลdiscuzX3.2-X3.5
แก้ไขครั้งสุดท้ายโดย suttasilo เมื่อ 2020-5-24 15:38วิธีปรับแต่งหน้าพอร์ทัลdiscuzX3.2-X3.5 discuz X3.2-3.5 จะมีแม่แบบหน้าพอร์ทัลมากับระบบอยู่ 2 แบบดังนี้
1.portal_index.xml
2.portal_topic มี 4 สี
portal_topic_blue.xml (แม่แบบสีน้ำเงิน)
portal_topic_green.xml(แม่แบบสีเขียว)
portal_topic_grey.xml (แม่แบบสีเทา)
portal_topic_red.xml (แม่แบบสีแดง)
ก่อนอื่นแม่แบบหน้าพอร์ทัลยังเป็นหน้าเปล่าๆไม่สามารถใช้งานได้ต้องเปิดใช้งานก่อนแล้วจึงใช้วิธีนำเข้าทาง DIY ซึ่งจะอธิบายขั้นตอนต่อไป วิธีเปิดใช้งานดังนี้ ไปที่จัดการระบบ/ทั่วไป/ฟังชั่นการทำงาน/ฟังชั่นโมดูล/พอร์ทัล คลิกเปิด/ติกถูกเมนูนำทางหน้าหลักและเมนูทางด่วน/ตกลงดังรูปภาพ
ในที่นี้จะแสดงวิธีการปรับแต่งแม่แบบportal_topic_blue.xmlมาให้ดูเป็นตัวอย่างดังนี้
1.คลิกที่เมนูพอร์ทัลคลิกที่ DIYคลิกเลือกขั้นสูง(หากเมนูพอร์ทัลยังไม่ถูกเปิดใช้งานให้ดูวิธีเปิดที่กระทู้ การตั้งค่าเมนูหลักและเมนูต่างๆ)
2.คลิกที่บันทึก คลิกนำเข้า
3.คลิกที่เลือกไฟล์
4.คลิกที่ template/default/portal/dyxml/เลือก portal_topic_blue.xml แล้วคลิก open
5.คลิกที่นำเข้า
6.คลิกที่ตกลง
7.คลิกที่แก้ไข/ แก้ไข
8.ทำการแก้ไขเมนูชื่อไฟล์ภาษาจีนและใส่ลิงค์จากนั้นคลิกที่ยืนยัน
ตัวอย่างโค้ดที่แก้ไข
<div class="t_nav">
<a href="forum.php?mod=viewthread&tid=6&extra=page%3D1">โครงการสร้างฝายชะลอน้ำอนุรักษ์พลับพลึงธาร </a><span class="pipe">|</span>
<a href="forum.php?mod=viewthread&tid=4&extra=page%3D1">พลับพลึงธารพืชหนึ่งเดียวในโลก</a><span
class="pipe">|</span>
<a href="forum.php?mod=viewthread&tid=11&extra=page%3D1">สารคดีเกี่ยวกับพลับพลึงธาร</a><span
class="pipe">|</span>
<a href="forum.php?mod=viewthread&tid=8&extra=page%3D1">นักอนุรักษ์พลับพลึงธาร</a>
</div>
9.ผลลัพธ์ที่ได้
10.คลิกที่แก้ไข/ คลิกที่ชื่อ
11.คลิกแก้ไขชื่อเฟรมภาษาจีนเป็น กระทู้ล่าสุดแล้วคลิกที่ ตกลง
12.ผลลัพธ์ที่ได้
13.คลิกที่แก้ไข/ แก้ไข
14.คลิกปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
15.คลิกที่แก้ไข/ แก้ไข
16.แก้ไขชื่อเฟรมภาษาจีนเป็น น่าสนใจแล้วคลิกที่ ตกลง
17.ผลลัพธ์ที่ได้
18.คลิกที่แก้ไข/ แก้ไข
19.คลิกที่เทมเพลทโมดูล
20.แก้โค้ดรูปภาพไม่ขึ้นและใส่ลิงค์แล้วคลิกที่อัปเดท
ตัวอย่างโค้ดที่แก้ไข
<a href="http://localhost/dz5"{target}><img src="{avatar}" width="48" height="48" alt="{title}"
21.ผลลัพธ์ที่ได้
22.คลิกที่แก้ไข/ แก้ไข
23.คลิกปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
24.คลิกที่แก้ไข/ คลิกที่ชื่อ
25.คลิกแก้ไขชื่อเฟรมภาษาจีนเป็น ยอดนิยมแล้วคลิกที่ ตกลง
26.ผลลัพธ์ที่ได้
27.คลิกที่แก้ไข/ แก้ไข
28.ปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
29.คลิกที่แก้ไข/ คลิกที่ชื่อ
30.แก้ไขชื่อเฟรมภาษาจีนเป็น เพิ่มเติมแล้วใส่ลิงค์ , แก้ไขชื่อเฟรมภาษาจีนเป็น ชมรมรักพลับพลึงธารคุะบุรีฯแล้วคลิกที่ ตกลง
31.ผลลัพธ์ที่ได้
32.คลิกที่แก้ไข/ แก้ไข
33.ปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
34.คลิกที่แก้ไข/ คลิกที่ชื่อ
35.แก้ไขชื่อเฟรมภาษาจีนเป็น เพิ่มเติมแล้วใส่ลิงค์ , แก้ไขชื่อเฟรมภาษาจีนเป็น เรียนรู้ทำเว็บdiscuzแล้วคลิกที่ ตกลง
36.ผลลัพธ์ที่ได้
37.คลิกที่แก้ไข/ แก้ไข
38.ปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
39.คลิกที่แก้ไข/ คลิกที่ชื่อ
40.แก้ไขชื่อเฟรมภาษาจีนเป็น เพิ่มเติมแล้วใส่ลิงค์ , แก้ไขชื่อเฟรมภาษาจีนเป็น ชมรมรักภาพถ่ายรักธรรมชาติคุระบุรีแล้วคลิกที่ ตกลง
41.ผลลัพธ์ที่ได้
42.คลิกที่แก้ไข/ แก้ไข
43.ปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
44.คลิกที่แก้ไข/ คลิกที่ชื่อ
45.แก้ไขชื่อเฟรมภาษาจีนเป็นเพิ่มเติม แล้วใส่ลิงค์ (https://www.youtube.com/user/suttasilo) , แก้ไขชื่อเฟรมภาษาจีนเป็น วีดีโอ แล้วคลิกที่ตกลง
46.คลิกที่แก้ไข/ แก้ไข
47.ช่องที่อยู่ URL วิดีโอใส่ลิงค์วีดีโอที่เราต้องการแสดง (https://www.youtube.com/watch?v=AVpFPLCbT5g)แล้วคลิกที่ยืนยัน
48.คลิกที่แก้ไข/ คลิกที่ชื่อ
49.แก้ไขชื่อเฟรมภาษาจีนเป็น บล็อกและบทความแล้วคลิกที่ ตกลง
50.คลิกที่แก้ไข/ แก้ไข
51.ปรับแต่งค่าตามต้องการ แล้วคลิกที่ยืนยัน
52.คลิกที่แก้ไข/ แก้ไข
53.คลิกปรับเปลี่ยนเป็นบทความแล้วคลิกที่ยืนยัน
54.คลิกที่บันทึกfile:///C:/Users/BCB7~1/AppData/Local/Temp/msohtml1/01/clip_image108.jpg
55.ผลลัพธ์ที่ได้
56.เปลี่ยนรูปภาพโลโก้ โดยสร้างไฟล์ภาพด้วย photoshop save ไฟล์ ชื่อ banner.jpg แล้วอัพไปทับไฟล์เดิมที่โฟลเดอร์static/topic/images/blue/ทับไฟล์เดิม banner.jpgผลลัพธ์ที่ได้
57.ต้องการลบหน้าพอร์ทัลไปคลิกที่เมนูพอร์ทัลคลิกที่ DIY คลิกเลือก ล้างทั้งหมด
58.แล้วคลิกที่ตกลง
59.คลิกที่บันทึก
60.ผลลัพธ์ที่ได้
61.การปรับแต่งหน้าพอร์ทัลก็เสร็จสิ้นเพียงเท่านี้ท่านสามารถนำไปปรับ ประยุกต์ใช้เพิ่มเติม ปรับแต่งแม่แบบ portal_index.xmlที่มามาในระบบได้เอง นอกจากตัวอย่างที่ยกมาดังกล่าวแล้ว62. ใครขี้เกียจก็นำตัวที่แปลเสร็จเรียบร้อยแล้วดาวน์โหลด**** Hidden Message *****ศึกษารายละเอียดวิธีการทำได้ที่วีดีโอด้านล่าง
https://www.youtube.com/watch?v=rzgHAzbjWbQ
เพิ่มเติมกรณีที่มีการติดตั้งแม่แบบอื่น และมี DIY หน้าพอร์ทัลด้วยวิธีนำเข้า
คลิกที่หน้าพอร์ทัล ไปคลิกที่ DIY เลือกขั้นสูง ทำตามขั้นตอนเหมือนข้อ 1-6
หมายเหตุ.- สำหรับการปรับแต่ง DIY หน้าหน้าพอร์ทัลหากมีเวลาจะมาแนะนำทีหลัง ขอทดสอบหน่อยครับ ขอบคุณครับขอลองไปทำบร์อดดูหน่อย
หน้า:
[1]