Tagged: button, navigation, search
-
AuthorPosts
-
January 22, 2014 at 4:19 am #213163
Hi All,
I love this the WP theme!! I was wondering how I would move the search from the top navigation? Also, I’d like to add a small button to top right of the navigation. Is there a way to do this? If you could tell me how, I’d be forever grateful.
Thanks,
SallyJanuary 22, 2014 at 4:42 am #213168I figured out how to remove the search.
I still need help with adding a small blue button that says ‘Request a Demo’ to the main navigation and need it to align it all the way to the right. Is this possible?
** This is for the Enfold Theme **
- This reply was modified 10 years, 11 months ago by ojooce.
January 22, 2014 at 11:37 am #213244Hi!
Create a custom link on Appearance > Menus, add the url then label it “Request a Demo”. Inspect the menu item then get the menu id. It will something like “#menu-item-2311”. Yours might be different. Add this on Quick CSS:
.sub_menu #menu-item-2311 a { position: relative; width: 100px; background: blue !important; display: block; text-align: center; top: -11px; left: -5px; }
Please give us a link to the website after you added the custom link.
Regards,
IsmaelJanuary 23, 2014 at 5:59 am #213700Thanks for getting back to me Ismael! I was able to create the custom link and got the menu item id. I wasn’t sure what Quick CSS was… can I find it on the dash board? Do I need to go in through FTP to update one of the stylesheets with the code above? If so, which stylesheet would I add it to? Sorry, I am new to all this. Thanks so much for your help and patience.
January 23, 2014 at 11:50 am #213785Don’t wanna highjack the thread, but I was looking for the same solution.
I tried what you suggested, but it doesn´t change the color.
My menu item was 749
You can see the page here http://skadsandrup.dk/forside/January 23, 2014 at 2:32 pm #213851Hi!
Please go to Enfold theme options > Header and simply uncheck “Append search icon to main menu”.
Cheers!
YigitJanuary 23, 2014 at 3:16 pm #213871But what about the button?
January 23, 2014 at 11:58 pm #214186Hi!
,
Can you post a screenshot and show the changes you would like to make? If you want a secondary menu, you should choose one of the header types with secondary navigation in Enfold theme options > HeaderRegards,
YigitJanuary 24, 2014 at 9:03 am #214308No offense Yigit. But have you read this thread?
I want what Ismaels code was suppose to doJanuary 24, 2014 at 3:24 pm #214444Hey!
None taken. and yes, most certainly i did. Ismael’s code starts with .sub_menu which is the class of secondary menu located in header meta section. I checked your website and you do not have secondary menu. That is why i asked you to post a screenshot so we can understand what you need more clearly and maybe find another approach
Cheers!
YigitJanuary 24, 2014 at 4:31 pm #214483Ahhh my mistake
It´s the main menu I want to do it in. Any of the buttons would do, as I can just change the number to correspond with the button, as I understandJanuary 24, 2014 at 4:58 pm #214492Hey!
Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as needed
.main_menu ul:first-child > li#menu-item-315 > a { background-color: red; color: white; } .main_menu ul:first-child > li#menu-item-315:hover > a { background-color: orange; color: black; }
It will change the color and background color of “I Skads og Andrup” menu item. You can apply any other css changes you would like to apply using this css code
Regards,
YigitJanuary 24, 2014 at 5:01 pm #214493Thanks :)
It works. But can I make it smaller, so it´s more like a button and doesn’t fill the whole menu area? If you now what I menaJanuary 24, 2014 at 5:15 pm #214498Hi!
It is possible but as you are using fixed resizing header, transition of that particular menu item would not be as soft as others. Do you mind creating a temporary admin login and posting it here privately so i can make it quickly then you can adjust as desired?
Regards,
YigitJanuary 24, 2014 at 5:16 pm #214500Thanks Yigit – it worked like a charm. However, right now the color is taking up the entire background as a block. How could we incorporate the Enfold Theme styled button (found here: http://kriesi.at/themes/enfold/shortcodes/buttons/). Specifically, I’d like to use the small teal button. Any help would be appreciated. Thank you.
January 24, 2014 at 5:18 pm #214501Hi!
@ojooce Can you post the link to your website so we can check what type of header you are using? You can also check it in Enfold theme options under Header tabCheers!
YigitJanuary 24, 2014 at 5:22 pm #214503This reply has been marked as private.January 24, 2014 at 5:33 pm #214511I´m using small fixed header.
I’m looking for the same as ojooce about the size and more buttonlikeJanuary 25, 2014 at 7:16 am #214747Hi!
Please replace the code using this:
.main_menu #menu-item-2609 a { position: absolute; width: 120px; background: blue !important; display: block; top: -11px; left: -130px; height: 40px; line-height: 40px; color: white; padding: 5px 10px 15px 10px !important; }
Cheers!
IsmaelJanuary 25, 2014 at 8:09 am #214754Thanks Ismael – that’s a lot better. I tweaked the color and size a little bit. Right now the button is at the top of the page away from the navigation… I kinda like it that way. However, if my client wants the button to be aligned with the rest of the top menu, what parameters would I need to change in the code? Thanks again for all your help!
January 25, 2014 at 4:30 pm #214828Hey!
Then you can adjust the code a bit to be as following
.main_menu #menu-item-2609 a { top: 18px; height: 50px; line-height: 30px; }
Cheers!
YigitFebruary 6, 2014 at 7:44 am #220353Thank you! Worked perfectly!
-
AuthorPosts
- The topic ‘Remove Search from Nav and Adding a Button’ is closed to new replies.