Adding Backgrounds with Seamless Patterns

All of the current themes at Printfection do not use any images or backgrounds. One of the easiest ways for you to help make your store stand out is to add some backgrounds to certain elements of your store. The best and most flexible backgrounds are those that are seamless and will "tile" to fit what ever element you choose to use it on. The image at right will tile seamlessly to create a classic wallpaper type look and feel.

As an example, the image could be used for a store background. Click for a larger view.

To do this, you only need to set a CSS background as follows:

body {background: url(http://www.imagehost.ro/pict/0212395547a4487b9ed24.jpg)}

Or you could use it as the background for the header or footer. For best effect, set yourself up with a transparent logo as in the exmaple.

#header {background: url(http://www.imagehost.ro/pict/0212395547a4487b9ed24.jpg)}
#footer{background: url(http://www.imagehost.ro/pict/0212395547a4487b9ed24.jpg)}

You may even choose to use a seamless background for the breadcrumb (#breadcrumb) or even the menu (.menuTable), in fact you could use them for pretty much anything.

To help you get started, feelfree to use any of the following images for your backgrounds. You can either download them and host them on your own server, or link directly to them as I have done in the examples above. Right click on each image and view the images location to then use in your CSS.

There are many other sources for seamless patterns on the web and with a little imagination, you can really make your store look great.

 

02.02.2008. 05:39

This article hasn't been commented yet.