Menu bar colour / google map
-
Trying to put the site together right now and I can not figure out how to change the colour of the menu bar at the top (home. about us. contact us)
My other question is how do I get a google map on my page like in the demo.
Thanks
-
Hi there, and thanks for the link to your site. On the menu, this is where the background and font color is set.
.main-navigation { background-color: #f25f70; color: #fff; }The widget on the left of the footer in the demo site is the Contact Info widget. Add that to your sidebar and fill in the information and make sure “Show map” is selected.
The widget is part of Jetpack, and it appears you have it activated on your site.
If you have not yet done so, I would suggest creating a child theme so that any customizations you make will not be overwritten by a future theme update. Alternately you can use the Edit CSS function in the Jetpack plugin, or use one of the other Custom CSS plugins that will keep CSS changes from being overwritten.
Child Themes
Child Theme creation plugins
Jetpack plugin
Custom CSS pluginsIt worked for the colour bar change but now I have run into another problem. How do I change the standard text colour for about us . contact us. the white does not show up and also if I wanted to change the roll over black colour.
Thanks
Since your menu background colour is very light, white text is very hard to read against it.
Give this a try in your custom CSS editor or child theme:
.main-navigation a, .social-links ul a:before { color: #494949; } .menu-toggle, .menu-toggle:hover, .menu-toggle:focus { color: #494949; } .main-navigation.toggled ul ul, .main-navigation.toggled ul ul a { color: #494949; } .main-navigation a:hover, .main-navigation ul > :hover > a, .main-navigation ul > .focus > a { color: #ff290c; } .main-navigation li.current_page_item > a, .main-navigation li.current-menu-item > a { color: #ff290c; } .main-navigation li.current_page_item > a .sub-menu li a, .main-navigation li.current-menu-item > a .sub-menu li a, .main-navigation ul ul li.current_page_item > a, .main-navigation ul ul li.current-menu-item > a { color: #4F4F4F; }This makes your rollover colour and current-page colour red (#ff290c) to match your site but you can change it to anything you like.
Let me know how it goes.
The topic ‘Menu bar colour / google map’ is closed to new replies.
