Staff replied Templates

Height of menu

Asked by Henry Antelo 4 years ago Last activity 4 years ago

I would like you to help me with the configuration of the HELIX ULTIMATE template.

I need to reduce the height of the menu since the distance between the header and the body is very large.

How can it be done?

9 replies

Oldest first Newest first Most helpful
Paul Frankowski Senior Staff
4 years ago

Hola,

to reduce space between header and component area read tip 2 from >> https://www.joomshaper.com/documentation/helix-framework/helix-ultimate-2/customization-tips

Header height you can control in Helix Ultimate options : Basic -> Header | info: https://www.joomshaper.com/documentation/helix-framework/helix-ultimate-2/basic

And to reduce Menu height please correct line-height value using CSS (now you have 110px), I suggest using 60px

.sp-megamenu-parent > li > a, 
.sp-megamenu-parent > li > span {
  line-height: 60px;}
Henry Antelo Asked this
4 years ago

Thanks for answering.

I have reviewed the suggested content and added the custom CSS code.

Unfortunately, I did not manage to reduce the space of the menu area.

Does anyone know how to fix this issue?

Paul Frankowski Senior Staff
4 years ago · edited 
 #offcanvas-toggler {height: 60px;} 
 #offcanvas-toggler,
 .sp-megamenu-parent > li > a, 
 .sp-megamenu-parent > li > span {line-height: 60px; }

Use it inside Template Options - Custom Code - Custom CSS

After using it

foto_8407_2022.jpg

Remember to clean Joomla cache.

Henry Antelo Asked this
4 years ago

Include the CSS code as mentioned (and also clear the cache), but unfortunately nothing happens

What can be done?

Delete all the CSS code that I had and add the necessary one to modify the height of the menu.

Please help me.

Paul Frankowski Senior Staff
4 years ago

:(

Username and password do not match or you do not have an account yet.

Please share access that works. Thx.

Henry Antelo Asked this
4 years ago

Please try again.

Henry Antelo Asked this
4 years ago

To test the modification, please use the attached URL and template.

Henry Antelo Asked this
4 years ago

To test the modification, please use the attached URL and template.

Paul Frankowski Senior Staff
4 years ago · edited

Thanks.
You forgot that you have JCH_Optimze installed and enabled. And it cache views, also from template.
I don't know why you forgot to update Joomla for last few months, I did it, but it was your task! Oh.

I put my CSS code (from above) inside custom.css file - becuase probably you want to use it in all styles.

Log in to reply.