Provided og:image is not big enough in Facebook linter - facebook

I properly set og:image on my website, the facebook linter sees it (facebook debugger) however, it says the image should be at least 200x200, which it is not the case, my image is 250x250 image.
What could be causing the issue? Could this have anything to do with Cloudfront?
Edit: I got around it by switching from this image to another image which is a
jpg image, but still I couldn't find the cause for the problem since the image
looks fine.

This was happening to me. I was only using the meta og:image tag. I added the following in the head
<link rel="image_src" type="image/jpeg" href="img_path" />
and it fixed the problem for me.

The thread here is pretty helpful: og:image Open Graph Warnings image size
Generally, FB's parser prefers images that are (1) measured in multiples of 100 and (2) square format.

I have experienced same error with my custom Web server ServeRick, the solution unexpectedly was to send Content-Length header with images.. without this header facebook didn't accept any of my og:image links

I was having a space in my image path of my image.
Like my image path was http://example.com/jodha akbar/image.jpg
If you observe above. The jodha akbar directory is having space.
And Facebook was not picking up the path due this special character may be.
I added a PHP str_replace function. And it worked for me.
str_replace(" ","%20",$image_path)

Converting the same image from JPG to PNG did the work for me.

Related

Cannot embed image/gif to GitHub page

I'm trying to embed a GIF in a GitHub Pages page and tried every single way I found online can work. Here's my link:
https://github.com/jellyfishrui/Interactive-Programming-in-Python-Rice-University/blob/master/Week3/Stopwatch-the-Game/Instructions
The last line of code is the embedding code:
![StopWatch](https://github.com/jellyfishrui/Interactive-Programming-in-Python-Rice-University/blob/master/Week3/Stopwatch-the-Game/StopWatch.gif)
I also tried to embed the PNG (also saved as other formats like JPEG) and changed the extension to upper/lower case. But none of them can help me load the image. I also tried it on different browsers but they just all turned the same.
I tried the absolute/relative path and neither worked.
That file has no file extension but you're trying to use Markdown for the image. Try renaming it to Instructions.md.
Also, make sure the casing of the file matches the file you've uploaded. Guessing what case to use isn't likely to work.

How to resize images included in GitHub documentation pages?

I have a README.rst page on GitHub but I am unable to specify the size of the linked images and really I don't want to include them in my repository.
See https://github.com/pycontribs/jira
Somethink like this was supposed to work, but GitHub seems to ignore the width parameter.
.. image:: http://blog.jetbrains.com/pycharm/files/2015/12/PyCharm_400x400_Twitter_logo_white.png
:width: 100px
Any solutions or workarounds?
It looks like GitHub is intentionally stripping images sizes. The do appear, however, to support embedding raw HTML (reST docs). If that still doesn't work, I'd resize the image files.
This is still an Open issue Gitlab side:
https://gitlab.com/gitlab-org/gitlab/-/issues/24212#note_496673044
And can be found several version of this issue on other closed gitlab issues: e.g. https://gitlab.com/gitlab-org/gitlab-foss/-/issues/28294

Large og:image in feed

I've noticed there are two different ways facebook shows an open graph story with an image in a users' feed: one with a small image and the title and description next to it (example), and one with a larger image with the title and description beneath it (example).
Following a tutorial, I was able to generate the large images. However, now that I'm leaving the tutorial and designing my own script, my posts are always shown with the small image.
Anyone has an idea what's causing this? I'm pretty sure both methods use <meta property="og:image" content="someimage.jpg" />
In order to get the large image format your images must be at least 200x200. However, with the new News Feed rolling out soon, you'll want to make your images even larger. Facebook is now recommending 1200x630 images.
Note that even if you are using an image this large, Facebook may still display your story with a smaller image format. Facebook attempts to auto-optimize the format that it shows to people by continually running A/B tests, and so your posts may show up in any of the available image formats.
We recently wrote a blog post showing the different image formats which you may find helpful.
Use an image that is at least 1200 width by 630 height.
Use the Facebook DEBUG tool to call your page again, thereby clearing the Facebook cached version that you uploaded previously at a smaller size:
https://developers.facebook.com/tools/debug/

Dropzonejs issue with resolution of an image

I have an issue with dropezonejs.
Apparently, when an image has a resolution more than 72dpi, the thumbnail is not generated and everything stop here.
You can try by yourself in the dropzonejs website by uploading different kinds of images. (images <72dpi won't be displayed as thumbnails)
Any ideas to solve this problem?
Probably you're backend doesn't accept CMYK files. I've had the same issue with JAVA ImageIO, we are making an change in the backend to support the upload of a CMYK file

Unable to see any local or remote images in UIWebView when loadHTMLString is used to load page

No matter what I try, the only way I can see any images in my UIWebView, is if I load a page using loadRequest. loadHTMLString will load everything except for images.
I have tried using all the online examples of setting the base url. Nothing seems to work. I've tried setting the base url to my bundle path, no local images display. I've tried setting the base url to http://www.google.com and pasting the google home page source into a test file, load it with loadHTMLString. The page shows up with no images.
What am I doing wrong?
I'd recommend taking a peek at this...
UIWebView links
Also you may notice that between the simulator and the real device files become case sensitive on the device... I'm not sure if UIWebView makes it case insensitive but thought it might be worth mentioning incase it gives any more food for thought.
If this doesn't work perhaps you can post your code snippet as this may help.