Twitter is one of the most engaging platforms of the day. And adding Twitter cards to your website helps your brand look more attractive and approachable. And doing so is quite simple. For your HTML website, add a snippet to the <head> section of your page, and from there, you can make Twitter display all the content that the readers share with your posts or pages on the social network.
By default, Twitter is designed to display only URLs when someone tweets your posts, hindering engagement. But worry not; you can use Twitter Cards that help display actual content rather than just URLs. This is possible in both HTML-based and WordPress websites. Here are some of the best ways to incorporate Twitter cards into your website.
TYPES OF TWITTER CARDS
Different posts require different content, and Twitter cards are designed to do just that. There a four different types of Twitter cards available:
- Summary Card: This card displays only the title, description, and thumbnail image.
- Summary Card with Large Image: Adding to the basic information of the title description, it also features a large image to help gather attention.
- App Card: This is a special card used for promoting an app available for download. This includes the title, description, and a direct download link for downloading the application.
- Player Card: This is a unique card with a title, description, video, media, or audio file with an embedded player.
All these are sure to look better than a URL and will help you engage with your target audience a lot better.
FOR HTML BASED WEBSITE
- SUMMARY CARD
The Summary Card has only three properties, i.e., title, description, and a thumbnail image. While it is compulsory to use Twitter:card, twitter:site, and twitter:title, it is highly recommended that you also use a static image for the thumbnail. If your post does not require any supporting ideas, use your logo but include something other than text. The Summary Card supports the ratio of 1:1, and the minimum requirement for the dimensions is 144×144, and the maximum being 4096×4096 pixels.
SUMMARY CARD WITH LARGE IMAGE
This summary card with an extensive image is very similar to the previous one, only that here you can also display a large featured image instead of only a small thumbnail. The Summary Card with Large Image supports the ratio of 2:1 with a minimum requirement for the dimensions being 300×157 and maximum being 4096×4096 pixels.
- APP CARD
The App Card is typically used by those with an application on Google Play or Apple’s App Store. Here, you are required to specify the app IDs, and by directly pulling the data from Apple’s App Store or Google play store, Twitter will add all the necessary data.
- PLAYER CARD
The Player Card comes with the most features and thus requires the most properties for your HTML codes. After mentioning the basic properties of the card type, Twitter handle, post title, you are also required to specify the details of the embedded media player. you also have to define the HTTPS URL to an iFrame player such as Spotify, YouTube, etc. After that, an image is to be added that will pop up on platforms that do not support iFrames. It is important to note that the substitute image should have the exact dimensions of the embedded media player.
FOR WORDPRESS BASED WEBSITE
Though most premium WordPress plugins and themes come with Twitter Cards markup by default, you can add the feature using plugins if yours does not.
You can use either of the two options:
- Use a Twitter Card plugin
- Configure your SEO plugin to generate Twitter Cards.
Let us check them in detail.
- USING A TWITTER CARD PLUGIN
One of the best things about WordPress has to be the variety of plugins offered. The Open Graph and Twitter Card Tags plugin can easily be used as an integrated solution for adding Twitter Card tags to your WordPress website. Here, you can choose the tags you want to include and pick a default image for the plugin to add if your post does not contain any images. Its plugin is renowned and integrates with WooCommerce, Yoast SEO, and other notable plugins.
- CONFIGURE YOUR SEO PLUGIN
If you are already using some SEO plugin in the modern SEO world, it probably comes with social media functionality, including Twitter Cards. If you are not looking for too many features and are simply looking to add the default title, featured image, and URL of your posts, you can do so by configuring the settings of your SEO plugin. Say you use Yoast SEO, here you can enable Twitter Cards by accessing the Social menu of the plugin.
VALIDATE YOUR TWITTER CARDS
After adding Twitter Cards for the initial few posts, at least you might be unsure of how the post will turn out. But worry not, Twitter’s developer website offers you a way out. Here you can find an easy-to-use card validator. This is designed to give you a preview of your Twitter Cards and make necessary changes before actually posting.
At helpbot, services like creating a new site from scratch to securing it in the best possible way are provided seamlessly without any hassles by our Best WP expert WordPress Management Executives. Feel free to contact helpbot.net, our executives are there to solve all your problems.
