We have migrated to joomla 4 (with a lot of problems).
Figured out most of them, but we have ONE very important problem.
On the OPUS template, the "transparent-class" in the menu edit it's not working anymore, why?
I have attached a screenshot.
We desperately need this class to work, we have tried custom css, but the results are not the same as the class from the J3.
Hi Tg,
I guess we talk about transparent header/menu from: https://demo.joomshaper.com/2018/opus/
You forgot to put link to screenshot image,
Of you don't mind maybe share link to your website it will be eaiser for me/us to find out the solution.
Here is the screenshot
Not working under J4 migration.
The width of the template was not ok, a lot of settings etc.
This is a must - the transparent menu - it has to work. We can find workarounds for other elements, but this is unacceptable.
Also - UNEI template has no J4 support, and we have a lot of websites developed under UNEI.
About Unei - I guess you have to wait for offcial template update.
Can you share link to website where you have that class already, it will be eaiser for me.
Due to sensitive content, only the homepage it's published.
All I see is a Offline mode with LOGIN screen
sorry,
Check now please.
Please disable CSS compression from JCH_Optimize
for test/developement website is not neeeded, it only makes all harder
Done that
In general CSS is very similar as it was (or even that same)
.transparent-header #sp-header {
background: transparent;
position: absolute;
}
.transparent-header #sp-header::before {
background: transparent;
opacity: 0; }
.transparent-header #sp-header.header-sticky {
position: fixed; }maybe, but the class has disappeared.
This was usefull, because on some pages - text based, articles - we had the normal menu bar, without the transparency class.
I didn't check so deeply. I gave you CSS that we used in J3 version, and hopefully still works.
Would appreciate if the J4 templates had no changes from the J3 ones.
Thanks for the moment, have a good day!
There is another problem.
The header is not working on mobile and tablet mode.
The transparent header it's not working on mobile or tablet
Test Website is live.
Can you disable preloader (in template options), it doesn't make sense to use it. Really!
Done
You have that inside your custom CSS
@media (min-width: 1100px) {
.transparent-header #sp-header {
background: transparent;
position: absolute;}
}it means set transparent header for laptops and desktops, not mobile devices.Yes, because we wanted to compensate with the template width problem.
All templates after the updates do not have the same widht as before. Why is this? Because this is very problematic with all the text content, modules, feature boxes, everything.
Because of this, we had to find solutions.