Want to add Twitter cards in your Blogger/Blogspot blogs, here is a trick to implement Twitter cards in Blogger to improve your visibility in Twitter and SEO
If you share your blog posts on twitter regularly you should add or implement twitter cards in your blogger blogs. Because twitter cards will help to understand your readers about the content you shared. That means when you share a blog post on twitter, if you added twitter cards in your blog twitter will automatically preview the blog title, blog summary, thumbnail images etc
So that you don't need to add the title, description of the content etc and can add hashtags without any character limit.
How to Add Twitter Cards in Blogger?
- Go to Templates > Edit HTML
- Find <head> section in the HTML code ( You can use Ctrl+F to find <head> tag)
- Add the below code just below the <head> tag
- You have to replace
- AUTHOR_TWITTER_HANDLE with your twitter username
- WEBSITE_TWITTER_HANDLE with your website's twitter username
- WEBSITE_FAVICON_IMAGE_URL with your favicon image ( if you use images in all your post you don't have to use this, you can simply remove all line from this)
- Then click save
- After saving you can validate whether you added the codes correctly by going to the twitter card validator tool
[post_ads]
[<!-- twitter cards -->
<meta name="twitter:card" content="summary"/>
<meta name="twitter:site" content="@AUTHOR_TWITTER_HANDLE"/>
<meta name="twitter:creator" content="@WEBSITE_TWITTER_HANDLE"/>
<b:if cond='data:blog.pageType == "item"'>
<meta name="twitter:url" expr:content='data:blog.url' />
<meta name="twitter:title" expr:content='data:blog.pageName' />
<meta name="twitter:description" expr:content='data:blog.metaDescription'/>
<b:else/>
<meta name="twitter:url" expr:content='data:blog.homepageUrl' />
<meta name="twitter:description" expr:content='data:blog.metaDescription'/>
</b:if>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' name="twitter:image"/>
<meta name="twitter:title" expr:content='data:blog.title' />
<b:else/>
<meta content='WEBSITE_FAVICON_IMAGE_URL' name="twitter:image"/>
<meta expr:content='data:blog.title' name='twitter:title'/>
</b:if>]
COMMENTS