Solved Helix Framework

Menu issue after upgrading to Joomla 6

Asked by Marlon 6 months ago Last activity 5 months ago

Hello, I have 18 websites to upgrade to Joomla 6 and I have an issue with the first upgrade. After replacing the helixultimate.php file I was able to successfully upgrade from Joomla 4 to Joomla 6, however, some of the menus are broken and when selected, the header shifts and the page edit button displays in the header area pushing sp-header down missaligning the entire menu.

Normal: https://prnt.sc/jAStwEaxhq44
Shifted: https://prnt.sc/pHFxctC4GDX_

Also, when updating the Predefined Headers in Helix Ultimate, the change doesn't update and the system displays "Drafting...".

Can you please take a look.

Accepted answer

Marked as the solution

Ziaul Kabir Staff

5 months ago

Regarding the menu issue, it appears to be caused by CSS on the site. Please add the following CSS to:

/templates/shadvintech/css/custom.css

body:not(.itemid-101) section#sp-section-1 {
    margin-top: -64px;
    padding-top: 64px;
}

After adding it, please clear both your Joomla cache and browser cache.

4 more replies

Ziaul Kabir Staff

6 months ago

Hello Marlon,

Thank you for your message.

I have checked the issue from my end, and everything appears to be working correctly. For example, when clicking on the “Health Corner” menu, the header and layout behave normally without any shifting.

It seems the issue might not be replicating on our side.

Could you please double-check and provide the correct login credentials? The current credentials appear to be incorrect or not working for us.

Additionally, if possible, please share the exact menu item(s) where the issue occurs, along with an updated screenshot or screen recording. This will help us investigate more accurately.

Looking forward to your response.

Thank you.

Marlon Asked this

6 months ago

Hello Ziaul,

Thank you for checking. However, did you see the instructions in the private area for how to view the issue? Did you update the host file on your computer to point to my new server? Otherwise you're viewing the Joomla 4 website and not the Joomla 6 site.

I may have to point the DNS to the new server remove some friction. I'll respond back once the DNS has propagated.

Ziaul Kabir Staff

6 months ago

Please let us know once it’s ready, and we’ll review it again.

Thank you for your patience.

Best regards,

Marlon Asked this

5 months ago · edited

Hello Ziaul, I've recreate the issue on the new server. I've updated the website on a test install to Joomla 5x and some menus are broken when selected, the header shifts and the page edit button displays in the header area pushing sp-header down missaligning the entire menu. Select any sub-menu under About Us to see the issue, https://dev.shadvin.com/buxtonfriendshipmuseum/about-us/buxton.

New issue: There is an error in the html when adding the logo using Helix Ultimate. There is a 1x in the html. Should that be 90px as specified as the Logo Height?
<img class="logo-image " srcset="/https://dev.shadvin.com/buxtonfriendshipmuseum/images/buxton-friendship-museum-logo-300.jpg 1x" src="/https://dev.shadvin.com/buxtonfriendshipmuseum/images/buxton-friendship-museum-logo-300.jpg" height="90px" alt="Buxton Friendship Museum & Archives Logo">

Ziaul Kabir Staff

5 months ago

Hi,

For the logo, this is normal behavior. Helix Ultimate generates the srcset automatically. Since you currently have only the main logo added, it shows as 1x. If additional logo sizes (e.g., retina versions) are provided, they will be included there.

Screenshot: https://imgur.com/a/kyST2gI

Also for edit button, it only appear if you have front end admin login, normal visitor or user will not see this.

Regarding the menu issue, it appears to be caused by CSS on the site. Please add the following CSS to:

/templates/shadvintech/css/custom.css

body:not(.itemid-101) section#sp-section-1 {
    margin-top: -64px;
    padding-top: 64px;
}

After adding it, please clear both your Joomla cache and browser cache.

If you encounter any issues while saving the CSS, you may need to temporarily disable ModSecurity on your hosting server. If everything saves fine, you can ignore this step.

Thanks!

Marlon Asked this

5 months ago

Thank you for the explanation about the logo Ziaul, and I understand that the edit button only displays in the frontend when logged in as an admin. However, there is still an issue with the menu even when not logged in as an admin. I've added the CSS you shared above, deleted all cached, even signed out as admin, and tried a different browser, but there is still an issue with one of the menus. The Edit button still displays. Please see the screenshot https://prnt.sc/My3gsK9-who1. This is the broken page: https://dev.shadvin.com/buxtonfriendshipmuseum/about-us/news-updates.

This was not an issue in Joomla 4, therefore I want to be sure I know how to fix this before upgrading the remaining websites.

There is also an issue in Joomla 5 with Helix Ultimate. When I open the Helix site template, then select Advanced > SCSS > Compile to CSS > then toggle the switch, the page no longer saves, an error displays below, and Drafting.... displays by the Save button but the save process never completes. I have to close the page then reenter the template. https://prnt.sc/arYyQuhLyjdo

Thanks again for your help.

Ziaul Kabir Staff

5 months ago

I see your page is correct: https://prnt.sc/TfT1o8jilswu

About error undefined, i think you didn't read my previous properly. I mentioned this issues.

Again:

If you encounter any issues while saving the CSS or anything in Template Styles, you may need to temporarily disable ModSecurity on your hosting server. Contact with your hosting administrator, they can help with this issues.

Thanks!

Marlon Asked this

5 months ago

My mistake Ziaul, you're right I forgot about mod security, once I disabled it I was able to save changed to the template. However, I still have menu misalignment issues. I don't know what what to do.