en nl

CSS in Paspartout - 2. Images

last updated: 15/02/2012
difficulty: medium
licenses: Pro, Biz, Shop
For security reasons we don’t allow linking to external files in CSS. Therefore we have built a system where you can upload images onto our server. Not only is it safer but so much easier to manage your images.
To get into the images section, go to the 'images' tab of your theme editor:


If you upload an image it will appear as a thumb marked with a code, something like this:


(icon courtesy of MICK & WOUT)

Now you need to add it to your CSS. Copy the code underneath the thumb (in this case ‘$image_123;’) and paste it where you want the image to be used as a background:

body.ppb { $image_123; }

Paspartout will convert this code to proper CSS:

body.ppb { background-image: url(/path/to/image.png); }

If you want to update the image later on you can just click on the image icon and choose a new image. No need to touch the CSS again.

related articles

CSS in Paspartout - 1. Quickstart CSS in Paspartout - 3. Fonts CSS in Paspartout - 4. Google Fonts