How do I change the background on my website?
If editing your site's look and feel is beyond your capabilities, we have Design Services available that may help. Please check with your sales representative for more details.
The majority of Shift4Shop templates will utilize a background image combined with a solid color in order to achieve a specific look and feel. For example, in the following image we notice that the template's style contains a honeycomb pattern which fades into a solid color as shown here:
This effect is achieved by using a solid color (in this case, black) for the background while also adding an image that creates the honeycomb pattern. This is all controlled via the theme's CSS file.
To change your site's background, you will need to edit the CSS file specific to your selected theme, and change it's "body" style to suit your needs
Accessing the CSS file
From your Online Store Manager:
Once there, you will see the graphical Style Sheet Editor which outlines all of the various styles contains on the style sheet and allows you to edit them individually.
Editing the CSS
The body style's background section will usually contain a hex value for the color (#xxxxxx) and a url path to the image that's being used. You may also see some instructions on how the image should be displayed. For example, in the following example, the default style has this as its background:
#020202 url(images/BG_body.jpg) no-repeat top center
In this case:
Removing the Image
If you'd like to remove the image, simply edit the field to include only the color's hex value. You can also take this opportunity to edit the background's solid color altogether by specifying your own color choice.
Changing the Image
If you'd like to change the actual image that's being used, simply upload your new image and reference it in the CSS file instead.
There are also a few CSS image display options you may use to control how the image is displayed. Please click here for an external reference that contains more information on these CSS tags.
Some common options are: