• Resolved markussss

    (@markussss)


    Hi,

    I think the plugin cannot really be used when you use Elementor.
    Perhaps this happens to other page builders as well.
    Perhaps this happens in general when using the CSS background property

    background-image: url(https://test.com/wp-content/uploads/2022/05/testimage.jpg);
    }

    https://www.w3schools.com/cssref/pr_background-image.asp

    Steps
    1. Create new page
    2. Add a section and add a background image testimage.jpg to the section (this will use CSS background-image property
    3. Add a second section and add a normal image testimage.jpg to the page
    4. Publish the page
    5. Rename the image from testimage.jpg to newname.jpg
    6. Just in case purge cache

    Expected result
    The page shows the background image and the ordinary image

    Actual result
    The ordinary image is shown. It references to newname.jpg
    The background image is not shown. It still references to testimage.jpg and throws an 404 error

    best regards
    Markus

Viewing 15 replies - 1 through 15 (of 20 total)
  • Thread Starter markussss

    (@markussss)

    I did some further testing and can add that it does work with DIVI (images and background image for a section).

    Hence, this is obviously related to Elementor.

    I also tested this with Phoenix Media Rename instead of your plugin. The same issue is happening there as well, so perhaps the both of you can share your findings if you want to try to fix it

    https://wordpress.org/support/topic/background-images-are-not-updated-404-error/#post-15740504

    Thanks in advance!

    Plugin Author Jordy Meow

    (@tigroumeow)

    Hi @markussss,

    Indeed, Elementor encodes its data, and therefore it is impossible to find/replace specific strings in it. One way would be to process each post one by one, it’s what I do with Media Cleaner for example, and that plugin of mine can find the images and their names; but that’s a very long and painful process that would not fit the experience of a plugin that rename files (that should be fast, it should take hours or days for each rename).

    I am actually thinking on how to warn the users of Elementor when they install the plugin, as they should be extra careful.

    What sadden me a bit is that Elementor is a really famous plugin, and they use paths directly, they should really use the IDs of the images, that would work out of the box and avoid this issue.

    Plugin Author Jordy Meow

    (@tigroumeow)

    By the way, if there is an alternative solution, of if the Elementor Team has an idea on how it would be possible to rename files and have them updated in their encoded data, I would be happy to hear 🙂 You are a customer of Elementor? If yes, could you maybe contact the support, ask them and/or give them the link to this thread?

    Thread Starter markussss

    (@markussss)

    Hi @tigroumeow

    Thanks for explaining. It’s really unfortunate, I noticed other issues as well with Elementor when it comes to search/replace URLs with the Better Search Replace plugin. I am not sure if those issues are related but it’s also because Elementor stores the data in its “own encoded format” in the database.

    In this case (background images not renamed), it is probably stored in the CSS files.

    Renaming does work at least with ordinary images.
    The issue is only with the background images (goes into CSS).

    Such a plugin you offer is very delicate because it must work, otherwise the site will break. In my case I invested about a full day to manually fix this, hence I am looking for a solution, as this could easily happen to many others as well.

    I doubt that the Elementor support team can do much about it, but I opened a feature request on Github and refer to this post
    https://github.com/elementor/elementor/issues/18942

    Plugin Author Jordy Meow

    (@tigroumeow)

    Thanks a lot for opening this; maybe they will bring an idea, that would be really be nice of them.

    Thread Starter markussss

    (@markussss)

    I also posted and explained this in the Elementor Facebook community … the response from the community was not that positive.

    Basically they said, just name your images correctly before uploading it, or use the media replace plugin.

    They didn’t understand that this is wayyyy more work than just renaming. And renaming in general does work, only for Elementor background images it doesn’t.

    Plugin Author Jordy Meow

    (@tigroumeow)

    The Media Replace plugin wouldn’t do anything except replacing an image by another (using the same file name).

    Elementor should really use IDs to point at the medias instead of paths, that’s it. Like WordPress use IDs to reference posts, not their titles or content.

    Problem is that they built it like this at the beginning, and they can’t really go back. Modern page builders usually don’t have this issue.

    Thread Starter markussss

    (@markussss)

    Oh I remember from the discussions in the Elementor community, that there was an argument that using the ID instead of the path requires an additional lookup, hence impacts the performance (not coming from Elementor but from the community)

    I understand that there is nothing you could do about it, except running through all the CSS files which hardly can’t be meaningful and probably would bring a ton of other issues

    From now on, I tell clients basically that they could use the plugin to rename images, but that it’ll lead to broken links for the background images, so that they can only perform it on normal images (difficult for the client to understand of course)

    Plugin Author Jordy Meow

    (@tigroumeow)

    Oh I remember from the discussions in the Elementor community, that there was an argument that using the ID instead of the path requires an additional lookup, hence impacts the performance (not coming from Elementor but from the community)

    Yes, but they could cache it; all their encoded data takes time to process anyway, so maybe they already have cache on this 😉 And there aren’t many WordPress sites which work without any caching (using plugins, DB caching, or caching at the server level). It’s really not an excuse.

    I understand that there is nothing you could do about it, except running through all the CSS files which hardly can’t be meaningful and probably would bring a ton of other issues

    The only way would be to go through all the posts, decode them, search/replace, and re-encode. I am already analyzing Elementor data in my [Media Cleaner](https://wordpress.org/plugins/media-cleaner/) plugin, the problem is that it wouldn’t make sense for a file renamer to process the data for hours for every rename 🙂

    Thread Starter markussss

    (@markussss)

    I can totally see your point and understand that … checkmate! It simply won’t do, unless Elementor comes to its senses in this particular case.

    If you manage to add a warning somehow, that could probably save people who use Elementor + your plugin quite some headache. Background images simply can’t be renamed.

    Plugin Author Jordy Meow

    (@tigroumeow)

    If you manage to add a warning somehow, that could probably save people who use Elementor + your plugin quite some headache. Background images simply can’t be renamed.

    You are saying that the only issue right now is with the background images? The renaming works with all the other Elementor modules?

    Thread Starter markussss

    (@markussss)

    I tested on 2 sites. My client renamed approx. 500 images on an Elementor site with WooCommerce + JetEngine + Dynamic.ooo + Permalink Manager Pro ..to name the most important plugins.

    The renaming worked all the time, except for images that are added as a background image (e.g. section/column background). Of course, I couldn’t test all the available widgets of Elementor, e.g. not sure if the image in an CTA module is added as a background image or as an image.

    However, right now, I tested on a 3rd site.

    Surprisingly, it did work there.

    I am overly confused, and perhaps need to go back to start with troubleshooting

    Thread Starter markussss

    (@markussss)

    Just a quick further input – might be of interest – might be not – but worth sharing

    The other plugin I referenced already and you name yourself in your plugin description implemented a “solution” for the issue with Elementor background images

    Not sure if this is interesting for you, but perhaps it helps to share knowledge
    https://wordpress.org/support/topic/background-images-are-not-updated-404-error/#post-15788921

    Have a wonderful weekend!

    Plugin Author Jordy Meow

    (@tigroumeow)

    Hi @markussss,

    Indeed, I can see how he implemented it 🙂 That’s what I was talking about earlier; encoding and decoding each post individually in order to perform the rename.

    That would work fine on a test and simple install, but on a real install with many posts, the process would take forever, times out with a lot (lots!) of side effects in production.

    I can provide a code snippet that could do the same thing within Media File Renamer, but I wouldn’t implement it directly (or it could be an option, checked out by default, with a warning in the case it’s enabled). The real solution would be to implement it in a way that it’s processed little by little, through small requests and a progress bar (which can be done easily in my case since I have my own dashboard over it).

    Thread Starter markussss

    (@markussss)

    Hi @tigroumeow

    Thanks for taking all the time to go over my messages (feeling guilty already, but who thought that this was such a big topic in the end)

    I cannot say what would be the best approach, as you clearly have a better understanding of this. I am just the careful user / admin who noticed that the renaming (with Elementor enabled) can lead to quite some troubles.

    In the end it’s up to you .. if you find it useful to add an additional function to make the plugin more reliable and compatible that’s definitely in the interest of everyone (even though many ppl would’t be even aware of it)

    If you move on with this topic, perhaps you can comment in here to let me know.

    Thanks

Viewing 15 replies - 1 through 15 (of 20 total)
  • The topic ‘Background images broken after renaming (Elementor)’ is closed to new replies.