HOW TO ADD AN IMAGE FOR POST BACKGROUND

tgwriter · Member · Jan 8, 2012 at 11:33 pm
Copy link

Add topic to favorites
I’m trying to use a Custom Design CSS edit to tile a background image within the Post area of my iNove theme. What location do I use for an image that comes from my blog’s Media Gallery?

background-image: url(img/mypic.gif);

doesn’t work because ‘img’ is the theme’s image folder.

This must be easy, but wading through the documentation and searching the forum for a couple hours sure hasn’t helped at all. Can anyone clear this up for me?

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jan 8, 2012 at 11:54 pm
Copy link
You have to use the full absolute URL for the image in your media library starting with http://.

Are you talking about putting a background on individual posts, or behind the entire post content area?
tgwriter · Member · Jan 9, 2012 at 1:22 am
Copy link
Thanks for the quick reply! The background is for the entire post area. I figured I would have to use the absolute path. I just don’t know what it is. Do you?
thesacredpath · Member · Jan 9, 2012 at 2:19 am
Copy link
If you have uploaded the image to your media library, go to the media library, locate the image and click the “show” link. Down at the bottom of that resultant page will be a grey field with the full URL of the image in it. Add the following to the CSS edit text area (delete the informational text there now) and then put your URL where it says IMAGE URL between the double quote marks.

#main {
background: url(“IMAGE URL”) repeat scroll center top #FFFFFF;
}
thesacredpath · Member · Jan 9, 2012 at 2:19 am
Copy link
Forgot my code tags. Copy and paste the below, not the stuff above.
```
#main {
background: url("IMAGE URL") repeat scroll center top #FFFFFF;
}
```
tgwriter · Member · Jan 9, 2012 at 11:22 pm
Copy link
Thanks much! You got me where I needed to be. All is well.
thesacredpath · Member · Jan 9, 2012 at 11:29 pm
Copy link
You are welcome.
maletarte · Member · Jan 10, 2012 at 2:47 am
Copy link
I would like to do the same but for the background of the whole theme, behing the post and the pages. I am using this site : ledalymorin.wordpress.com

So instead of one color (yellow here) I want a full size image.

How can I do that ?
thesacredpath · Member · Jan 10, 2012 at 4:05 am
Copy link
See what this does for you.
```
#page, #site-generator {
background: transparent !important;
}
```
maletarte · Member · Jan 10, 2012 at 2:04 pm
Copy link
Like this ? with both code ?

#page, #site-generator {
background: transparent !important;
}

#main {
background: url(“IMAGE URL”) repeat scroll center top #FFFFFF;
}
maletarte · Member · Jan 10, 2012 at 2:17 pm
Copy link
It doesn’t work, the transparence in only on the page (center), not on the outside of the template.

The color selected in the option is still there.

I need the background image in the back of the whole template, which means basically either margins of the page, left and right, and the bottom.

Do you understand what I mean ? Is it possible ?
I haven’t seen any wordpress template with a background like this, except for the custom made template…
thesacredpath · Member · Jan 10, 2012 at 6:13 pm
Copy link
CSS is theme specific. You can’t use the bit of code I gave the other person for iNove on your theme and expect it to work in Twenty Eleven.

Create your background image with whatever level of opacity you want and then upload and insert it at appearance > background. To get rid of the yellow color (if that is what you want) then delete the color code from the background color field at appearance > background.
thesacredpath · Member · Jan 10, 2012 at 6:15 pm
Copy link
The image you create will have to be saved as either a PNG or a GIF to retain the transparency.

No items found.