Thẻ meta Twitter trong HTML

Thẻ meta Twitter trong HTML

Để có URL trang web hiển thị chính xác trong thẻ Twitter, một số thẻ meta bổ sung là cần thiết, với trình xử lý của nhà xuất bản, tiêu đề trang, mô tả nội dung tối đa 200 ký tự, xử lý nội dung người sáng tạo và hình ảnh, lớn hơn 120x120 pixel.

Thẻ meta SEO SEO trong HTML

Các thẻ meta sau phải được sử dụng, với mẫu bên dưới có thể được sao chép và dán.

Thẻ này chỉ dành cho thẻ Twitter và thẻ meta trong HTML sẽ được dán trong phần đầu của mã:

<!-- Twitter card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@Twitter_publisher" /> <meta name="twitter:title" content="Page title" /> <meta name="twitter:description" content="Page description" /> <meta name="twitter:creator" content="@Twitter_creator" /> <!-- Twitter 280x150px image --> <meta name="twitter:image:src" content="http://www.url.com/img.jpg" />

Biểu đồ mở của Twitter

Để có toàn bộ thông số thẻ trang web của Twitter, bao gồm thẻ meta thẻ Twitter và thẻ meta biểu đồ mở của Facebook, bạn có thể sử dụng toàn bộ mã bên dưới.

Điều này sẽ bao gồm tất cả thẻ HTML dữ liệu meta medias xã hội và cho phép chia sẻ đúng URL của bạn trên tất cả các thẻ đó:

<!DOCTYPE html> <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en" prefix="fb: http://www.facebook.com/2008/fbml"> <head> <title>60 char title</title> <meta name="description" content="200 char description" /> <!-- Twitter card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@Twitter_publisher" /> <meta name="twitter:title" content="Page title" /> <meta name="twitter:description" content="Page description" /> <meta name="twitter:creator" content="@Twitter_creator" /> <!-- Twitter 280x150px image --> <meta name="twitter:image:src" content="http://www.url.com/img.jpg" /> <!-- Open graph Facebook card --> <meta property="og:url" content="https://www.url.com/"/> <meta property="og:type" content="website/article/..."/> <meta property="og:locale" content="en-US" /> <meta property="og:site_name" content="Site name" /> <meta property="og:image" content="http://www.url.com/img.jpg" /> <meta property="og:title" content="60 char title"/> <meta property="og:description" content="Page description" /> <meta property="article:published_time" content="2018-11-06 11:32:39" /> <meta property="article:modified_time" content="2018-11-06 11:32:39" /> <meta property="article:section" content="Section" /> <!-- Schema.org markup for Google+ --> <meta itemprop="name" content="Site name"> <meta itemprop="description" content="Page description"> <meta itemprop="image" content="http://www.url.com/img.jpg">

Thẻ meta thẻ Twitter

Khi siêu dữ liệu Twitter đã được triển khai trên trang web, việc chia sẻ chúng sẽ tạo ra giao diện bên dưới, vì tiêu đề, hình ảnh và mô tả sẽ được Twitter truy lục đúng cách.

Trình xác thực thẻ Twitter

Một ứng dụng trực tuyến cho các nhà phát triển có sẵn trên trang web Twitter, và cho phép người devlopers tự kiểm tra nếu thẻ rich có thẻ meta được triển khai đúng trên trang web của họ.

Chỉ cần mở trang web, dán URL trong đó thẻ rich của Twitter sẽ xuất hiện và xem kết quả hoặc lỗi tiềm ẩn trong trường hợp thẻ được triển khai sai.

Trình xác thực thẻ Nhà phát triển Twitter

Kích thước hình ảnh bài đăng trên Twitter

Hình ảnh được đăng trong một bài đăng trên Twitter phải có chiều rộng tối thiểu 120 pixel x 120 pixel hoặc 120x120px.

Tôn trọng yêu cầu tối thiểu này để đảm bảo rằng hình ảnh của bạn sẽ luôn xuất hiện đúng trên các bài đăng trên Twitter và sẽ khiến chúng có giao diện đẹp.

Tôi có thể bay ở đâu? (@wcanifly) Twitter
Yoann Bierling (@ybierling) Twitter
Trợ giúp Điện thoại thông minh (@help_smartphone) Twitter
Travel Comparator (@travelcomparato) | Twitter
Nền tảng phát triển Twitter - Nhà phát triển Twitter
Câu lạc bộ bãi biển Kiev và đèn ngủ Kiev vào mùa hè - Tôi có thể bay ở đâu?
Phải có thẻ meta xã hội cho Twitter, Google+, Facebook và hơn thế nữa - Moz

Đọc thêm

Để tối ưu hóa thẻ meta của bạn để hiển thị thẻ rich và các phương tiện chia sẻ truyền thông xã hội khác, hãy xem các trang web tuyệt vời này với đầy đủ các thông tin hữu ích:

Bảng SEO Cheat Sheet của nhà phát triển web 2.0
18 Meta Tags Mỗi trang web nên có trong năm 2014
Giao thức đồ thị mở
Đoạn trích - Nền tảng Google+
Pinterest Ghim phong phú dành cho doanh nghiệp
WooCommerce - Bộ công cụ Wordpress miễn phí bổ sung thêm đánh dấu sản phẩm

Thẻ meta SEO SEO

Các thẻ meta SEO SEO mà bạn phải sử dụng thẻ Twitter là như sau: trang web, tiêu đề, mô tả, người tạo và hình ảnh.

After having implemented these Thẻ meta SEO SEO, sharing your website on Twitter will automatically pull these Thẻ meta SEO SEO from your website to display a Twitter card.

Yoann
Giới thiệu về tác giả - Yoann
Yoann is an international business consultant. He helps businesses implementing their international projects, facilitating exchanges between various cultures, specialties, streams, and technologies. He thrives in designing, improving, adapting, innovating, and making solutions work, to satisfy clients. He created www.ybierling.com to share his expertise. He worked more than 10 years in international business development, global supply chain perfection, financial optimization, SAP ERP project deployment, and Web based business support for various industries, such as logistics, cosmetics, consumer goods, beauty care, or fashion, in more than 30 countries around the globe.
 

Đọc thêm


Bình luận (0)

Để lại một bình luận