Why is this Meta Embed Image not showing when sharing the site link? It used to work but suddenly stopped for some reason
<meta property="og:title" content="Site List">
<meta property="og:description" content="Something">
<meta property="og:type" content="website">
<meta name="og:image" itemprop="image" content="https://spiritaxolotl.github.io/images/faces/spax/Smirk.png">
Related
I know how to use Open Graph meta tags in head of HTML. Example:
<meta property="og:type" content="website">
<meta property="og:url" content="https://sitename.com/">
<meta property="og:title" content="My blog"/>
<meta property="og:description" content="Tutorial..."/>
<meta property="og:image:secure_url" content="https://sitename.com/img/tutorial.png"/>
But if a type of preview image is good for WhatsApp, it's not good for Facebook! So how should you set meta tags for different platforms at the same time? Thanks
You can specify two (or more) Open Graph images, the first, a rectangular image for FB and the second, a square image for WhatsApp.
<meta property="og:type" content="website">
<meta property="og:url" content="https://sitename.com/">
<meta property="og:title" content="My blog"/>
<meta property="og:description" content="Tutorial..."/>
<meta property="og:image" content="https://sitename.com/img/tutorial_1200-600.png"/>
<meta property="og:image:width" content="1200"/>
<meta property="og:image:height" content="630"/>
<meta property="og:image" content="https://sitename.com/img/tutorial_400-400.png"/>
<meta property="og:image:width" content="400"/>
<meta property="og:image:height" content="400"/>
WhatsApp uses the last image.
does anyone know what meta tags firefox uses to show the "title" name on the topsites homepage?
I currently use:
<meta name="application-name" content="My App" />
<meta property="og:image" content="My Image URL">
<meta property="og:description" content="My site descriptionn">
<meta property="og:title" content="My Title">
<meta property="og:type" content="website">
<meta property="og:site_name" content="My Site Name">
which shows my icon properly but the title is the domain name that is in the url. I would of expected the title to be "My title"
Any idea how i can set the title property properly?
many thanks
when I try to publish the link of my website on twitter this is the result:
I tried to resize the image in every way using the most recommended sizes. right now I'm usig an image 280x150
these are my meta tags:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Title">
<meta name="twitter:description" content="Description">
<meta name="twitter:image" content="www.mysite.com/immaginiArticoli/myimg.png">
<meta name="twitter:site" content="www.mysite.com">
I have a web site with a few pages and for example if I want to share with somebody one of my link and send it via whatsapp, I need to see logo and some text in my message. [as it on this image]
How can I do that?
I just have found this sample:
<link rel="shortcut icon" href="img/img.svg">
<link rel="apple-touch-icon image_src" href="img/img.svg">
<meta name="twitter:title" property="og:title" itemprop="name" content="Link to source">
<meta name="twitter:description" property="og:description" itemprop="description" content="Mycontent">
You have to add some meta tags.
<meta property="og:site_name" content="Your site name">
<meta property="og:title" content="Page title" />
<meta property="og:description" content="Page description" />
<meta property="og:image" itemprop="image" content="your_page_image.png">
<meta property="og:type" content="website" />
You can try your code with : https://cards-dev.twitter.com/validator
<head>
<meta property="og:type" content="website">
<meta property="og:url" content="https://stackoverflow.com/questions/54984552/how-to-get-link-to-source-using-htm-css">
<meta property="og:site_name" content="Stack Overflow">
<meta property="og:image" itemprop="image primaryImageOfPage" content="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon#2.png?v=73d79a89bded">
<meta name="twitter:card" content="summary">
<meta name="twitter:domain" content="stackoverflow.com">
<meta name="twitter:title" property="og:title" itemprop="name" content="How to get link to source using htm css">
<meta name="twitter:description" property="og:description" itemprop="description" content="I have a web site with a few pages and for example if I want to share with somebody one of my link and send it via whatsapp, I need to see logo and some text in my message. [as it on this image] H...">
I have .mp4, and am trying to post using meta tags for content of post.
The Facebook Debugger agrees I have the following..
<meta property="og:type" content="video.other">
<meta property="og:title" content="This is the title for a test post">
<meta property="fb:app_id" content="<app_id>">
<meta property="og:description" content="Test">
<meta property="og:video" content="https://<url_for_mp4>">
<meta property="og:video:secure_url" content="https://<url_for_mp4>">
<meta property="og:video:type" content="video/mp4">
<meta property="og:video:width" content="1200">
<meta property="og:video:height" content="630">
When rendering this Facebook just shows the title & description
Any help appreciated.