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
Related
My WordPress website takes a lot of time to load pages, a problem that many of us face. I used GT metrix to check my WordPress page and then checked my website waterfall.
One thing I saw taking more than half time of my page is an image which is not uploaded in my website.
check this image of gt metrix waterfall:
I checked it, and I found this is an image which I have not used in my entire webpage. Also I could not find where is this image used.
Same thing happens in different pages that has different images to it.
I deleted one image from my media but now when I check the GT metrix waterfall I get a 404 error code which means its still trying to load that image and I cannot find it.
This is a theme which I had purchased and its not a popular theme like divi or ocean and hence could not contact the support.
How to check where a particular image is used in my webpage using
the media library (can I do that?)
How to find out and remove this image? Or at least is there a way where I can delete the image from the library and hence my webpage should not look for this image wasting its time instead of getting a 404 code
Your problem is quite common indeed, for your specific case i can suggest by starting to search the image name in both code + DB, it MUST be somewhere.
If you cannot find it inside your stuff there's only one answer left: there's some JS third party script that is loading that for you, but in this case i seriously dubt it would be in the same domain as your site.
Using the media library there's not much you can understand, if you are VERY lucky it will have a message like "attached to" but that thing cover like 10% of the cases, most of the time the image ARE used but are not attached to anything like a post, so the media library won't tell you anything
I've had this happen before a few times, too. Isn't it frustrating!? If you could provide a URL, I (and others, I'm sure) would be happy to take a look and try to figure out what's going on. :)
I'm having an issue with my website http://www.ben-drury.co.uk/ (I know the content sounds dumb, but it's my first attempt at a portfolio and it's not finished) where the formatting of the text is very peculiar under a specific set of circumstances.
When loading any post or page in Google Chrome, if I remain in the tab for the duration of the loading it looks like the image below, which is perfect and exactly what I want.
However if I start loading the webpage in a new tab and don't instantly navigate to that new tab, or indeed if I refresh the page and navigate away from the tab, when I come back it looks like the image below.
Interestingly it seems to work absolutely fine in Internet Explorer and Firefox, so initially I thought that it might be an issue with my installation of Google Chrome. However testing it on other computers resulted in the same thing happening, and a variety of different ways of phrasing the issue has turned up very little.
So essentially, how do I fix it for Google Chrome users?
(For those that cannot see the images, the text in the post placed as an example runs outside of the box it should be displayed in and often lines appear over the top of each other around hyper links.)
Update:
I've managed to fix the issue for pages by removing the justified alignment of the text. However I have made said change to the posts as well yet the problem persists for them.
So after a little more delving into the issue, I came to the conclusion that not only was the idea of web safe fonts actually a load of miss-represented nonsense, but that Google fonts might be the way to go. After installing a plugin for Google fonts onto WordPress and making all my posts use one by default, my problem has been entirely resolved and I can even have justified text on my posts and pages.
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
Here is the site that I am working on.
http://afinderskeeper.com/
Here is an example of the logo image that I want at the top
http://afinderskeeper.com/?attachment_id=64
The theme is mayashop, and I am having issues with the images loading. In the media library I am able to see all the images. In the theme options menu in the backend, it asks me to enter the url of the logo image/ favicon/ etc. into the text field. So for the logo, I am simply pasting that second url from above, save, but I still get the placeholder box, not even the correct size.
I was having a redirect issue earlier and couldn't even view any of the images.
It just kept taking a while to load and coming up with a redirect loop. I found online someone had switched the permalink, so I switched mine from "month and name" to "default" and now I can at least see the images on the second link, but I still cannot figure out why they don't show up in the proper places. I hope this makes sense.
I will also mention that I don't really know any php so if this is what it takes, please be very specific for me, thanks!
You're using the wrong urls for the header image and, possibly, the other images that are giving you trouble as well. Instead of referencing http://afinderskeeper.com/?attachment_id=64, you want to edit that image from the media library and get the file url. It will be something like http://afinderskeeper.com/wp-content/uploads/2014/02/afk_header_logo.jpg
I am just a random stranger on the internet, but I have to thank you guys! Your solution fixed a problem on my site that has bugged me for ages!
So, I'm working on a new e-commerce site for my employer, and I've noticed that it displays / functions properly in every browser but IE8 (Which is rather inconveniencing, as about 80% of the office uses IE8.)
The site in question can be found here . When i load the page ( And more specifically, when I refresh a page ) I will sometimes have it saying "(2 items remaining) Waiting for..." and then it just hangs at a blank screen, until I type in a different URL or navigate to a different page.
Can somebody please offer me some insight as to why this might be happening, and what kind of things I can do to regulate it.
I used BrowserStack to test this and I didn't have a problem at all. This could very well be a JavaScript issue.
Try minimizing & concatenating your JS & CSS files. You can also create image sprites instead of loading lots of small images. After all that IE will have less files to download and they'll all be smaller so that should help.
Also, I see you're using WordPress which is a little harder to set up by try loading your JS at the bottom of the page. That way IE doesn't get hung up on a JS file at the top.