Reply To: Change logo size

Written by on

› › › › ›

#22654
Indigo
Participant

Here is the fix that I used on this website: http://sistercirclehealingretreats.com/

1. In your WordPress dashboard go to Appearance > Theme Options

2. Go to the “Logo” tab
3. Set the dimensions to 48×48
4. Check the “Automatically insert Logo in Site Title” and “Hide Site Title Text”
5. Click the “Save Settings” button.
6. Once it has saved, click the “Choose Logo” button and add any logo
7. Click the “Save Settings” button.

8. Go to the “Design” tab
9. Copy this code into the “Custom CSS” box


#masthead {
        background-image: url('http://sistercirclehealingretreats.com/wp-content/uploads/2016/10/Sister-Circle-Logo-229x101.jpg');
        background-repeat: no-repeat;
        background-size: contain;
}
.navbar-brand > .site-logo {
        display: none;
}
@media screen and (max-width: 760px){
	h2 {font-size:1.5em}
	h3 {font-size:1.3em}
	h4 {font-size:1.2em}
	h5 {font-size:1.1em}
 
	.login-box{width:98%} 
	.menu-container{background:white;padding:0 !important;overflow-x:hidden;border-bottom:.2em solid #ECECEC !important;padding-bottom:0em !important;margin-top:0.5em; !important} 
	.menu-item{font-weight:bold;width:100%; padding:0 !important;margin-left:0 !important}
	
 
	.home #match_information{font-size:1.2em !important}   
	.home .fixturesbox {font-size:1.1em !important;background:#ECECEC}	
	
	.navbar-default .navbar-nav > .open > a,
	.navbar-default .navbar-nav > .open>a:hover,
	.navbar-default .navbar-nav > .open>a:focus {
	background:#ECECEC !important;color:black !important}
	

	.fixturesbox {font-size:1em;background:white;width:84%;margin-left:2em;height:25em;overflow-y:scroll;margin-bottom:4em;}
	#match_information{font-size:1.1em;margin-left:0em;width:100%;height:auto;border:none}
        #masthead{height:4em !important; background-image: url('http://sistercirclehealingretreats.com/wp-content/uploads/2016/10/Sister-Circle-Logo-229x101.jpg');
	background-repeat:no-repeat;background-size: contain; }

        .slide-container .entry-content{width:90% !important;padding-top:.3em !important ;background:transparent;color:white;}
	.slides .custom-entry{margin-top:2em}
}

10. Click the “Save Settings” button and enjoy 🙂

Note: Change the background-image: url() to the location of your image.