Part 2. How to Replace Twirl Logo Background Image

Tutorial about replacing default Twirl Plone Theme logo background images with new ones in Plone 3.

The following tutorial covers changing of Twirl Theme logo background image on a Plone 3 website. Instruction for changing it in:

Twirl theme allows to have random images be displayed as a background for company logo. Background area for logotype has dimensions: 370px width and 150px height.
twirl

Images, displayed as background rotate randomly with every page refresh. There are four such images.
1 2
3 4

You can replace these Twirl Skin background images with yours via ZMI. If your background image size exceeds these default dimensions, it will automatically be hidden. Also, logo image with the size stated above or bigger will have its corners rounded.

To change background image go to ZMI interface and open portal_skins -> quintagroup_theme_twirl_custom_images folder, which contains bg-logo folder:
bg-logo-folder

This folder includes images that are set as background for company logo.
bg-logo-images
In case you want to set your own images to be displayed in this skin, you should return two levels up to portal_skins. Select custom folder.
custom-folder

There are currently no items in it. As we want to add some images to the front page rotation, we, at first, should add a folder. Thus, select Folder from Add drop-down menu items:
select-folder

Type new folder's Id - it must be the same folder Id that include 4 default images: bg-logo. Press Add button.
add-folder

As a result, now we have bg-logo folder in custom. Click on it to get to its content:
bg-logo-custom

There are no items yet, as it has just been created. Here we'll put images we want to see as a logo background.

Now return to our 4 default images: portal_skins -> quintagroup_theme_twirl_custom_images -> bg-logo. Select image you want to replace with a new one. In the drop-down menu left to Customize select custom/bg-logo and press Customize:
bg-logo1

Now press Browse button to select the your own image. Click on Upload
browse

Now you see one of your new background images, and it is automatically put into custom/bg-logo folder. Save changes you've just made.
new-bg

Now when you return to Plone interface, you'll see new logo background image.
new

Now only this image will always be displayed in that area. In case you want to have several images for rotation - customize other 3 images from portal_skins -> quintagroup_theme_twirl_custom_images -> bg-logo folder.

Connect with our experts Let's talk