Staff replied Helix Framework

Need help with Helix Ultimate header and menu layout

Asked by Amy 3 years ago Last activity 3 years ago

Hello, I am setting up my websites colour sheme and layout in Helix Ultimate before I build the content with SP Page Builder but I am having some issues with styling it correctly.

Firstly I can't seem to change the header background colour behind the logo unless I try to make a custom header but when I do that the Logo is off centre and I don't know how to fix that.

and the menu off canvas button is stuck next to my logo on the custom header rather than in the menu as I would like it.

Ideally I would like to disable the menu and have the menu set up as buttons, I can do this with SP page builder if I disable the meny in healix utlimate template?

I have left my website with the predefined header I can't change the colour of and under it the custon menu I tried to make with the off centre logo.

Any help with centering the logo, moving the off canvas button, changing the colours and having a menu with buttons would help me please.

my website is http://www.bun-e.com

9 replies

Mehtaz Afsana Borsha Staff

Hi

Thanks for contacting us. Could you please give me a screenshot of your issue?

-Regards.

Amy Asked this

Hello, Yes, here is a screenshot.

I have built a second header and menu under the predetermined one because I am unable to change the background colour for the predermined header only the menu changes to my selected colour.

I would like to know how I can centre the logo and the menu underneath it like the predetermined header and menu I have at the top, I also would like to know how to move the off canvas menu button to the menu instead of next to the logo so I can disable the predermined header and use my new one.

I ask because I can not change the background colour of the predetermined header it only uses my body background colour so I am building a new header and menu but I need help getting it right.

Mehtaz Afsana Borsha Staff

For logo you can use this custom CSS


.logo {
    display: flex;
    justify-content: center;
    align-items: center;
}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

But is this your test site? I mean it does not look normal to me.

Amy Asked this

it is not a test site, I am using the sample helix ultimate template from the quick start pack but I unpublished the menu sections, body and the footer so I can focus on building the header and menu first. Is this why you think it doesn't look normal?

Is there a similar CSS code to allign the menu to the centre and to also move the off canvas menu button to the menu the same as the predetermined header?

Becasue I am just trying to replicate the predermined menu so I can change its background colour different to the body colour.

Amy Asked this

Yes I am trying to replicate the "Multiple Rows" predetermined header in Helix Ultimate. With the logo centered and the menu centered below it.

Another question I have but is it possible to build a header and menu that is used over all pages using SP Page Builder Pro?

Because ideally I would like to have my menu made of buttons not just text.

Mehtaz Afsana Borsha Staff

I cant access your site today. Please check.

Amy Asked this

I found I can create the header and menu as part of an SP page builder page. So I am doing it that way now.

I do have another issue though related to how to properly display the sp page builder page on my website. I asked the question here.

https://www.joomshaper.com/forum/question/20348

thanks!

Mehtaz Afsana Borsha Staff

Ok wait then team will help you.

Log in to reply.