Tagged: Main Menu, Topbarmenu CustomCSS
-
AuthorPosts
-
August 10, 2015 at 7:03 pm #23718
I am looking to change the color and increase the font size of the menu items that appear in the Topbar menu. Currently font is white and would like text and social icons to be slightly larger. Is this something that will need to be done through CSS? I tried adding the following to the Custom CSS Box to alter the color but this didn’t work (out of my comfort zone so school errors likely!).
div.topbarmenu {
color:#74219e;
}
Grateful for any help.
August 11, 2015 at 5:13 am #23719I think I’ve solved my problem. Took some code from ssexpress.css and placed that in the Custom CSS area and amended it. A little trial an error to see what did what allowed me to get the result I was looking for.
August 11, 2015 at 7:34 am #23720Ok I give up and have reached the limit of my meagre programming. I am now wishing to amend some of the attributes on the primary menu. I think it is called nav-main but is far more complicated than the topper menu. I have put a couple of social icons in this menu and wish to reduce the wrapper they appear in so that the spacing of the menu looks better. Again I would image to do this via custom css but am struggling to find any code that does what I am looking for. The menu can be seen on the site at http://www.tjfrog.co.uk. Any help gratefully received.
August 11, 2015 at 3:55 pm #23722August 11, 2015 at 4:22 pm #23723Robin, as ever thanks for the prompt reply and will wait until Dawn comes back and then possibly speak with Henri. I am happy using child themes but would still face the problem of finding/following the bit of code that needs amending. I am getting better at using the code inspector but still not an area that I would say I am proficient in.
August 25, 2015 at 12:23 am #23809Hi Geraint, this is how you can change the font size and font color of your Topbar menu:
1) In your WP dashboard go to Symbiostock Express > Advanced Settings
2) In the space provided for Custom CSS paste the following:
.topbarmenu ul li a {
font-size: 15px;
color: #74219e;
}You can increase/decrease the font size to your liking. If you find that increasing the font size makes your Topbar menu flow into two lines and you want to keep the single line look then also include this into the Custom CSS area:
.kad-topbar-left {
width:100%;
}Let me know how you went!
August 26, 2015 at 8:20 pm #23818Dawn, thank you for a far more elegant way of amending the topper menu than I managed. Is there something similar to amend the primary menu? Geraint
-
AuthorPosts
You must be logged in to reply to this topic.