I want the users to share a page of my website on Twitter. I've a button as follow:-
<a href="http://twitter.com/intent/tweet?text={{title}}&url=http://{{request.get_host}}/ad/{{slug}},{{id}}" target="_blank"></a>
My meta tags are as follow:-
<meta property="og:type" content="website" />
<meta property="og:title" content="{{title}}" />
<meta property="og:description" content="{{description}}" />
<meta property="og:image" itemprop="image primaryImageOfPage" content="http://{{request.get_host}}{{images.0}}" />
<meta property="og:url" content="http://{{request.get_host}}/ad/{{slug}},{{id}}"/>
<meta name="twitter:card" content="summary">
<meta name="twitter:domain" content="{{request.get_host}}"/>
<meta name="twitter:title" property="og:title" itemprop="title name" content="{{title}}" />
<meta name="twitter:description" property="og:description" itemprop="description" content="{{description}}" />
This is what I get after I click the share link. My expected(ideal) result should be like this. What am I missing?
This is the page that I want to share.
Click on a video within your library to see the Select thumbnail button. You can either select a frame from the video itself, or upload an image file from your local computer. If uploading a custom thumbnail file from your computer, please ensure its aspect ratio is the same as your video content.
To change the featured image in the social post, hover over the Twitter card and click Change to photo post. This allows you to select or edit other images associated with the content, replace the featured image with your own custom image, or remove the featured image altogether.
The link preview is controlled by the author of the web page you're sharing, and by Facebook/Twitter/LinkedIn. The website author adds specific meta tags to the website, and Facebook/Twitter/LinkedIn depends on those meta tags in order to render the link preview.
I just checked your page in the Twitter Cards Validator and it indicates that the twitter:description
field is missing. From what you've posted, it is there, but you've added additional content to it (property="og:description" itemprop="description"
) which means the Cards crawler is unable to parse it correctly. On top of that, I just checked your site, and the value of twitter:description
is actually blank, so this will not work. I guess content="{{description}}"
is returning a null value, so you should look into that as well.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With