Side menu CSS

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #14530
    Ima User
    Member

    Hello,

    Where can I change the font styles for the side menu in Celestial?

    Here is the site and I am referring to the side menu.

    http://www.catawbashoresestatespoa.com/utilities-services/

    Thank you for your help!

    #18910
    Sushil Adhikari
    Moderator

    I didn’t make it overly easy for this…sorry about that. But the font is found in the style.css around line 1888

    .main-navigation li {
    	list-style:none;
    	background-image:none;
    	margin-top: 20px;
    	padding-left:0;
    	font-family: ubuntu-light,abel,sans-serif;
    	font-size: 1em;
    	line-height: 1.42857143;
    }

    So if you want to change this, best to use a CSS editor plugin or child theme rather than edit this directly in the theme file itself. When updating the theme, you will lose your changes.

    When changing the font, you would just copy this and do your own font and styling:

    .main-navigation li {
    	add your font styling here
    }

    Your other option would be to use a Font plugin which will also do the same thing but does give you more options.

    #18911
    Ima User
    Member

    Thank you for your quick response! One more question, where can I change the bullets for the side menu. Is that done in same place? Can I change it to a different symbol instead of the outline of a circle?

    Thanks again!!!

    #14531
    Sushil Adhikari
    Moderator

    That is going to be a bit more tricky, but it’s found line 1206 in the style.css

    .widget_categories li,
    .widget_archive li,
    .widget_pages li,
    .widget_meta li,
    .widget_recent_comments li,
    .widget_recent_entries li,
    .widget_nav_menu li {
    	border-bottom:1px solid #dedede;
    	line-height:18px;
    	line-height:1.125rem;
    	padding:8px 0 8px 20px;
    	font-style: bold;
    	background: url('images/sprite-list.png') 0 -714px no-repeat;
    }

    It’s using an image sprite (a group of images as one image). But you can change it to whatever you want.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.