
-
AuthorPosts
-
December 13, 2013 at 7:12 am #199775
I am trying to get that desired effect in the top menu, where two items (live chat and contact us buttons) will have little icon graphic and be a different color…. how can i that using css
thank you
December 13, 2013 at 9:11 am #199808Hey kecster2!
Edit header.php, find this code:
/* * Hook that can be used for plugins and theme extensions (currently: the wpml language selector) */ do_action('avia_meta_header'); echo '</nav>';
Below, add this code:
echo "<div class='header-buttons'>"; echo "<a href='' class='header-button header-chat'>LIVE CHAT Online</a>"; echo "<a href='' class='header-button header-contact'>Contact Us</a>"; echo "</div>";
Edit Quick CSS or custom.css then use this
.header-buttons { position: absolute; right: 0; border: none; } .header_color .header-buttons a { display: block; padding: 5px 10px 5px 20px; float: left; color: white; } .header-buttons a.header-contact{ background: green url(ICON URL HERE) left center no-repeat; } .header-buttons a.header-chat{ background: blue url(ICON URL HERE) left center no-repeat; }
You need to provide your own icon image as background. It should be transparent.
Regards,
IsmaelDecember 13, 2013 at 4:36 pm #199961k. i have done everything you said and this is my result
I need to have those two new items at the top of the page to replace the current ones
December 13, 2013 at 8:01 pm #200058can you please help me out..
December 15, 2013 at 6:21 pm #200446Hi!
Please add following code to Quick CSS in Enfold theme options under Styling tab
.header-buttons { top: 0; } .sub_menu { display: none; }
It should look like this http://i.imgur.com/bSkhdZs.jpg
Best regards,
YigitDecember 19, 2013 at 11:20 pm #202296it looks great, can i add menu items to the left of that top blue bar …
December 20, 2013 at 1:35 am #202332Hey!
You can remove following code from Quick CSS
.sub_menu { display: none; }
And go to Appearance > Menus and create a new menu, add menu items you would like to display on header meta and check Enfold secondary menu. You may need to adjust the position using custom CSS, let us know and we can help you out
Best regards,
YigitDecember 20, 2013 at 2:29 am #202363check it out.. its looking almost there…
now how can i move all the newly added menu items to the left (left aligned)..
plus, change the colors of that menu to whiteDecember 20, 2013 at 2:31 am #202365Hi!
Please add following code to Quick CSS as well
.sub_menu { left: 0; } .sub_menu>ul>li>a { color: white!important; }
Best regards,
YigitDecember 20, 2013 at 2:56 am #202376thank you
-
AuthorPosts
- The topic ‘menu color’ is closed to new replies.