{"id":15519,"date":"2022-07-15T12:10:56","date_gmt":"2022-07-15T12:10:56","guid":{"rendered":"https:\/\/zeru.com\/blog\/?p=15519"},"modified":"2022-07-15T12:10:56","modified_gmt":"2022-07-15T12:10:56","slug":"what-are-twitter-cards-and-how-to-use-them-on-your-website","status":"publish","type":"post","link":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website","title":{"rendered":"What Are Twitter Cards and How to Use Them on Your Website"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_43 counter-flat ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<p class=\"ez-toc-title\">Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69fd6af297081\" class=\"cssicon\"><span style=\"display: flex;align-items: center;width: 35px;height: 30px;justify-content: center;direction:ltr;\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/label><label for=\"ez-toc-cssicon-toggle-item-69fd6af297081\"  class=\"cssiconcheckbox\">1<\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69fd6af297081\" ><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#What_Are_Twitter_Cards_and_How_to_Use_Them_on_Your_Website\" title=\"What Are Twitter Cards and How to Use Them on Your Website\">What Are Twitter Cards and How to Use Them on Your Website<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#Summary_cards\" title=\"Summary cards\">Summary cards<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#Player_cards\" title=\"Player cards\">Player cards<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#App_cards\" title=\"App cards\">App cards<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#Video_cards\" title=\"Video cards\">Video cards<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#Links_to_webpages_with_a_large_image\" title=\"Links to webpages with a large image\">Links to webpages with a large image<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\/#Metadata_for_player_cards\" title=\"Metadata for player cards\">Metadata for player cards<\/a><\/li><\/ul><\/nav><\/div>\n<h1><span class=\"ez-toc-section\" id=\"What_Are_Twitter_Cards_and_How_to_Use_Them_on_Your_Website\"><\/span>What Are Twitter Cards and How to Use Them on Your Website<span class=\"ez-toc-section-end\"><\/span><\/h1>\n<p><img decoding=\"async\" align=\"left\" src=\"https:\/\/i.imgur.com\/QYSTBDx.jpg\" alt=\"what is twitter cards\" style=\"height:auto; max-width:44% margin:0px 10px; max-height:243px; width:auto;\">  <\/p>\n<p>What are Twitter Cards? They are a new way to display content on your website that is short and to the point. This article explains the different types of cards: Video, Summary, and Player. This article also explains how to use Twitter cards on your website. Once you have learned how to use Twitter cards, you will be ready to get started. To learn more, read on! Here are some examples. You can create and share your own Cards today!<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Summary_cards\"><\/span>Summary cards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>In Twitter, you can create a Summary Card with an image. It will be small, less than one megabyte in file size, and contain a short description of the content. The image must be at least 120px wide and at least 150px high. It must also be at least 4:3 aspect ratio. For embedded tweets, the image must be smaller than one megabyte. Summary cards are not a replacement for links.<\/p>\n<p>The Summary Card is a quick snapshot of the content of your post. It shows a title, description, and thumbnail image. This format is particularly useful for distributing content. You can use a large image in a Summary Card as it takes up more space in the timeline, which is more likely to lead to a click. It also looks more visually appealing. This may be the reason why some users prefer using the Summary Card over the Large Image option.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Player_cards\"><\/span>Player cards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>The first step towards building a compelling player card on Twitter is to understand the capabilities of the feature. These cards can be used to showcase videos, audio, or both. They are best suited for businesses that have extensive media content, such as audio and video. To implement this feature, you must add HTML meta tags to your website. Native apps will initially display an image preview, with a play icon to access the media. On other platforms, Player Cards will take the place of a traditional video player.<\/p>\n<p>The size and format of Twitter Cards will vary, so you&#8217;ll need to adjust your images accordingly. An ideal player card image will have an aspect ratio of 2:1 and a file size of between 300&#215;157 and 4096&#215;4096 pixels. To upload a Player Card, use the same process as for a Summary Card. If you are uploading playable media hosted on an external website, choose a thumbnail or video. Then, use the following instructions to create a card with the required dimensions.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"App_cards\"><\/span>App cards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>For a mobile application developer, App cards on Twitter are an important tool to help increase download rates. These cards highlight an app when it is tweeted and include details specific to the user&#8217;s mobile device. This helps to drive more traffic to an app&#8217;s website, which can ultimately boost the install rate. Additionally, there are player cards, which enable a website to play videos directly from the Twitter feed. Ultimately, the success of App cards depends on the quality of the user experience.<\/p>\n<p>The App Cards feature allows a developer to highlight an app through a preview of its icon, description, price, and rating. Because users visit Twitter to find new content, it is an excellent tool for promoting new apps. In order to get a featured app listing on Twitter, the app must be publicly available in the app store. The app card pulls images, titles, and other information directly from the app store. To ensure the app is fully functional, it must be listed in the app store.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Video_cards\"><\/span>Video cards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Video is fast becoming the most popular content type on social media sites. But before you implement Twitter Cards into your social media marketing strategy, consider the size of your Twitter Card. For example, you may want to post a blog post about eCommerce. Instead of the featured image, you should include a rich description. Twitter lets you preview your Card before posting, so you can adjust the size of the image or multimedia content. And, because Twitter allows you to preview your video before publishing it, you&#8217;ll never have to worry about your content looking out of place.<\/p>\n<p>A video Card is more complicated to use than other types of Twitter Cards, but it&#8217;s worth the extra effort if you have high-quality audio or video assets to share. It allows you to post various types of media, such as a vlog, a video ad, or a gif, directly in the feeds of your followers. Video Cards aren&#8217;t available for all types of content, though, so the steps for creating and posting them will depend on the format of the content you&#8217;re featuring.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Links_to_webpages_with_a_large_image\"><\/span>Links to webpages with a large image<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Twitter cards are links to webpages with comparatively large images. These cards can be used to highlight recent content, new sales, or product testimonials. For example, TechCrunch uses a summary card to promote a blog article, which also includes a link to the company&#8217;s website. The summary card has two categories: one for content with a strong visual element and another for more general information.<\/p>\n<p>Twitter has several types of cards, each presenting its own set of benefits for marketers. A Summary Card consists of text and a large square or rectangular image. There is also a Player Card for video content, and an App Card for promoting an app. You must whitelist your account to use these tools. But before you post your Twitter Card, be sure to check the size and quality of the image.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Metadata_for_player_cards\"><\/span>Metadata for player cards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>There are several ways to add relevant metadata to Twitter Player Cards. One of them is to use a high-quality image. You can also add a video or audio file. It&#8217;s best to keep the size of the image under 5 MB. Using an image in a Twitter Card is more versatile than with text-based cards. The image should be centered in the Twitter Card. The Open Graph protocol is used to display rich link previews.<\/p>\n<p>In addition to providing a media player&#8217;s URL, you should also provide the width and height of the card. When you provide the width and height, you should use a larger number than the pixels or px. This is because the Twitter Card contains three fields. The width and height of the card should be listed as numbers, and not in pixels or pixel units. The Twitter card metadata contains these fields: the URL of the media player, the width and the height.<\/p>\n<p> <iframe frameborder=\"0\" width=\"399\" src=\"https:\/\/www.youtube.com\/embed\/rRhuQcZdc-k\" height=\"223\" allowfullscreen=\"true\" style=\"margin:0px auto; display: block;\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>What Are Twitter Cards and How to Use Them on Your Website What are Twitter Cards? They are a new way to display content on your website that is short and to the point. This article explains the different types of cards: Video, Summary, and Player. This article also explains how to use Twitter cards [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":15529,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":[],"categories":[4],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v19.7 (Yoast SEO v21.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>What Are Twitter Cards and How to Use Them on Your Website - Zeru<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"What Are Twitter Cards and How to Use Them on Your Website\" \/>\n<meta property=\"og:description\" content=\"What Are Twitter Cards and How to Use Them on Your Website What are Twitter Cards? They are a new way to display content on your website that is short and to the point. This article explains the different types of cards: Video, Summary, and Player. This article also explains how to use Twitter cards [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\" \/>\n<meta property=\"og:site_name\" content=\"Zeru\" \/>\n<meta property=\"article:published_time\" content=\"2022-07-15T12:10:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/zeru.com\/blog\/wp-content\/uploads\/What-Are-Twitter-Cards-and-How-to-Use-Them-on-Your-Website_15519.png\" \/>\n\t<meta property=\"og:image:width\" content=\"938\" \/>\n\t<meta property=\"og:image:height\" content=\"545\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Lizzie Yates\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Lizzie Yates\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\",\"url\":\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\",\"name\":\"What Are Twitter Cards and How to Use Them on Your Website - Zeru\",\"isPartOf\":{\"@id\":\"https:\/\/zeru.com\/blog\/#website\"},\"datePublished\":\"2022-07-15T12:10:56+00:00\",\"dateModified\":\"2022-07-15T12:10:56+00:00\",\"author\":{\"@id\":\"https:\/\/zeru.com\/blog\/#\/schema\/person\/61005d9ec00b94bc50fbaf11b78aa55e\"},\"breadcrumb\":{\"@id\":\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/zeru.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"What Are Twitter Cards and How to Use Them on Your Website\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/zeru.com\/blog\/#website\",\"url\":\"https:\/\/zeru.com\/blog\/\",\"name\":\"Zeru\",\"description\":\"Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/zeru.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/zeru.com\/blog\/#\/schema\/person\/61005d9ec00b94bc50fbaf11b78aa55e\",\"name\":\"Lizzie Yates\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/zeru.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/zeru.com\/blog\/wp-content\/uploads\/19-150x150.jpg\",\"contentUrl\":\"https:\/\/zeru.com\/blog\/wp-content\/uploads\/19-150x150.jpg\",\"caption\":\"Lizzie Yates\"},\"description\":\"A content marketing strategist with the Zeru team for a little over 5 years, Lizzie Yates specializes in everything digital media with a particular focus on social media and technology. Her passion? To follow how the social media sites like Instagram, YouTube, Facebook, Twitter, and TikTok are maturing over time, and what businesses can do to keep up. She shares her insights on our blog in a true outpouring of knowledge and expertise. Her knowledge about technology and social media is vast, and she is always willing to share her insights with businesses to help them stay up-to-date with the latest trends.\",\"url\":\"https:\/\/zeru.com\/blog\/author\/writer\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"What Are Twitter Cards and How to Use Them on Your Website - Zeru","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website","og_locale":"en_US","og_type":"article","og_title":"What Are Twitter Cards and How to Use Them on Your Website","og_description":"What Are Twitter Cards and How to Use Them on Your Website What are Twitter Cards? They are a new way to display content on your website that is short and to the point. This article explains the different types of cards: Video, Summary, and Player. This article also explains how to use Twitter cards [&hellip;]","og_url":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website","og_site_name":"Zeru","article_published_time":"2022-07-15T12:10:56+00:00","og_image":[{"width":938,"height":545,"url":"https:\/\/zeru.com\/blog\/wp-content\/uploads\/What-Are-Twitter-Cards-and-How-to-Use-Them-on-Your-Website_15519.png","type":"image\/png"}],"author":"Lizzie Yates","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Lizzie Yates","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website","url":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website","name":"What Are Twitter Cards and How to Use Them on Your Website - Zeru","isPartOf":{"@id":"https:\/\/zeru.com\/blog\/#website"},"datePublished":"2022-07-15T12:10:56+00:00","dateModified":"2022-07-15T12:10:56+00:00","author":{"@id":"https:\/\/zeru.com\/blog\/#\/schema\/person\/61005d9ec00b94bc50fbaf11b78aa55e"},"breadcrumb":{"@id":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/zeru.com\/blog\/what-are-twitter-cards-and-how-to-use-them-on-your-website#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/zeru.com\/blog"},{"@type":"ListItem","position":2,"name":"What Are Twitter Cards and How to Use Them on Your Website"}]},{"@type":"WebSite","@id":"https:\/\/zeru.com\/blog\/#website","url":"https:\/\/zeru.com\/blog\/","name":"Zeru","description":"Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/zeru.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/zeru.com\/blog\/#\/schema\/person\/61005d9ec00b94bc50fbaf11b78aa55e","name":"Lizzie Yates","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/zeru.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/zeru.com\/blog\/wp-content\/uploads\/19-150x150.jpg","contentUrl":"https:\/\/zeru.com\/blog\/wp-content\/uploads\/19-150x150.jpg","caption":"Lizzie Yates"},"description":"A content marketing strategist with the Zeru team for a little over 5 years, Lizzie Yates specializes in everything digital media with a particular focus on social media and technology. Her passion? To follow how the social media sites like Instagram, YouTube, Facebook, Twitter, and TikTok are maturing over time, and what businesses can do to keep up. She shares her insights on our blog in a true outpouring of knowledge and expertise. Her knowledge about technology and social media is vast, and she is always willing to share her insights with businesses to help them stay up-to-date with the latest trends.","url":"https:\/\/zeru.com\/blog\/author\/writer"}]}},"_links":{"self":[{"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/posts\/15519"}],"collection":[{"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/comments?post=15519"}],"version-history":[{"count":1,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/posts\/15519\/revisions"}],"predecessor-version":[{"id":15524,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/posts\/15519\/revisions\/15524"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/media\/15529"}],"wp:attachment":[{"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/media?parent=15519"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/categories?post=15519"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zeru.com\/blog\/wp-json\/wp\/v2\/tags?post=15519"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}