I have simple share button to share a certain video to facebook , unfortunately only image shows but no video here is my solution
<meta property="og:url" content="https://meed.audiencevideo.com" />
<meta property="og:video:type" content="video/mp4"/>
<meta property="og:title" content="test title" />
<meta property="og:description" content="Test" />
<meta property="og:image" content="https://meed.audiencevideo.com/images/thumbnail.PNG" />
<meta property="og:video:secure_url" content="https://meed.audiencevideo.com/videos/good_job.mp4" />
<meta property="og:video" content="https://meed.audiencevideo.com/videos/good_job.mp4" />
<meta property="og:video:width" content="398">
<meta property="og:video:height" content="264">
What am I missing in my code?
Related
I am using Open Graph meta tags in my HTML code but I am not sure about its(og:image) property with following content:
This are my codes:
<meta property="og:title" content="Donya Internatioanl group"//>
<meta property="og:url" content="https://dig.af/" />
<meta property="og:image" content="~/Images/myImage.jpg" />
<meta property="og:type" content="website" />
<meta property="og:description" content="Some description about this image" />
<meta property="og:locale" content="fa_GB" />
<meta property="og:site_name" content="DIG" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
Please help me whether this link to image is correct or no:
<meta property="og:image" content="~/Images/myImage.jpg" />
specially its content, or I have to write it like This:
<meta property="og:image" content="https://mywebsite.net/assets/opengraph/theogimage.jpg"/>
You have to use the full path, so:
<meta property="og:image" content="https://mywebsite.net/blah/image.jpg/>
would be the correct way. The content has to refer to an URL that Facebook can access and download your image from.
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 am trying to share my link page in facebook in order to generate a GIF (with the rounded GIF symbol) using the og meta tags:
<meta content="width=device-width, initial-scale=1" name="viewport" />
<meta property="og:url" content="https://i.giphy.com/YuXbch37iz5ao.gif" />
<meta content="video.other" property="og:type" />
<meta property="og:image" content="https://i.giphy.com/YuXbch37iz5ao.gif" />
<meta content="image/gif" property="og:image:type" />
<meta property="og:image:width" content="384" />
<meta property="og:image:height" content="480" />
<meta content="991618354275198" property="fb:app_id" />
<meta content="crazygifs" property="og:site_name" />
And the result is it after sharing the link in facebook:
And the expected result should be the image above with this the GIF symbol:
It happens with some gifs, if I try to do the same thing with this link, it works.
I assume that is a rendering problem from facebook. No solution so far...
I am posting on Facebook wall through HTML page i have added all meta tags on page as well as configured bundle id & appstore id on facebook console also. When i am clicking on post it's redirecting to facebook internal browser but i want to open my app if it's installed or redirect to app store if not.
<html prefix="og: http://ogp.me/ns#">
<head>
<meta charset="UTF-8">
<meta property="al:ios:url" content="artist://" />
<meta property="al:ios:app_store_id" content="49155" />
<meta property="al:ios:app_name" content="Artist" />
<meta property="fb:app_id" content="805534" />
<meta property="og:title" content="When Great Minds Don’t Think Alike" />
<meta property="og:description" content="How much does culture influence creative thinking?" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://fbdigi.hua.org/AAD/AA_app_icon.png" />
</head>
</html>
I have added below code & it worked:
Final App link code:
<html prefix="og: http://ogp.me/ns#">
<head>
<meta charset="UTF-8">
<meta property="al:ios:url" content="artist://" />
<meta property="al:ios:app_store_id" content="49155" />
<meta property="al:ios:app_name" content="Artist" />
<meta property="al:web:should_fallback" content="false" />
<meta property="fb:app_id" content="805534" />
<meta property="og:title" content="The Rock" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://fbdigi.hua.org/AAD/AA_app_icon.png" />
</head>
</html>
I need to categorize my website so what meta resource types are you allowed to use???
<meta http-equiv="Resource-Type" content="document">
Oh and do you even use meta resource types to categorize?
No you can't use http-equiv meta to categorize. This is used to give information for the browser. The browser knows what kind of content is inside. But here is a list:
<meta http-equiv="expires" content="date" />
<meta http-equiv="set-cookie" content="name=value; expires=Day, DD-MMM-YY HH:MM:SS ZON; path=url" />
<meta http-equiv=”content-encoding” content=”gzip” />
<meta http-equiv=”date” content=”date” />
<meta http-equiv=”last-modified” content=”date” />
<meta http-equiv=”location” content=”10; url” />
<meta http-equiv=”refresh” content=”10;url=url” />
This means that the page will refresh of refer to another location in 10 seconds
<meta http-equiv="window-target" content="location" />
<meta http-equiv="www-authenticate" content="" />
<meta http-equiv="pics-label" content="labellist" />
<meta http-equiv="pragma" content="option" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="content-language" content="en-us" />
<meta http-equiv="content-script-type" content="language">
<meta http-equiv="page-enter" content="revealtrans(duration=seconds,transition=num)" />
<meta http-equiv="page-exit" content="revealtrans(duration=seconds,transition=num)" />
<meta http-equiv="imagetoolbar" content="no"/>