อัตราค่าบริการสอบถามอัตราค่าบริการ

ใส่ Facebook Comment ในหน้าสินค้า

วันนี้ตรวจสอบคีย์เวิดของ statpress เห็นมีคนค้นหามาที่เว็บผมด้วยคีย์เวิดใกล้เคียงกัน เลยขอหยิบยกเอามาเขียนสักหน่อย สำหรับมือใหม่หัดแก้ไขเทมเพลทของ ร้านค้าออนไลน์ ระบบ Opencart ซึ่งวิธีการก็ไม่ยากอะไรครับ

สิ่งที่ต้องมี

1.Facebook Account ซึ่งมีกันทุกคนอยู่แล้ว

2.เครื่องมือในการแก้ไข หรือ Text Editor ดีดีสักตัว ผมใช้ EditPlus หรือถ้าใครขี้เกียจโหลดก็ใช้ NotePad ยาสามัญประจำเครื่องแทนก็ได้

เริ่มการแก้ไข

1.ไปที่ url developers ของ Facebook ครับ หรือเข้าตาม url นี้

http://developers.facebook.com/docs/reference/plugins/comments/

เข้าไปแล้วก้อจะเจอหน้าจอดังรูปครับ

Facebook Comment Opencart
Facebook Comment Opencart

Url to Comment on:ก็ใส่ url ของเว็บเราลงไป
Number Of Posts:คือจำนวนของ comment ที่จะแสดงใน 1 หน้าครับ ถ้ามันเยอะมันก็จะแสดง 2 3 4 ไปเรื่อยๆ
Width: ก็คือความกว้างของกล่องคอมเมนท์
Color Scheme:คือรูปแบบสีของกล่องมี 2 แบบคือ Dark กับ Light
จากนั้นกดปุ่ม Get Code ได้เลยครับ ก็จะได้โค้ดคล้ายๆแบบนี้

Facebook Comment Code
Facebook Comment Code

จากโค้ดเราต้องเอามาปรับอีกนิดครับ


ให้แก้เป็น

ดูตรง data-num-post , data-width เราปรับแต่งตามเหมาะสมได้เลยน่ะครับ

ทำไมถึงต้องแก้ data-href?
คำถามนี้คงเกิดขึ้นกับบางท่าน เหตุผลเพราะว่า เราจะแยกคอมเมน์แต่ละสินค้าได้ ถ้าเราไม่แก้ คอมเมนท์มันจะรวมกันครับ

จากนั้นให้เปิดไฟล์เทมเพลทของ ร้านค้าออนไลน์ ของเรา ซึ่งตามพาทด้านล่างนี้(ขึ้นอยู่กับเทมเพลทที่ใช้งานน่ะครับ)
-catalog/view/theme/ธีมที่ใช้งาน/template/product/product.tpl
หาตำแหน่งที่เหมาะๆ แล้วใส่โค้ดลงไปครับ ต้องใส่ลงไปทั้ง 2 ชุดตามที่ facebook สร้างโค้ดมาให้เลยน่ะครับ
ซึ่งส่วนใหญ่ โค้ดชุดแรก จะใส่ลงไปใน footer.tpl ของเทมเพลทที่ใช้งาน ส่วนโค้ดชุดที่ 2 ก็จะใส่ที่หน้าที่เราต้องการจะแสดงคอมเมนท์นั้นๆครับ ปรับ url ตามใจชอบ
ตัวอย่าง ผมอยากเอาไปใช้ที่หน้า ติดต่อเรา ก็ปรับ url ให้เป็น index.php?route=information/contact เป็นต้น

เราสามารถปรับโค้ดให้เหมาะสมตามโครงสร้างของ url ที่เราเขียนได้ตามความเหมาะสมน่ะครับ ไม่จำเพาะเจาะจงว่าเป็นระบบ ร้านค้าออนไลน์ Opencart โค้ด html หรือ php อันอื่นก็ใส่ลงไปได้ครับ

7 Comments

Add a Comment

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องที่ต้องการถูกทำเครื่องหมาย *

This site uses Akismet to reduce spam. Learn how your comment data is processed.