Preview image in Viber - facebook-opengraph

I've faced a problem with generating rich preview card in Viber. The idea is to show an image with annotation text for site's pages. Page snippet displays properly in all other messengers/social networks, but Viber can't handle my og:image. In attachment there are examples.
After some digging around I've find out that the problem is not about open graph markdown or image itself, but probably about image's response headers. I've tried to post in Viber chat direct link to the image itself (not the page). If it's stored on our common domain (or github, or whatever), preview card looks as expected. But if it's hosted on our subdomain for media files – there is no preview.
Links to reproduce:
https://www.rabota.ru/static/images/test/43285342.png - this will work
https://media.rabota.ru/og_image/vacancy/1/43285342.png - same image, will not
https://www.rabota.ru/vacancy/43285342/ – the page, where this image should be as preview cover
Also I've attached response headers for both cases
So the question is – why preview image presents in first case and does not in second, and if it's about headers – what headers should I modify?
This works:
This don't:

As Viber support team mentioned content-length header is required for preview image

Related question https://stackoverflow.com/a/65093512/12640054
From my test, Viber successfully got first jpg/png image on page
with size less than 40Kb.
Even you can hide it with display: none if it is not really shown
image in browser, just for Viber preview.

Related

Fb Share Issue - invalid image content type (Wordpress Website)

I am trying to share an article. The Debugger tool though seems to find the image. The error I get is Invalid Image Content-Type. Image is loaded correctly if I just go and open it from the browser.
This issue is for certain images only
Try yoast seo plugin social it is free choose your image with it and then write your website description

Facebook not picking up on og:image when sharing post

I made a post on WordPress, then shared it on a Facebook page. In the past, the shared image would be the large "post" image. But now, for some reason, it's using the thumbnail. Running the url through fb's debugger shows that Open Graph recognizes both og:images, but that neither of them are being used in the share preview. Once posted, it uses the thumbnail.
I checked the meta content in the page head just to double check and sure enough, it looks fine:
<meta property="og:image" content="##">
What's causing this? It's recognized, but not used. What?
I currently facing the same issue, after contacting facebook, it turns out there is an issue in Open Graph in facebook that affects some users.
The Bug has been reported and assigned as "high priority" in Facebook support center - https://developers.facebook.com/bugs/978421888869140/
Be sure to have a look at
https://developers.facebook.com/docs/sharing/best-practices#images
You need at least images of 1200x630 pixels size to be able to get a large preview image.
Furthermore, you should put the larger image first IMHO.
See
https://developers.facebook.com/docs/sharing/webmasters/optimizing#cachingimages
https://developers.facebook.com/docs/sharing/webmasters#images

gif image file displays red "x" on IE

