Tagged: header, menu, secondary menu
-
AuthorPosts
-
November 18, 2015 at 12:35 pm #538004
Hello,
I was wondering if it is possible to create a new ‘menu’ with a search funtion, contact information and the secondary menu etc. on the right side of the logo. I have moved the main menu below the logo and now there is a white open space on the right side of this logo. I would like to fill this with a search function, contact information and the secondary menu displayed at the top of the screen (shop, my account etc.). Is this possible and how would I be able to adapt this to my website?
See private part for examples.
Would be great if this possible! Thanks in advance!
- This topic was modified 9 years, 1 month ago by ddijk1.
November 18, 2015 at 12:51 pm #538009Hi ddijk1!
Please refer to this post and add a widget area to your header and add your menu and search form using widget – http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
Regards,
YigitNovember 18, 2015 at 3:09 pm #538167Hello,
Thanks for your fast answer! Very much appreciated.
I have applied the coding you send me but it is not working properly yet.
The menu and the search icon are not working (not able to click the search button or links). Besides that are the search function and menu presented in a vertical way in front of each other while they should be presented next to each other. I have added a picture.
Can I solve this by making a few widgets within the header? And how am I able to make the link working in the widget ‘header’ area?
Would be great if this is possible… Thanks in advance!
November 18, 2015 at 3:22 pm #538184Hey!
Please add following code to Quick CSS as well
#header .widget { z-index: 999; }
Also, can you please post the link to your website?
Best regards,
YigitNovember 18, 2015 at 3:43 pm #538208Hello,
Thanks! I added the code and the links are working now. Now I am wondering whether the two (or later 3) different widgets can be presented next to each other?
I have added my website into the private content area.
November 21, 2015 at 5:38 am #540086Hey!
We modified the code on functions.php then added this code in the Quick CSS field:
.header_widget { position: absolute; right: 50px; padding: 20px; width: 70%; } .header_widget .widget { width: 33%; float: left; position: relative; clear: none; }
Please remove the custom code in the custom.css file:
#header .widget { left: 50%; padding-top: 0; position: absolute; top: 0; transform: translate(-50%); }
Cheers!
IsmaelNovember 22, 2015 at 9:28 pm #540429Works great, thank you!
November 23, 2015 at 9:24 am #540583 -
AuthorPosts
- You must be logged in to reply to this topic.