When i try to post url http://appleinsider.com/articles/17/05/02/apple-cruises-past-old-market-capitalization-record-may-hit-800-billion-before-earnings
i did not get any preview in StockTwits,
while it looks good in Twitter
On other hand when i post some YouTube video to StockTwits it show preview
https://www.youtube.com/watch?v=uLzJ3OGU07A
Question: Which of OpenGraph meta-tags support StockTwits?
I have already added
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
<meta property="og:locale" content="en_US" />
<meta property="og:site_name" content="site Inc." />
<meta property="og:image" content="http://test.com/image/279205d5-9a89-40d1-9c13-5fb255b16754?t=42855.682442245372"/>
<meta property="og:type" content="article" />
<meta property="og:url" content="http://test.com:80/279205d5-9a89-40d1-9c13-5fb255b16754" />
<meta property="og:title" content="My Title" />
<meta property="og:description" content="My description"/>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="http://test.com/image/279205d5-9a89-40d1-9c13-5fb255b16754?t=42855.682442245372"/>
It works for Twitter, but does not help for StockTwits =(
Related
On my webpage I have all the required OG tags, and on facebook preview this is working, on android and other messaging app also the preview is working, but only on iMessage the preview is broken. Do we need to add any extra tags to fix this?
please see the tags I have right now:
<meta property="og:title" content="My site title">
<meta property="og:site_name" content="mysitename.com">
<meta property="og:url" content="https://mysite.parentsite.com/">
<meta property="og:description" content="Here is a description of my site that will show up in the Facebook card.">
<meta property="og:image" itemprop="image" content="https://mysite.parentsite.com/wp-content/uploads/2022/07/pf-fb-test.jpg">
<meta property="og:image:secure_url" content="mysite.parentsite.com/wp-content/uploads/2022/07/pf-fb-test.jpg" />
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="826" />
<meta property="og:image:height" content="539" />
<meta property="og:image:alt" content="This is a sample profile pic">
<meta property="og:type" content="website">
I have this post: https://tikex-dev.com/kubl/szkg/j1vd/7w68
it has og:img: https://t44-post-cover.s3.eu-central-1.amazonaws.com/v56o
If you load it in a browser it animates, but not on Facebook, why?
And I have those headers:
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta property="og:title" content="555">
<meta property="og:description" content="555">
<meta property="og:image" content="https://t44-post-cover.s3.eu-central-1.amazonaws.com/v56o">
<meta property="og:image:width" content="1920">
<meta property="og:image:height" content="1080">
<meta property="og:image:type" content="image/gif">
<meta property="og:type" content="website">
<meta property="fb:app_id" content="402670860613108">
<meta property="og:url" content="https://tikex-dev.com/kubl/szkg/j1vd/7w68">
<meta name="next-head-count" content="11">
</head>
Giphy uses mp4 as og:video. Do I really need video to show an animation?
Tenor uses webm format in og:video. Is og:video really needed?
What I've done so far:
Checked https vs http
placed images in root vs sub-folder
removed/added og:image:secure_url
resizing and compressing image
png vs jpg
cleared caches
I was working at one point, but then stopped, and its unclear when, so hard to diagnose what broke it.
site is https://www.jaredzimmerman.com
OG Image is located at https://www.jaredzimmerman.com/public/avatar_crop_1200_og.png
and OG Header is
'''
<link href="https://www.jaredzimmerman.com" rel="canonical">
<meta name="robots" content="max-snippet:-1, max-image-preview:large, index, follow">
<meta name="googlebot" content="index,follow">
<meta name="author" content="Jared Zimmerman">
<meta property="og:type" content="website">
<meta property="og:locale" content="en_US">
<meta property="og:url" content="https://www.jaredzimmerman.com">
<meta property="og:url" content="https://www.wikidata.org/wiki/Q29918442">
<meta property="og:title" content="Jared Zimmerman">
<meta property="og:site_name" content="Jared Zimmerman">
<meta property="og:description" content="Award winning product design leader, educator, and speaker ✨">
<meta property="og:image" content="https://www.jaredzimmerman.com/public/avatar_crop_1200_og.png">
<meta property="og:image:secure_url" content="https://www.jaredzimmerman.com/public/avatar_crop_1200_og.png">
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:alt" content="portrait illustation of Jared Zimmerman drawn by Sara Lee">
<meta property="twitter:card" content="summary">
<meta name="twitter:creator" content="#jaredzimmerman">
<meta property="twitter:creator" content="#jaredzimmerman">
<meta property="twitter:url" content="https://www.jaredzimmerman.com/">
<meta property="twitter:title" content="Jared Zimmerman">
<meta property="twitter:description" content="Award winning product design leader, educator, and speaker✨">
<meta property="twitter:image" content="https://www.jaredzimmerman.com/public/avatar_crop_1200_og.png">'''
I'm trying to get the large image card to work with a website. The metadata is being read correctly, but it's displaying the small summary card, instead.
My metadata:
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="volkischexe.com">
<meta property="twitter:url" content="/germania/index.php">
<meta name="twitter:title" content="Germania: An Introduction">
<meta name="twitter:description" content="...">
<meta name="twitter:image" content="http://volkischexe.com/res/cards/germania-intro.png?605a78eeba1aa">
<!-- OpenGraph Card -->
<meta property="og:type" content="website">
<meta property="og:url" content="/germania/index.php">
<meta property="og:title" content="Germania: An Introduction">
<meta property="og:image" content="http://volkischexe.com/res/cards/germania-intro.png?605a78eeba1ae">
<meta property="og:description" content="...">
<!-- HTML Meta -->
<title>Germania: An Introduction</title>
<meta property="og:url" content="http://volkischexe.com/germania/">
<meta property="og:image" content="http://volkischexe.com/res/cards/germania-intro.png?605a78eeba1b1">
<meta property="og:title" content="Germania: An Introduction">
<meta property="og:description" content="...">
<meta name="description" content="...">
<title>Germania: An Introduction</title>
Twitter seems to see my metadata correctly, too:
What am I missing here?
ETA: The validator doesn't show my cards correctly, but if I actually tweet them, they show up just fine. So there's something going on with the validator, but as long as my cards show up on Twitter, I'm good.
There are a few things that could be stopping Twitter from sharing a large card for your site:
A couple of your twitter meta settings use “content,” but twitter wants “name.”
Your site is redirecting to https, so use the secure version for the URLs in your meta information.
It’s good to include the image sizes for Facebook.
And you don’t need the index.php file name – your server will automatically serve up the index.php file.
Try replacing your code with this:
<!-- OpenGraph Card -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://volkischexe.com/germania/">
<meta property="og:title" content="Germania: An Introduction">
<meta property="og:image" content="https://volkischexe.com/res/cards/germania-intro.png?605e46b26abc5">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:description" content="From where does the modern Western world derive its values and morals?">
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:domain" content="volkischexe.com">
<meta name="twitter:url" content="https://volkischexe.com/germania/">
<meta name="twitter:title" content="Germania: An Introduction">
<meta name="twitter:description" content="From where does the modern Western world derive its values and morals?">
<meta name="twitter:image" content="https://volkischexe.com/res/cards/germania-intro.png?605e46b26abc1">
One thing (that may or may not be impacting Twitter) is the start of your page is missing DOCTYPE and some other stuff:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Germania: An Introduction</title>
<meta name="description" content="From where does the modern Western world derive its values and morals?">
<link rel="preload" href="/res/AndBasR.ttf" as="font" type="font/ttf" crossorigin>
<link rel="preload" href="/res/CelticHand.ttf" as="font" type="font/ttf" crossorigin>
<link rel="preload" href="/res/Norse-Bold.otf" as="font" type="font/otf" crossorigin>
<link rel="stylesheet" href="/res/main.css">
<script src="/res/main.js"></script>
One thing with the Twitter card validator — sometimes is doesn’t rescrape your site when you click the Preview Card button. You may need to restart your browser (closed and reopened) and rescrape a couple of times to get it to load the new version.
I am having trouble with internationalization of my open graph objects. I am providing the og:locale as well as the og:locale:alternate tags, but Facebook does not scrape my objects in different locales. In the object debugger at http://developers.facebook.com/tools/debug i can see the og:locale:alternate are parsed and it shows them as an array. But clicking one of them results in a scrape without any parameter. Neither fb_locale nor locale nor the header X-Facebook-Locale are provided.
Here is one of the example objects:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta property="og:locale" content="en_US">
<meta property="og:locale:alternate" content="de_DE">
<meta property="og:locale:alternate" content="en_US">
<meta property="og:locale:alternate" content="fr_FR">
<meta property="fb:app_id" content="181576101937079">
<meta property="og:type" content="APP_NAMESPACE:level">
<meta property="og:url" content="http://apps.facebook.com/APP_NAMESPACE/?ogObjType=level&ogObjId=0_0&ogObjVariant=">
<meta property="og:title" content="Tree House Level 1">
<meta property="og:description" content="">
<meta property="og:determiner" content="the">
<meta property="og:image" content="https://URLTOIMAGE">
</head>
<body>
...
</body>
</html>
And when I add fb_locale=de_DE by hand, it returns.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta property="og:locale" content="de_DE">
<meta property="og:locale:alternate" content="de_DE">
<meta property="og:locale:alternate" content="en_US">
<meta property="og:locale:alternate" content="fr_FR">
<meta property="fb:app_id" content="181576101937079">
<meta property="og:type" content="APP_NAMESPACE:level">
<meta property="og:url" content="http://apps.facebook.com/APP_NAMESPACE/?ogObjType=level&ogObjId=0_0&ogObjVariant=">
<meta property="og:title" content="Baumhaus Level 1">
<meta property="og:description" content="">
<meta property="og:determiner" content="the">
<meta property="og:image" content="https://URLTOIMAGE">
</head>
<body>
...
</body>
</html>
Can anyone tell why Facebook does not scrape the localized versions of my objects?
I have same problem.
OG-tags:
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="en_GB" />
<meta property="og:locale:alternate" content="fr_FR" />
<meta property="og:locale:alternate" content="ru_RU" />
If I did
curl -X POST -F "id=http://gorokhovsky.nampohui.ru" -F "scrape=true" -F "locale=en_GB" "https://graph.facebook.com"
or locale=en_US
my server got request from FB, and I receive a correct answer.
{"url":"http:\/\/gorokhovsky.nampohui.ru\/","type":"website","title":"Surfingbird - your personal web!","locale":{"locale":"en_us","alternate":["en_gb","ru_ru","fr_fr"]},"image":[{"url":"http:\/\/surfingbird.ru\/img\/logo-mailru2.gif?v=1"}],"description":"We pick interesting websites, photos and videos that you\u2019ll like.","site_name":"Surfingbird.ru","updated_time":"2013-02-27T15:04:20+0000","id":"356024197844717","application":{"id":"179736405468568","name":"Gorokhovsky2","url":"http:\/\/www.facebook.com\/apps\/application.php?id=179736405468568"}}
But if I set locale=fr_FR or ru_RU, I receive
"error":{"message":"Unsupported post request.","type":"GraphMethodException","code":100}
My server didn't get request from FB
If I set locale=ru_ru or fr_fr, it worked like locale=en_US
I think FB incorrect working with case of locale's characters
Try using the lower case for locale en_us instead of en_US.