Hey Everyone, I need to apply a background image to the sidebar widget - so that the form floats over this image. How do I do that?
Any help appreciated! Thank you!
Hey Everyone, I need to apply a background image to the sidebar widget - so that the form floats over this image. How do I do that?
Any help appreciated! Thank you!
Please begin by sharing a link to the page on your site where we can see this form, and let us know what image you want to use for the background. A screenshot or mockup of what you want it to look like will be helpful as well.
Chris, The site is currently not live. However, you may find screen captures of the sidebar forms here:
Current, existing form in development: http://dnwassociates.com/wp-content/uploads/2013/03/mockup-storytelling-sidebar-current.jpg
Desired background for the form: http://dnwassociates.com/wp-content/uploads/2013/03/mockup-storytelling-animal8b.jpg
We won't be able to give you any useful code without being able to see the form online and the actual background for your form widget.
In general, to apply a background image to a div, you would add CSS like this to target your widget form specifically:
[css]
body .widget #gform_wrapper_134 {
background: url('http://dnwassociates.com/wp-content/uploads/2013/03/mockup-storytelling-animal8b.jpg') no-repeat;
}
The #gform_wrapper_134 would be changed to the ID of your widget form.
Here's a super-ugly screenshot showing your image as the background for one of my form widgets: http://minus.com/lRlSWrOotNUpK You obviously need to create your image and form at the same time to get things to line up properly. Your image was not designed to be used behind my form. Just an example of the CSS to put the image as the background for the form widget.