Những đoạn HTML Social Share (chia sẻ MXH) phổ biến cho Blogger

Anh Trai Nắng
8

Button chia sẻ bài viết lên các trang mạng xã hội là một thành phần không thể thiếu với mỗi template blogspot. Việc bố trí bày biện nó trên website cũng phản ánh rất nhiều con mắt thẩm mĩ của mỗi Blogger. Nhưng trước khi làm điều đó bạn cần có code HTML tự động tạo liên kết valid với từng mạng xã hội.

Những đoạn HTML Social Share (chia sẻ MXH) phổ biến cho Blogger
Những đoạn HTML Social Share (chia sẻ MXH) phổ biến cho Blogger

Bài viết này sẽ chia sẻ tới bạn đọc button share tới các mạng xã hội thông dụng hiện nay gồm

  • Facebook
  • Twitter
  • Pinterest
  • Linkedin
  • VK
  • Yummly
  • Tumblr
  • Buffer
  • Reddit
  • Stumble

Nếu bạn có code các mạng xã hội khác, hãy đóng góp ở mục comment để bài viết được hoàn thiện hơn.

1. Facebook

<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=600, height=400, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank'>Facebook</a>

2. Twitter

<a expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=600, height=400, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank'>Twitter</a>

3. Pinterest

<a expr:href="&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;media=&quot; + data:post.firstImageUrl + &quot;&amp;description=&quot; + data:post.snippet" href="https://www.blogger.com/null" onclick="window.open(this.href, 'windowName', 'width=800, height=600, left=200, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank" title="Share to Pinterest">Pinterest</a>

4. Linkedin

<a expr:href='&quot;http://www.linkedin.com/shareArticle?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank'>Linkedin</a>

5. VK

<a expr:href='&quot;http://vkontakte.ru/share.php?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to VK'>VK</a>

6. Yummly

<a expr:href='&quot;http://www.yummly.com/urb/verify?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to Yummly'>Yummly</a>

7. Tumblr

<a expr:href='&quot;http://www.tumblr.com/share/link?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=550, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to Tumblr'>Tumblr</a>

8. Buffer

<a expr:href='&quot;https://bufferapp.com/add?url=&quot; + data:post.url + &quot;&amp;text=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to Buffer'>Buffer</a>

9. Reddit

<a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to Reddit'>Reddit</a>

10. Stumble

<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=1000, height=700, left=200, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' target='_blank' title='Share to StumbleUpon'>Stumble</a>

Trên đây là code tạo nút chia sẻ bài viết lên mạng xã hội, hoàn toàn bằng HTML, còn việc bố trí, css như nào là do bạn hoàn toàn kiểm soát. Mạng xã hội là 1 thành phần rất quan trọng trong việc SEO website vì vậy bạn nên tạo càng nhiều tương tác với nhiều mạng xã hội càng tốt nhé!

Đăng nhận xét

HƯỚNG DẪN BÌNH LUẬN

8 Nhận xét

Đăng nhận xét

HƯỚNG DẪN BÌNH LUẬN

Chèn link

Sử dụng công cụ Tạo link

Chèn hình ảnh

LINK_ANH - sử dụng công cụ upload ảnh. Và chỉ cần lấy link ảnh chèn vào bình luận là ảnh tự động hiển thị.

Định dạng chữ

<b>Chữ in đậm</b>
<i>Chữ in nghiêng</i>
<u>Chữ gạch chân</u>
<strike>Chữ gạch ngang</strike>

Chèn một đoạn Code

Đầu tiên sử dụng công cụ này để mã hóa đoạn code muốn chèn.
Sau đó dùng thẻ [code] CODE_ĐÃ_MÃ_HÓA [/code]

Khác

Nhập Email bạn hay dùng để nhận thông báo khi mình trả lời bình luận của bạn.
Vui lòng không nhập bất kỳ Liên kết Spam nào trong hộp nhận xét.
Tích vào ô "Thông báo cho tôi" để nhận thông báo nội dung phản hồi của bình luận.
Chèn emoji: Nhấn tổ hợp phím “Windows + . (dấu chấm)”

Đã hiểu