Cách thiết lập nút chia sẻ bài viết lên Twitter hiển thị đầy đủ nội dung

Twitter là mạng xã hội lớn, rất phổ biến chỉ đứng sau Facebook cho nên nếu bạn có lượng người theo dõi nhiều bạn cũng lấy được lượng traffic đáng kể từ mạng xã hội này. Chia sẻ bài viết lên Twitter rất dễ nhưng để cấu hình hiển thị được đầy đủ nội dung của một tweet lại không phải chuyện dễ nhưng bạn có thể làm được theo thủ thuật này của mình.

Tác dụng khi chia sẻ một tweet hiển thị đầy đủ giúp người đọc xem trước tóm tắt nội dung và mô tả bài viết, ngoài ra còn nhìn thấy kích thước ảnh lớn nên cơ hội click vào liên kết cao hơn.

Nội dung hiển thị đầy đủ của một Tweet bao gồm:

• Tóm tắt
• Ảnh lớn
• Tiêu đề
• Mô tả
• Liên kết URL

Cách cấu hình bao gồm các bước sau:

1. Cấu hình nút chia sẻ

Chèn đoạn code chia sẻ trong template

Copy

<a expr:href="&quot;https://twitter.com/intent/tweet?url=&quot; + data:blog.url.canonical + &quot;&amp;text=&quot; + data:post.snippet" target="_blank" rel="nofollow" title="Chia sẻ với Twitter">Chia sẻ với Twitter</a>

Nếu widget Blog1 version 2 thay data:post.snippet thành data:post.snippets.short

2. Cấu hình thẻ meta open graph

+ Thêm đoạn prefix='og: http://ogp.me/ns#' ngay trong thẻ <html...> của template

+ Thêm các thẻ meta open graph

Copy

<meta content='summary_large_image' name='twitter:card'/>

<meta content='' name='twitter:site'/>

<meta content='' name='twitter:creator'/>

<meta content='' property='og:title'/>

<meta content='' property='og:description'/>

<meta content='' property='og:url'/>

<meta content='' property='og:image'/>

Đọc thêm:

• Cách tạo URL chia sẻ bài viết lên các trang mạng xã hội
• Các bước thêm thẻ meta đầy đủ, chính xác và không bị trùng lặp
• Cách thêm thẻ meta chia sẻ ảnh đầy đủ chính xác

Ví dụ về thẻ meta của bài viết này

Copy

<meta content='summary_large_image' name='twitter:card'/>

<meta content='Việt Blogger' name='twitter:site'/>

<meta content='@vietblogdao' name='twitter:creator'/>

<meta content='Cách thiết lập nút chia sẻ bài viết lên Twitter hiển thị đầy đủ nội dung - Việt Blogger' property='og:title'/>

<meta content='Tác dụng khi chia sẻ một tweet hiển thị đầy đủ giúp người đọc xem trước tóm tắt nội dung và mô tả bài viết, ngoài ra còn nhìn thấy kích thước ảnh lớn nên cơ hội click vào liên kết cao hơn.' property='og:description'/>

<meta content='https://www.vietblogdao.com/2018/11/cach-thiet-lap-nut-chia-se-bai-viet-len-twitter-hien-thi-day-du-noi-dung.html' property='og:url'/>

<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM3YnglaaJlkw4LlsBJlNHMCWL2UcC8UCQpFjXBDh9aetFSwlOWxHBbXOJED4CEAOV3ueioy8hm5kP01hzEo41bX7boYouDwXHg6kK_IKbV8id1j7hVqqGKO-8ytrZho8lkoNlghhROXKn/w1200-h630-p-k-no-nu/twitter-card-validator.png' property='og:image'/>

Chia sẻ với Twitter

3. Xem trước liên kết chia sẻ

Truy cập trang Card validator thêm URL bài viết chọn preview card. Mẹo: các bạn có thể preview các URL của bài viết đã chia sẻ trước đây, Twitter sẽ tự động cập nhật lại các tweet của bạn.

Nội dung chính