To start off, I have searched google & SO (Images are showing up as red x's on IE, shows up fine in other browsers), tried out the suggestions, but they did not resolve my issue.
I am trying to create a transparent image by following the code shown at: How do you Draw Transparent Image using System.Drawing?. I am using a 3rd party mapping control "Simplovation"
However, this is what I get when I run my webpage:
How can I get the actual image to appear?
I tried converting to RGB, but no luck.
Based on the code in "How do you Draw Transparent Image using System.Drawing" the actual image should appear like:
There could be a long list of potential problems here, let's address 3 of them:
Permissions
You imply that you are creating this image from code. How are you doing that? If the IIs worker process, running in the user context of the application pool account, is creating this image, does it create/save it to a location that is accesible anonymously? (or whatever your authentication model is)
File locked?
Again, since you are implying your are creating the image from code, to you close the file handle properly?
Path.
You say that the image Url is correct, but are you really 100% sure? Press F12 on IE and use the developer tools to determine if you get any type of HTTP error when IE is trying to request the image.
IE is very specific about the image type and actual image content. In other words, IE cannot display if image type and content doesn't match.
For example, renaming just file extension - bmp to gif - doesn't work in IE, although it is not an issue in other browser.
Easiest way to check is to browse that page in other browser. If you can see image in other browser, you can make sure that image format is not correct.

og:image Works Unpredictably on WordPress Theme

When attempting to share a page on FB, many images seem to only appear AFTER running the page that contains the image through the debugger first. Additionally, the debugger seems to throw different errors for the same page in some cases, even though I've made absolutely no changes to the page. Sometimes it tells me the image url cannot be found, and after clicking on "Scraped URL:" or "Graph API: the image url is found and the image then appears in the debugger?! However, nothing seems to happen consistently and it is very difficult to replicate these issues.
I tried unsuccessfully to post the code here, however, I'm using a modified version of a script provided by Chad Von Lind (http://vonlind.com/?p=539).
Sample pages (that did not display an image until after they were submitted to the debugger):
http://greatmomentsinparenting.com/photos/warning-parents-keep-out/
http://greatmomentsinparenting.com/photos/12-hours-in-a-car/
I don't understand why the images appear sometimes, and not at other times. Is it a caching issue? Does it take time for the image to show up in the cache for a newly published page? Can I force FB to cache the image on the first try? Or is it because I'm using a dynamic image url? And by the way, the image sizes are 203x203 pixels.
Thanks!
It's media temple. I have been working with them for weeks to fix it.
Facebook 503 502 Same html different servers different results

How to link youtube video without captions?

Is it possible to link youtube videos in HTML code without showing it's captions (subtitles)?
Let's say I have following video: http://www.youtube.com/watch?v=kTvHIDKLFqc . It has default english subtitles. However, when linking this video, I want to load it without them. Is there a possibility to do so with some kind of parameter in video?
I found this link with description how to do it, but it doesn't seem to work. If I try to use following format of link, it shows captions anyway: http://www.youtube.com/watch?v=kTvHIDKLFqc&cc_load_policy=0. Is it not working or did I misunderstand anything?
I found the documentation to be a little misleading in that setting &cc_load_policy=1 does not show the closed captions by default, but enables toggling with the cc button in the video control bar when entered as shown here -
http://www.google.com/support/youtube/bin/answer.py?hl=en&answer=140174
It seems cc_load_policy is a parameter that only accepts 1 as value, so even if you try to use 0 or off values to turn off captions, it won't make a difference (at least until today: 2015-05-18 2017-09-11):
https://developers.google.com/youtube/player_parameters#cc_load_policy
2017-09-11 Solution: "Enable privacy-enhanced mode"
When you share a video in Youtube through the embedding option, you can click the "Enable privacy-enhanced mode" checkbox. This will change the URL to a different Youtube domain: https://www.youtube-nocookie.com
Just by doing this, even if the user has captions On by default, the nocookie option will not read the cookie associated to the user preferences (it's as if the user does not require captions by default).
I have created this codepen example in order to explain this:
Try playing the "No parameters" video and then the cc_load_policy=1 video (it may not display captions due to user preferences, even if in the latter the CC button is activated - red underline);
Then play the "nocookie domain" video and there should be no captions.
Try activating captions in the "no parameters" video and refresh the page.
All videos except the "nocookie domain" video will display captions.
Disclaimer: I have only seen this working in Chrome (Firefox and Edge always display captions in the nocookie domain, even in private navigations). If you activate/deactivate captions manually in the "nocookie domain" video, then it will display/hide captions in this domain when you refresh the page respectively.
Old stuff (partial solution for owners of the video)
cc_lang_pref does not accept off or Off as a value either...
I managed to turn off captions/subtitles for the default language of the video this way only for Safari and IE (I have captions in the default language and English - in my case, Chrome and Firefox seemed to have ignored the change, but I suggest to give it a shot anyway):
In youtube if you go to your video's Info and Settings page and click Advanced Settings tab, set the Video Language to Not applicable.
Save and go to Subtitles and CC page, where a pop-up appears explaining that «You must select a video language before adding subtitles or CC.» (this seems not to be true, because they even appear anyway).
Choose your video's default language in the pop-up: this is what makes it understand that you don't need captions of your default language when the video is in the same default language the weird thing is, this is the step that will make them not to show up, and it's not because the same language is used in the captions.
In the URL's video that you do not want to have captions do not use cc_load_policy parameter, but you can use cc_lang_pref to the default language like this:
http://www.youtube.com/watch?v=kTvHIDKLFqc&cc_lang_pref=en.
Again, this seems to work only in some browsers (Firefox and Chrome not included), but hope it helps...
The site says how to turn on caption. It does not talk about turning off captions. I thinkit depends on the user's previous choice.
When you embed a video on another
site, you can make it so that captions
are always shown on the embedded
video. To enable captions on a video
you'd like to embed, just add
&cc_load_policy=1 to the video's embed
code.
It's very simple, add iv_load_policy=3 parameter to your embed code.
Peace to whom will follow the guidance,
(Thanks for your tries but I found something nice not far away from there...)
Ask for a language preference that is not from the translated captions (for my exemple "He" stands Hebrew, that was not among the offered translations of the video.)
Add ?hl=He to the url, like this :
without it :
https://www.youtube.com/watch?v=pRztmbnyV70
and with it :
https://www.youtube.com/watch?v=pRztmbnyV70?hl=He
Makes it... ?
It worked for me on Firefox, Edge and Opera.
-- Enjoy !
Note : the particle desapears after the loading of the page ...But the job is done !

Resources