Resizing Logo

Tagged: epik, logo

This topic has 8 replies, 2 voices, and was last updated 9 years, 9 months ago by Wes.

Viewing 9 posts - 1 through 9 (of 9 total)

Author

Posts
July 22, 2014 at 2:19 pm #13196
advertisemint
Customer
I wanted to upload a logo, but I wanted it smaller than the 360×164 size. I created an image about 180×82 but when I uploaded it, it was expanded to fit the 360×164 size. How can I upload a smaller logo without it being resized?
July 22, 2014 at 9:49 pm #13217
Wes
Moderator
First change the header image size in your functions.php file to the exact size of your image, and then you’ll be able to upload without cropping the image.

It should look like this –
```
//* Add support for custom header
add_theme_support( 'custom-header', array(
	'width'           => 360,
	'height'          => 164,
	'header-selector' => '.site-title a',
	'header-text'     => false,
) );
```
July 23, 2014 at 7:24 pm #13236
advertisemint
Customer
I change the header size to 180×82 and uploaded an image with the exact dimensions. However, now the header bar has a lot more space between the bottom of the logo and the bottom of the red section. How can I resolve that and make it have the height as your demo version (http://my.studiopress.com/themes/epik/#demo-full). You can see my version online at (http://www.advertisemint.com/). Thanks for your help.
July 23, 2014 at 7:25 pm #13237
advertisemint
Customer
My code looks like this:

`//* Add support for custom header
add_theme_support( ‘custom-header’, array(
‘width’ => 180,
‘height’ => 82,
‘header-selector’ => ‘.site-title a’,
‘header-text’ => false,
) );
July 23, 2014 at 7:57 pm #13239
Wes
Moderator
There is a minimum height set by default in the css on line 2043 –
```
.header-image .site-title a {
    float: left;
    min-height: 164px;
    width: 100%;
}
```
I would change your height to 82px since that’s the size of your image –
```
.header-image .site-title a {
    float: left;
    min-height: 164px;
    width: 100%;
}
```
July 24, 2014 at 2:08 pm #13246
advertisemint
Customer
I made the change, but the logo is still not aligned in the center of the top bar. I would like my header to be the same height as your demo, but right now, its still almost twice the size. How can I keep the logo but make the header the same size as your demo site?

URL: http://www.advertisemint.com
July 24, 2014 at 3:27 pm #13247
Wes
Moderator
The other space (or padding) that you’re seeing is coming from the widget area. Adjust the padding on line 2063 to around 20px and you’ll see that space shrink by half.
```
.header-image .site-header .widget-area {
    padding: 20px 0;
}
```
Once you do that it should look like this – http://i.imgur.com/MkNVJIL.png

…..Which looks good to me. Let me know if you get everything working.
July 24, 2014 at 6:53 pm #13248
advertisemint
Customer
Yep. That did the trick. Thank you so much. I really appreciate your help.

– Brian
July 24, 2014 at 6:54 pm #13249
Wes
Moderator
You’re Welcome!
Author

Posts

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Resizing Logo’ is closed to new replies.