Front-end editing is not working for Modules, the edit button is not functional

chamira

Hello,

I have configured everything correctly for front-end editing on my Joomla 5.1 website with JA Stark installed. The server is on PHP 8.3.x

After logging in to the front-end I can only edit the Article content.

The Module edit button appears sometimes but disappears when I move the cursor towards it. It is a bit like playing hide & seek.

If I do manage to click on it, the edit screen does not load.

However, if I right-click and load it to another browser tab the edit screen does load up correctly.

I have tested this on Firefox and Chrome.

Also, if I switch on the development mode on the Chrome browser and view it as a mobile device, the font-end editing button for Modules is accessible and it works.

I think this issue has been logged recently but as I do not have a active JA subscription I am not sure what the outcome was:

https://www.joomlart.com/forums/d/49424-frontend-editing-not-working-for-modules

saguaros

chamira Hi

It's quite weird as I always see that edit button when hovering a module on frontend:

chamira

Hello Saguaros,

Please note - this issue is only on Modules.

Yes, it appears, but you can't click on it easily. It suddenly disappears.

Even if you are able to click on it, nothing happens.

If you manage to reach it and right-click, you can open it on another browser tab and then it works OK.

Also, have you tried to view this on developer mode & mobile view? Then it works OK a well.

As I mentioned earlier, there is another thread about this but I can't access the solution (if one was found).

May be this is a JS error, since it doesn't work on desktop but does work on mobile?

saguaros

chamira That topic has different issue related to the JS, not the same as yours 🙂

Our team updated a bit custom css rule to fix the issue on your site:

chamira Even if you are able to click on it, nothing happens.

This issue is due to the layout configuration, this homepage has special layout, you should configure its sub-page layout so it can display the edit content of the module:

It's working fine now on your site, kindly check.

chamira

Hello Saguaros,

Thank you for your help and the explanation, it is working now.

I also added this code to custom.css so that the sidebar module editing is also fixed:

.moduletable.jmoddiv {
  position: relative;
}

.moduletable.jmoddiv .btn.jmodedit{
  padding: 0;
}

I really appreciate your help on this.

saguaros

You're so welcome 😉