Vario Home Page

[huntingensemble]

Hi Guys,

I would like to use the Vario Demo slider on our homepage.
Is there a way to acomplish this? So only the slider effect?

Thanks,
Joost

[Kyle – SUPPORT]

Hi

You mean you want to set up a similar slider? Or use that exact slider?

– Kyle

[huntingensemble]

HI Kyle,

I would like to set up a similar slider (which also uses the header menu as slide area).

Best,
Joost

[Kyle – SUPPORT]

You would just need to create a slider, add it to the page via the page meta options, then set the header as ‘naked – light’

– Kyle

[huntingensemble]

Hi Kyle,

Sorry for my delayed response.

Thanks work like a charm! If I want to set the font colour of the menu to black and the drop down menu not with white background but only plain text (also black) how do I accomplish that for only the homepage slider menu (which will be overlayed on the slider)

So I mean a custom menu for only the homepage because of the slider, and when you click on a menu item, regular menu takes over.

Hope my question is clear and thanks for the help.
Joost

[Rui Guerreiro – SUPPORT]

Hi,

Can you provide a mockup image of the desired menu and also the url to that specific page?
Thanks

-Rui

[huntingensemble]

Hi Rui,

See here: https://www.thehuntingensemble.nl/tester/

I want the drop down menu’s be the same as the main category header items (white with no background).
But only for the page were the slider is. When you click on a menu item it should go normal header.

Is that technically possible?
Best,
Joost

[David Martin – Support]

Hi,

So you want this page’s menu: https://www.thehuntingensemble.nl/tester/ to be like this: https://www.thehuntingensemble.nl/product-category/t-shirts/norse-projects-t-shirts/ ?

Cheers,
David.

[huntingensemble]

This reply has been marked as private.

[David Martin – Support]

Hi Joost,

I don’t really get it, the dropdown you want white text? What about the white dropdown background color?

-David.

[huntingensemble]

Hi David,

Sorry for not being clear enough.
I just want the dropdown to be the same as the main menu items, so no background colour (transparent) and text in white.
And only for the page were the header is other pages should stay the same as they are right now.

Sorry for the difficult question.

Best,
Joost

[David Martin – Support]

Ah ok I am following now.

So the basic code would be this. To apply it to just a specific page and not all naked header pages, you can add an extra class in the page meta options and then prefix the below with the extra class.

.page-header-naked-light nav .menu ul.sub-menu, 
.page-header-naked-light li.menu-item.sf-mega-menu > ul.sub-menu > div {
    background: transparent;
    border: none !important;
}

.page-header-naked-light nav .menu ul.sub-menu li.menu-item > a, 
.page-header-naked-light nav .menu ul.sub-menu li > span, nav.std-menu ul.sub-menu {
    color: #fff !important;
}

Thanks,
David.

[huntingensemble]

Hi David,

This is amazing! Thank you.
What if I would use the extra class in the page meta called: tester. how do I make it as a prefix in CSS?

Thanks again for you help! really appreciate it.
Joost

[huntingensemble]

This reply has been marked as private.

[David Martin – Support]

Hi,

This was because there was an error in the CSS, the media above where you pasted the code was missing a closing }

Please check now: https://www.thehuntingensemble.nl/tester/

You can add your class .tester at the start of each new line. Ex:

.tester .page-header-naked-light nav .menu ul.sub-menu, 
.tester .page-header-naked-light li.menu-item.sf-mega-menu > ul.sub-menu > div {
    background: transparent;
    border: none !important;
}
 
.tester .page-header-naked-light nav .menu ul.sub-menu li.menu-item > a, 
.tester.page-header-naked-light nav .menu ul.sub-menu li > span, nav.std-menu ul.sub-menu {
    color: #fff !important;
}

Cheers,
David.