อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

HTML Basic
สำหรับนักพัฒนาเว็บไซต์มือใหม่ HTML , CSS และการใช้ Tools ต่างๆ ในการพัฒนาเว็บไซต์

Moderator: mindphp

ภาพประจำตัวสมาชิก
Ittichai_chupol
PHP VIP Members
PHP VIP Members
โพสต์: 5410
ลงทะเบียนเมื่อ: 19/09/2018 10:33 am

อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย Ittichai_chupol »

ผมอยากทราบวิธีการปรับ css ของ html ให้มีความเหมาะสมกับการแชร์ลงไปใน facebook เพื่อให้ตอนที่เเชร์ออกไปบน facebook มีความสวยงาม เนื่องจากปัญหาที่เจอคือ เมือมีการแชร์โพสต์ที่มี ความยาวของเนื้อหามากๆ จะทำให้ส่วนที่แสดงตอนแชร์ facebook ไม่สวยงามคือ มีการหายไปของ ส่วนหัวของโพสต์นั้นๆ และบางทีก็มีการเบี่ยงไปด้านซ้ายจนเกินไป จึงอยากทราบว่าจะมีวิธีการแก้ไข้อย่างไรครับ ดังรูปตัวอย่าง คือเมือโพสต์ เนื้อหามากๆ หรือยาวว จะทำให้ส่วนที่แสดงหัวข้อ กับ ส่วนของผู้โพสต์หายไป ครับ

Selection_999(1475).png
Selection_999(1475).png (167.5 KiB) Viewed 1158 times
แก้ไขล่าสุดโดย Ittichai_chupol เมื่อ 17/06/2019 4:02 pm, แก้ไขไปแล้ว 2 ครั้ง.
ขอให้วันนี้เป็นวันที่ดี
ภาพประจำตัวสมาชิก
mindphp
ผู้ดูแลระบบ MindPHP
ผู้ดูแลระบบ MindPHP
โพสต์: 41251
ลงทะเบียนเมื่อ: 22/09/2008 6:18 pm
ติดต่อ:

Re: อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย mindphp »

ภาพ กับ css คนละเรื่อง กันครับ FB สนใจที่เนื้อหา และ ขนาดไฟล์ภาพ ที่แชร์
ติดตาม VDO: http://www.youtube.com/c/MindphpVideoman
ติดตาม FB: https://www.facebook.com/pages/MindphpC ... 9517401606
หมวดแชร์ความรู้: https://www.mindphp.com/forums/viewforum.php?f=29
รับอบรม และพัฒนาระบบ: https://www.mindphp.com/forums/viewtopic.php?f=6&t=2042
ภาพประจำตัวสมาชิก
Ittichai_chupol
PHP VIP Members
PHP VIP Members
โพสต์: 5410
ลงทะเบียนเมื่อ: 19/09/2018 10:33 am

Re: อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย Ittichai_chupol »

ผมไม่ต้องปรับ ณ ส่วนี้ที่ไฟล์ของ html ใช่ไหมครับ
ขอให้วันนี้เป็นวันที่ดี
ภาพประจำตัวสมาชิก
mindphp
ผู้ดูแลระบบ MindPHP
ผู้ดูแลระบบ MindPHP
โพสต์: 41251
ลงทะเบียนเมื่อ: 22/09/2008 6:18 pm
ติดต่อ:

Re: อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย mindphp »

คำถาม คือต้องการแชร์ ไฟล์ อะไร ต้นฉบับเป็น อย่างไร
ข้อมูลที่ต้องการแชร์ จริงๆ เป็น อะไร ?
ไม่ได้ บอกว่า ไม่ต้องปรับ หรือ ปรับอะไรเพราะ ยังไม่เข้าใจปัญหา ทั้งหมด เพราะ คำถามกับ ภาพที่ยกมา มันเป็นการแชร์ไฟล์ ภาพแต่คำถามที่ถามเรื่อง css

ที่ตอบไปคือ เรื่อง css นั้น facebook ที่มาดึงข้อมูลไปแชร์ เค้าไม่ได้ สนใจ css
เพราะ ฉนั้นถ้าถามว่าปรับ css อย่างไร กับ facebook คำตอบคือไม่เกี่ยวกัน
ติดตาม VDO: http://www.youtube.com/c/MindphpVideoman
ติดตาม FB: https://www.facebook.com/pages/MindphpC ... 9517401606
หมวดแชร์ความรู้: https://www.mindphp.com/forums/viewforum.php?f=29
รับอบรม และพัฒนาระบบ: https://www.mindphp.com/forums/viewtopic.php?f=6&t=2042
ภาพประจำตัวสมาชิก
Ittichai_chupol
PHP VIP Members
PHP VIP Members
โพสต์: 5410
ลงทะเบียนเมื่อ: 19/09/2018 10:33 am

