วิธีการทำ Readmore หรือปุ่มอ่านเพิ่มเติม

คู่มือ แชร์วิธีใช้งาน Joomla ทุกเวอร์ชั่น ตั้งแต่ การติดต้้งและใช้งานต่างๆ

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

Auttasti
PHP Sr. Member
PHP Sr. Member
โพสต์: 86
ลงทะเบียนเมื่อ: 30/07/2019 10:08 am

วิธีการทำ Readmore หรือปุ่มอ่านเพิ่มเติม

โพสต์โดย Auttasti » 02/08/2019 5:17 pm

การทำ Readmore หรือการทำปุ่มเพื่อกดอ่านบทความทั้งหมดในบทความน้น ๆ
การทำ Readmore เป็นตัวช่วยที่ทำให้เราบริหารจัดการพื้นที่ของบทความได้ดีขึ้น ใช้สำหรับบทความที่มีเนื้อหาค่อนข้างมาก หรือเป็นบนความที่แสดงอยู่บนหน้าเว็บ แต่หน้าเว็บมีพี่ที่ไม่พอกับบทความนั้น ๆ การทำ Readmore จึงเป็นวิธีที่ดีที่จะช่วยในการจัดการบริหารบทความและความสวยงานของบทความที่ขึ้นหน้าเว็บ
และก่อนที่เราจะทำ Readmore นั้น เราจะต้องรู้จักการสร้างบทความก่อน
ใครที่ยังสร้างบทความไม่เป็น สามารถศึกษาเพิ่มเติมได้ที่ https://www.youtube.com/watch?v=_i9TSxZ ... I&index=22

วิธีการทำ Readmore

ขั้นตอนแรกให้เราเข้า Joomla ในส่วนของ Admin เมื่อเข้ามาแล้วให้สังเกตคำว่า "Content"

Readmore 1.png
Readmore 1.png (86.36 KiB) เปิดดู 95 ครั้ง


ทำการคลิกที่ "Content" >> "Articles" >> "Add New Articles"

Readmore-2.png
Readmore-2.png (24.89 KiB) เปิดดู 95 ครั้ง


เมื่อคลิกเข้ามาแล้ว จะเป็นในส่วนที่เราจะต้องใส่เนื้อหา จะมีทั้งหมด 3 ส่วน

Readmore-3.png
Readmore-3.png (42.7 KiB) เปิดดู 95 ครั้ง


ส่วนแรก ให้ทำการตั้งชื่อ "Title" และ "Alias" ตามที่เราต้องการ แต่ในช่องของ "Alias" เราจะใส่หรือไม่ใส่ก็ได้ ถ้าเราไม่ใส่ โปรแกรมจะใส่ให้เราอัตโนมัส

Readmore-4.png
Readmore-4.png (9.86 KiB) เปิดดู 95 ครั้ง


ส่วนที่สอง ให้เราใส่เนื้อหาของเราลงไป จนคิดว่าเนื้อหายาวมากแล้ว ให้เราทำการหยุดใส่ข้อความ แล้วคลิกที่ปุ่ม "Read More" ในแท็บเครื่อง

Readmore-5.png
Readmore-5.png (38.74 KiB) เปิดดู 95 ครั้ง


จะสังเกตเห็นได้ว่า มีเส้นปะสีแดงขึ้นมากั้นเนื้อหาเรา ให้เราทำการใส่เนื้อหาที่เหลือ ต่อจากเส้นปะสีแดงได้เลย

Readmore-6.png
Readmore-6.png (86.18 KiB) เปิดดู 95 ครั้ง


เมื่อใส่เนื้อหาเสร็จเรียบร้อยแล้วให้เรามาเซ็ตค่าในด้านขวา
ในส่วนของ "Status" ให้เราทำการตั้งเป็น "Published" เพื่อเป็นการเซ็ตให้เนื้อหาหรือบทความของเรานี้ได้ทำการ ออนไลน์
ในส่วนของ "Category" เป็นการเลือกหมวดหมู่ ว่าจะให้บทความนี้อยู่ในหมวดหมู่ไหน หรือเราจะไม่เลือกก็ได้
ในส่วนของ "Featured" เป็นการกำหนดว่าให้เนื้อหาหรือบทความนี้เป็นบทความแนะนำหรือไม่ ในที่นี้ผมจะเลือก "Yes" เพื่อที่จะแสดงผลออกมาให้ดูกันเลยนะครับ
ในส่วนของ "Access" ให้เรากำหนดสิทธิ ในการเข้าถึงเนื้อหาหรือบทความนี้ว่าใครที่มีสิทธิเข้าถึงเนื้อหาหรือบทความนี้ได้ หรือจะให้สามารถเข้าถึงได้ทั้งหมด
ในส่วนของ "Language" เป็นการให้เราตั้งค่าภาษา ซึ่งในส่วนนี้แนะนำให้ตั้งเป็น "All" ซึ่งถ้าเราไม่ทำการเลือกทั้งหมด เว็บเราก็จะรับรองแค่ภาษาที่เราเลือกส่วนภาษาที่เราไม่ได้เลือกจะไม่รับรองนั้นเองครับและเมื่อเซ็ตค่าทุกอย่างแล้ว ให้ทำการ "Seve & Close" ได้เลยครับ

Readmore-7.png
Readmore-7.png (12.4 KiB) เปิดดู 95 ครั้ง


เมื่อเราเข้าไปดูหน้าเว็บก็จะเห็นเนื้อหาหรือบทความแต่จะขึ้นมาแค่ส่วนที่อยู่ก่อนเส้นปะสี่แดงเท่านั้น และจะมีปุ่มคำว่า "Read More บทนำ"

Readmore-8.png
Readmore-8.png (123.51 KiB) เปิดดู 95 ครั้ง


ให้เราทำการคลิกที่ปุ่ม "Read More บทนำ" มันก็จะแสดงเนื้อหาของเราทั้งหมดออกมา

Readmore-9.png
Readmore-9.png (162.05 KiB) เปิดดู 95 ครั้ง


เป็นการเสร็จสิ้นในการทำปุ่ม "Read More"

ก็เสร็จเป็นที่เรียบร้อยกับการทำ Readmore หรือการทำปุ่มอ่านข้อความเพิ่มเติม
สามารถศึกษาเพิ่มเติมได้ที่ https://www.youtube.com/watch?v=bbffrqL ... I&index=17
แก้ไขล่าสุดโดย Auttasti เมื่อ 14/08/2019 11:10 am, แก้ไขไปแล้ว 4 ครั้ง.

pipoipi
PHP Newbie
PHP Newbie
โพสต์: 4
ลงทะเบียนเมื่อ: 02/08/2019 11:01 pm

Re: การทำ Readmore

โพสต์โดย pipoipi » 02/08/2019 11:25 pm

เจ๋งๆ ทำแบบนี้ได้ด้วย

ใส่ vdo ลงในนี้ได้เปล่า

Auttasti
PHP Sr. Member
PHP Sr. Member
โพสต์: 86
ลงทะเบียนเมื่อ: 30/07/2019 10:08 am

Re: การทำ Readmore

โพสต์โดย Auttasti » 05/08/2019 9:55 am

ขอบคุณครับ ยังเใส่ไม่เป็นครับ เดี๋ยวผมจะตั้งกระทู้ถามแล้วใส่เป็น Video ให้นะครับ


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

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

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