WordPress.com Forums » Topic: Add logo and change spacing

designsimply on "Add logo and change spacing"

designsimply — Fri, 22 Feb 2013 19:23:24 +0000

You're welcome!

acupunctuurpraktijk on "Add logo and change spacing"

acupunctuurpraktijk — Fri, 22 Feb 2013 19:21:16 +0000

Yep that works. Thanks so much for your help!

Daan

designsimply on "Add logo and change spacing"

designsimply — Thu, 21 Feb 2013 15:16:08 +0000

The value you entered in url() is a link to a web page, but it needs to be an image.

Instead of this:
http://acupunctuurpraktijkutrecht.wordpress.com/?attachment_id=260

Use this:
http://acupunctuurpraktijkutrecht.files.wordpress.com/2013/02/logo-geknipt1.jpg?w=489

Also, you'll want to adjust the -15px value to work better with your image compared to the logo example I used. Here is an updated example:

#branding {
	background: url('http://acupunctuurpraktijkutrecht.files.wordpress.com/2013/02/logo-geknipt1.jpg?w=489') center 25px no-repeat;
}

acupunctuurpraktijk on "Add logo and change spacing"

acupunctuurpraktijk — Fri, 15 Feb 2013 10:58:55 +0000

Hi,

Thanks for your help! I've managed to change the padding and remove the search form. Adding my logo hasn't worked yet though. I want to add the logo above the header image. I've added some padding to give the logo more room, but still can't see it. The image is 489X107. Is it to big?

This is what I've written in CSS

#branding {
background: url(http://acupunctuurpraktijkutrecht.wordpress.com/?attachment_id=260) center -15px no-repeat;

designsimply on "Add logo and change spacing"

designsimply — Thu, 14 Feb 2013 17:01:02 +0000

3) Also I would like to move the "page title" (welkom bij Baidu..) up, so it is closer to the "header image".

This will adjust the spacing above the main content area for single pages on the Twenty Eleven theme:

.singular.page .hentry {
	padding-top: 0;
}

designsimply on "Add logo and change spacing"

designsimply — Thu, 14 Feb 2013 16:59:35 +0000

2) Remove the search bar

To hide the header search form in the Twenty Eleven theme, add this to your Appearance → Custom Design → CSS editor:

#branding #searchform {
	display: none;
}

designsimply on "Add logo and change spacing"

designsimply — Thu, 14 Feb 2013 16:59:00 +0000

1) Add my own logo (jpg) in the centre.

You can add a logo using the "background" CSS property. Here is an example that will work for the Twenty Eleven theme:

#branding {
	background: url(http://s.wordpress.org/about/images/wordpress-logo-notext-bg.png) center -15px no-repeat;
}

Replace the url() value with a link to your logo, and adjust the number values if needed. If your logo is bigger than the space given, you could add a "padding-top" property to the CSS example above to get more space.

fusionrm on "Add logo and change spacing"

fusionrm — Sat, 02 Feb 2013 17:28:15 +0000

I am also interested in putting my logo and title above the header image. I can't figure out how to do it. There are a few tutorials but they are for self hosted blogs on wordpress.org. Anyhelp would be appreciated! Thank you!

catezapp on "Add logo and change spacing"

catezapp — Sat, 02 Feb 2013 15:55:27 +0000

go to your settings theme header and upload your image from there,and save it-you can also have your own backround

acupunctuurpraktijk on "Add logo and change spacing"

acupunctuurpraktijk — Sat, 02 Feb 2013 13:21:26 +0000

Hi guys,

Om my website http://acupunctuurpraktijkutrecht.wordpress.com/ at the top of the page above the "header image" I would like to
1) Add my own logo (jpg) in the centre.
2) Remove the search bar

3) Also I would like to move the "page title" (welkom bij Baidu..) up, so it is closer to the "header image".

How can I do this in css? Thanks for your help!

Daan

I have the css ugrade.