Re: อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย Ittichai_chupol »

- ไฟล์ที่ถูกแชร์ออกไปนั้นจะเป็นรูปรูปภาพครับ
- เพียงแต่การได้มาซึ่งไฟล์รูปภาพนั้น คือ มาจากจาก ไฟล์ html ที่ผ่านการแปลง จาก html มาเป็น รูปภาพครับ
- ซึ่งเมือมีการแชร์โพสต์แล้ว จะมีการดึกข้อมูลโพสต์นั้นไปสร้างเป็น html ก่อน แล้วจะส่ง ไฟล์ html ที่ได้มาแปลงเป็นไฟลืรูปภาพเพื่อให้ facebook มาดึงรูปภาพนั้นไปเป็นรูป
โชว์ตอนแชร์
- แต่ในการแสดงรูปตอนเเชร์นั้น มันติดปัญหาที่ว่า ถ้าหาเนื่อหาของโพสต์นั้น หรือก็คือรูปมันมีความสูงมากเกินไป จะทำให้มีการแสดงผลของภาพที่เเสดงตอนแชร์ ที่ผิด คือ
ด้านส่วนบน กับ ด้านล่าง ของโพสต์มันหายไปครับ

ลิ้งค์ที่ผมใช้ทดสอบ link

- ตัวอย่างไฟล์รูปภาพที่ได้หลังจากการเเปลง html แล้วจะเห็นว่าจะมีส่วนที่แสดงส่วนของหัวข้อโพสต์ กับ ส่วนที่แสดงข้อมูลผู้โพสต์
Selection_999(1485).png
Selection_999(1485).png (100.61 KiB) Viewed 1146 times
ตัวอย่างผลลัพธ์หลังจากที่กดแชร์ แล้ว facebook ดึงรูปภาพไปสแดงกับพบว่า ณ ส่วนหัวข้อโพสต์ กับ ส่วนที่แสดงข้อมูลผู้โพสต์ ไม่มีแสดงมา
Selection_999(1484).png
Selection_999(1484).png (141.12 KiB) Viewed 1146 times

ดังนั้นสิ่งที่ผมอยากทราบก็คือ ถ้าหากต้องการจะปรับเพื่อให้มีการแสดงตอนตอนแชร์ facebook มีการแสดงที่ส่วน ส่วนหัวข้อโพสต์ กับ ส่วนที่แสดงข้อมูลผู้โพสต์ ด้วยจะต้องปรับอย่างไรครับ ที่ตัวแปลง html มาเป็น รูปภาพครับ หรือ ตรงส่วน css ของ html ครับ
ขอให้วันนี้เป็นวันที่ดี
ภาพประจำตัวสมาชิก
mindphp
ผู้ดูแลระบบ MindPHP
ผู้ดูแลระบบ MindPHP
โพสต์: 41251
ลงทะเบียนเมื่อ: 22/09/2008 6:18 pm
ติดต่อ:

Re: อยากทราบวิธีการ สร้าง css เพื่อกำหนดตำแหน่งในการแชร์

โพสต์ที่ยังไม่ได้อ่าน โดย mindphp »

ในแนวทางแบบนี้
ต้องตัดเนื้อหา เพื่อให้ ขนาดภาพ ที่เหมาะสม ที่เอาไปแชร์ ครับ
เช่น ถ้ามีแค่ตัวอักษรก็ ตัดที่ 1 พัน 2พันตัวอักษร
หรือ ถ้ามีภาพ เราก็ดูว่าขนาดภาพที่แชร์นั้น ยาวเท่าไหร่ ถ้ายังยาวไม่เกิดขนาดที่เหมาะสมก็ให้ใช้ ข้อความมาต่อเพิ่มเข้าไป
ติดตาม VDO: http://www.youtube.com/c/MindphpVideoman
ติดตาม FB: https://www.facebook.com/pages/MindphpC ... 9517401606
หมวดแชร์ความรู้: https://www.mindphp.com/forums/viewforum.php?f=29
รับอบรม และพัฒนาระบบ: https://www.mindphp.com/forums/viewtopic.php?f=6&t=2042
ตอบกลับโพส

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

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 88