Delight Theme: How to replace header with logo?

meandbabye · Member · Jun 13, 2014 at 12:31 am
Copy link

Add topic to favorites
I have a custom logo that I want to replace the Header, but the header is too short to accommodate it. How can I customize the theme to get rid of the header and replace it with a logo?

The blog I need help with is: (visible only to logged in users)
websitedoctor1 · Member · Jun 13, 2014 at 12:38 am
Copy link
Go to your dashboard area then theme option there you get the upload logo option.
timethief · Member · Jun 13, 2014 at 12:45 am
Copy link
@yeadhhasan
No that is not the correct response. This is the CSS Forum and meandbabye is seeking the correct code to use.

In all of these WordPress.com technical support forums we post ONLY if we have the correct answer to the question being posed.

@meandbabye
There is Staff support for this upgrade and Volunteer asistance as well.Please be patient while waiting for that assistance tobeprovided.
websitedoctor1 · Member · Jun 13, 2014 at 12:54 am
Copy link
@timethief
though it is a css forum but meandbabye want to replace header with a logo and from my theme development experience I think with theme option panel meandbabye can do it.
kathrynwp · Staff · Jun 17, 2014 at 2:19 pm
Copy link
meandbabye – if you upload the image you want to use to your Media Library and link to it here, I’ll be glad to have a look.
designsimply · Member · Jun 23, 2014 at 5:18 pm
Copy link
I checked the blog you selected when you entered your help request http://meandbabye.com/ and I don’t see a header setup there right now. However, I can show you an example of how to replace the site title with a logo image using a WordPress logo as the example image.

Here is some CSS you can try out by adding it to your Appearance > Customize > CSS editor:
```
.site-title:before,
.site-title:after {
	display: inline;
}
.site-title {
	background: url(http://s.wordpress.org/about/images/wordpress-logo-notext-bg.png) center center no-repeat;
	width: 176px;
	height: 145px;
	margin: 0 auto;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
```
To use a different image, replace the url() value with a link to the image you want to use and adjust the width and height values to match your image.

No items found.