[SOLVED] Adding image background to footer?
 

I need my site to look like the footer does in the attachment photo. I have the image I would like to do and I want this footer on all pages of my site.

The site is http://growroompr.com

and I am using version 3.4.9.

Please give detailed instructions.

Thank you

Anyone? Please, I need help. I am at a standstill with this site.

Thank you

I have tried multiple things to get this to work and i cannot figure it out.

I need the bottom of the site to have the grass and dirt and I need to be able to put links and text inside the dirt. I'm not sure if making a 2nd background with the image and then putting widgets in the footer would be the best solution. OR putting the image in the footer with widgets.

I can't figure out either one...I tried to put a 2nd background and it is not showing up. this is the code I'm using in the css insert:

html{background-image: url ('http://wp-content/themes/atahualpa/images/footer.jpg') !important;
background-repeat: repeat-x;
background-position: left bottom;}

the other background is in body>links>text

That didn't work.
So then I tried to put it in the footer and I cannot get the image to show up or to span 100% of the width of the site.

Please help me. I am at my wits end.

Thank you

you need to make the grass and the brown marble below it one image. Then you can use that as the footer image and position the rest where you want it.

THANK you Juggledad!

Originally, I wanted the site to have a fixed background. How would it work then?


Thank you again

what do you mean be 'fixed background'?

A background that is stationary. So when the center moves, the background is static.

Thank you

For a fixed background you just use the "fixed" CSS attribute. Also at quick glance there are several issues on your site I can see right away.

• The background image is very large
• If you view the site in a wide monitor you see the edges of the image
• The "footer" background should be part of the body and not the footer for what I believe you are trying to do.

Those are a few things I saw but to correct all of that would take multiple hours of working with images and CSS positioning. As a matter of fact I just got through with working on a site for a client doing just that sort of stuff and I put 6+ hours into getting things placed properly so that the site worked in multiple browsers.

How good are you at CSS? How much do you know about images sizes and resolutions for the web? Those are two big areas that you will need to know to accomplish what you want with this site. It's a whole lot easier if you install Atahualpa with one of the default styles and then start the design process with the theme in mind rather than trying to make the theme try to duplicate a picture.

Thank you Larry!

I am more then willing to work the background in the CSS. I just needed to make sure that putting the grass in the background was the best solution for what I am trying to accomplish. Correct me if I am wrong, but if I elect a "fixed" background, I cannot achieve the functionality that I am looking to achieve because the Footer Widgets that I will be placing in the "dirt" area will move up and down on the fixed website. Is this correct?
In which case, the only other option is to not do a fixed background.

Thank you for your response.

Anything you put as a fixed background in the body will stay fixed under anything you put on higher layers. I haven't tried putting a new widget area in HTML Inserts:Body Bottom but perhaps you could experiment with that.

I figured out how to have a hovering footer which is perfect for what I'm trying to achieve. Now I am going to figure out how to put a widget into that hovering footer.
The only problem I am having is making the footer 100% width without changing the container layout padding to 0px. I did start a separate thread for that question though.

It looks pretty cool and I'm a little proud :) Check it out http://growroompr.com.

The rest of the site is not up to par but it's coming along. Thanks for all your help!

Update: I've taken the hovering effect off.