I am currently modifying a WordPress theme that happens to be a Divi child theme.
I am experiencing an issue where all images on new products are being replaced with a 400×400 thumbnail. I have disabled thumbnails via Settings->Media
and setting everything to 0 and unchecking the option for thumbnails to be auto sized.
My issue is the thousands of images that have been uploaded by the customer are still showing as 400×400. I would like to resize these images by simply removing the “-400×400” substring from the image src via jQuery.
Below is the code that I have written do this; however, I receive no error but it doesn’t correct my problem.
Is anyone aware of how I should be doing this or maybe why my code doesn’t throw an error but doesn’t function either?
var $imgs = $("img.wp-post-image");
$imgs.each(function () {
if ($(this).attr("src").indexOf("-400x400") >= 0) {
var $newsrc = $(this).attr("src").replace("-400x400", "");
$(this).attr("src", $newsrc);
$(this).attr("width", "304");
$(this).attr("height", "400");
}
});
2
Answers
You need to ensure your
custom.js
file loads after jquery is loaded.Right now, your
custom.js
is trying to execute some code before jquery is loaded on the pageAlso, there is a typo in
$imgs.each(fucntion () {
It should read (of course)
function()
Other than that, your code is working. See Fiddle
if you look at the head section of your page, you’ll notice custom.js is loaded before jquery.
try to invert the order