I have been trying to figure out why each image on my WordPress site is resulting in the following code being changed in all images I upload:
<figure class="wp-block-image size-large image-shadow img"><a href="https://www.example.com/blog-post-title/" target="_blank" rel="noopener noreferrer"><img width="600" height="400" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.example.com/wp-content/uploads/2020/08/blog-post-title-image-1.jpg" alt="image description" class="wp-image-18844 lazyload" data-srcset="https://i1.wp.com/www.example.com/wp-content/uploads/2020/08/blog-post-title-image-1.jpg?w=600&ssl=1 600w, https://i1.wp.com/www.example.com/wp-content/uploads/2020/08/blog-post-title-image-1.jpg?resize=300%2C200&ssl=1 300w" sizes="(max-width: 600px) 100vw, 600px" /><noscript>
This results in Ahrefs scans displaying 404 errors for all URLs; for example, the URL below loads fine, but there is an added /images/gif to the string.
https://www.example.com/blog-post-title/
becomes
https://www.example.com/blog-post-title/images/gif
in the Ahrefs report coming from the crawl. It seems from what I have been able to find out that the issue may be coming from here:
src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"
I host on SiteGround and use their CloudFlare addon with some settings applied through my CloudFlare account.
Has anyone else encountered these 404 errors? If so, may I ask how they were resolved?
I've experimented with various redirects to the post (which haven't worked and maybe the completely wrong thing to do).
It seems that this issue was triggered by the JetPack Lazy Load settings. These have since been turned off and the issue has been resolved.
Related
After installing and configuring a few plugins to optimize the cache and increase my score, my images refuse to appear on client pages. Even in the library they are not displayed. however the links of his images are very real and they lead to the images in the folder. I then uninstalled these plugins and clear the cache but still nothing.
Here are the plugins:
GT metrix
WP fastest cache
Shortpixel image optimize
Lazy load - optimize images
Lazy load - optimize images
Hey Giovani, this is probably messing up something, you should just remove it. (Just a wild guess, with no code nor link to your website, no wizards tricks)
Lazyloading has since been incorporated as a default feature on most major web browsers.
You can use loading="lazy" in you image tag <img src"" alt="" loading="lazy" >
No library needed, by using loading="lazy" if an image need to be lazy loaded, the browser knows it and will to it by default
https://web.dev/native-lazy-loading/
https://caniuse.com/#feat=loading-lazy-attr
Hope this will help you
I am using lazy sizes for the lazy load of my youtube videos. On every page the lazy load does work, but not on these two, more precisely, the whole video just disappears/is not displayed. The two pages are in the same folder as all other pages, which do work. The link to lazysizes.js is there <script src="lazysizes.min.js" async></script>
Here is the iframe on one of the working pages with the video being displayed:
<iframe width="640" height="360" data-src="https://www.youtube.com/embed/xxx?rel=0" importance="low" loading="lazy" frameborder="0" class="lazyload" allow="encrypted-media" allowfullscreen></iframe>
and here the iframe that just won't work/does not display the video - it's identical:
<iframe width="640" height="360" data-src="https://www.youtube.com/embed/3FOZ2CTaaWk?rel=0" importance="low" loading="lazy" class="lazyload" frameborder="0" allow="encrypted-media" allowfullscreen></iframe>
I know this just doesn't make sense, but my hope is that one of you stumbled upon the same problem. I have tried copying and pasting (swapped them, so it is not really the iframe code) and changing it, reloading the js etc. but nothing helps. The iframe is identical with the other pages. I have no idea how to find out what's missing here.
I'm stupid, the console revealed it: the lazysizes.min.js was loaded into the directory of this particular URL. Since this URL (and its /.../ directory) is artificially created the lazysizes.min.js could not be found in that directory (though on the FTP server the js file is in the same directory as the source php file that loads it) it could not be loaded.
A simple line of extra code that includes the lazysizes.min.js above the iframe embedment with an absolute URL to the js file solved the problem!
Fighting with this for a few hours now.. This HP Web Inspect is complaining about my images folder throwing a 403 when it should be a 404. so I use hiddenSegments to hide it but then the images don't display. Help! :)
As far as i experienced, When deploying a project in website much better to move out all images and put it in a project folder itself. do not use any image folder.
You have some option:
1. <img src="images/img.png" />
2. <img src="~img.png" />
3. <img src="img.png" />
4. <img src="~images/img.png" />
My work is using with number 1 and dont have any problem in IIS.
but the option is if not working then this is the time that you have to move it out from its folder.
Good luck!
I slightly extended the discovermeteor tutorial and added an image to every post in post_item.html:
<img src="discover.png" height="40px" />
After putting discover.png in the public folder everything seems to work as expected. However if you open the detail page (click on 'discuss') and come back to the overview (click on 'microscope' in the header) the pictures or not loading anymore. It happens in Safari and Firefox, in Chrome it's still working as expected. I put the example on http://img-notloading-safari.meteor.com
I don't know if this has something to do with it, but I noticed, the 'waitOn' function of iron:router is called twice when the overview is loaded in the beginning, but only once when I come back form the detail view and the pictures are not loading.
Any hint would be highly appreciated.
I looked at network requests in Firefox and for some reason it tries to load http://img-notloading-safari.meteor.com/posts/discover.png, which is not there. Maybe this happens because the template is rendered before the url changes.
I suggest you changing the url of the image in <img src= from discover.png, which is a relative url, to a /discover.png, that is, to absolute path.
I was inspecting browser elements on a Wordpress 3.4.1 site and came across an iframe I don't recognize.
<body class=" customize-support">
<iframe src="http://mickajoin.tumblr.com/?d=www.example.net" frameborder="0" marginwidth="0px" marginheight="0px" scrolling="no" width="0px" height="0px"></iframe>
<div id="wrapper">
...
Of course http://mickajoin.tumblr.com doesn't exist so this returns 404 anyway. Searching the project resulted in nothing. Google returned nothing relevant.
Initially I thought it was the Gallery plugin. I disabled it and the iframe persisted. I've also deactivated the other 2 third-party plugins use on the site. None of this worked.
I'm hoping someone can point to me the sources of where this could be injected.
Thanks for the tip on the extension. Turns out it was Pokemon Tower Defense HD 5.6 for me. ^_^