ไม่ถึง 3 นาทีก็ทำลิงค์แชร์เว็บไป Facebook , Twitter , Google+ , Line แบบง่าย ๆ ได้แล้ว

Ideagital Tech
ideagital
Published in
2 min readDec 25, 2016

การแชร์เป็นช่องทางเผยแพร่เว็บและบทความของเราให้ดังกระฉ่อน ยิ่งถ้ามีคนแชร์ให้เราเยอะ ๆ ยิ่งอาจทำให้เว็บเราติดอันดับดี ๆ บน google นะ ขอบอก สำหรับผู้เริ่มต้นเขียนเว็บไซต์หรือบล็อคที่อยากให้เว็บของเรามีปุ่มแชร์ไป Social ต่าง ๆ แบบนี้

นี่เป็นวิธีที่ง่าย ๆ และไวที่สุด ไม่ถึง 3 นาทีก็ทำเสร็จได้ มาเริ่มกันเลย

เตรียม URL ก่อน

URL อะไรก็ได้ทั้งนั้น แต่ถ้ายาวมากแนะนำให้ก๊อปปี้ URL มาจากช่อง Address Bar ของ Browser มาเลยนะ (แน่นอนละ ใครจะมานั่งพิมพ์) ในตัวอย่างนี้จะเอา URL ของบล็อกนี้มาเลยแล้วกันนะ

https://ideagital.com/blog/howto_make_social_share_url

ได้มาแล้วก็เปลี่ยนสัญลักษณ์ : และ / ให้กลายเป็นแบบ Hex ซึ่งผมได้หามาให้แล้วคือ 3a และ 2f ตามลำดับ เติม % ไปข้างหน้าทั้ง 2 ตัว แล้วก็เปลี่ยนแทนไปใน URL ของเราทีละตัว
เปลี่ยน : เป็น %3a
เปลี่ยน / เป็น %2f

ก็จะได้หน้า URL แบบนี้ ดูยากหน่อยแต่ใช้ได้ชัวร์

https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url

สร้างลิงค์แชร์

สำหรับลิงค์ที่จะใช้แชร์ไป Facebook, Twitter, Google+ และ Line ก็มีหน้าตาแบบนี้

https://www.facebook.com/sharer.php?u=https://twitter.com/share?url=https://plus.google.com/share?url=https://lineit.line.me/share/ui?url=

เติม URL ที่เราเตรียมไว้ต่อท้ายได้เลย (สำหรับ Twitter จะมีให้ใส่ข้อความที่จะทวิตตรง text= ได้เลยนะครับ)

https://www.facebook.com/sharer.php?u=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_urlhttps://twitter.com/share?text=ข้อความที่จะทวิต&url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_urlhttps://plus.google.com/share?url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_urlhttps://lineit.line.me/share/ui?url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url

Code ภาษา HTML สำหรับทำลิงค์

ในตัวอย่างเราจะทำลิงค์แบบง่าย ๆ เป็นลิงค์แบบข้อความธรรมดาตามนี้เลย

<a href=”” tarket=”_blank”>Share on Facebook</a>
<a href=”” tarket=”_blank”>Share on Twitter</a>
<a href=”” tarket=”_blank”>Share on Google+</a>
<a href=”” tarket=”_blank”>Share on Line</a>

แค่ใส่ลิงค์แชร์ของแต่ละ Social ลงไปในช่อง href=”” ให้ตรงกัน ก็เรียบร้อยแล้ว

//ลิงค์แชร์ไป Facebook
<a href=”https://www.facebook.com/sharer.php?u=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url” tarket=”_blank”>Share on Facebook</a>
//ลิงค์แชร์ไป Twitter
<a href=”https://twitter.com/share?url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url&text=ข้อความที่จะทวิต” tarket=”_blank”>Share on Twitter</a>
//ลิงค์แชร์ไป Google+
<a href=”https://plus.google.com/share?url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url” tarket=”_blank”>Share on Google+</a>
//ลิงค์แชร์ไป Line
<a href=”https://lineit.line.me/share/ui?url=https%3A%2F%2Fideagital.com%2Fblog%2Fhowto_make_social_share_url” tarket=”_blank”>Share on Line</a>

ถ้าใครอยากได้เป็นรูปภาพก็เติม Tag <img src=”ที่อยู่รูปภาพ”> แทนที่ข้อความ Share on … ได้เลยนะ
**ถ้าใครถนัดใช้ CSS หรือใช้ Bootstrap อยู่แล้วก็เกร๋ไปอีกแบบน้าา

--

--