Customizing the Slide Show Background

Slide backgrounds are created using an image so it's easy to customize the backgrounds by changing the colors or adding a logo or graphic - all you need to do is create and add a new image. You can also edit the background images supplied with the presentation.

Slide shows use two background images - the title background (usually with more color, and a larger logo or graphic, to create impact) and the slide background (continues the color and theme from the title slide, but also includes an area to display the slide content). The background image is referenced in the title.css or slide.css associated with the presentation.

To add a custom background you'll need to create a new image and reference it in the appropriate style sheet. You'll also need to add the graphic to the publishing folder used for the presentation by defining it as an additional file. For example, the background image for the Author-it Square title slide is located in the Author-it Square folder located in ../Templates/Presentations.

Step 1: Customize the Background:

1. Create a new JPG or GIF image sized to match your screen resolution, for example 1024 x 768 px.
2. Add the image file to the presentation folder in .../Templates/Presentations.

   The new background must be included in the book template as an additional file so it is added to the publishing folder for the presentation.

Step 2: Add the graphic to the book's additional files:

1. Open the book template for the presentation.
2. On the HTML tab add the image as an additional file.

   The new background image must be referenced in the style sheet so it is used when the presentation is published. To add a customized background to the title slide open title.css and to add a customized background to the slide open slide.css.

Step 3: Modify the style sheet:

1. Open your presentation's folder in ../Templates/Presentations.
2. Open the title or slide style sheet in Notepad or an HTML editor.
3. Locate the tag "body.title {" (in title.css) or "body.slide {" (in slide.css).
4. Locate "background-image: url(".
5. Change the value to your .JPG or .GIF file.
6. Save and close the style sheet.

Note: When you change the background image you might also need to modify the text styles and bullet images used in the slides. For example you might decide to customize the background for the title slide so it uses a white or lightly colored image. However when you publish and view the presentation you find the heading is no longer visible. This is because the font color attribute in the Heading 1 style in the default title.css is set to white. Changing the font color attribute in the title.css will correct the display.