Managing Advanced Design Options in Website Tonight
Website Tonight® offers you an Advanced Design Options window, where you can fine-tune your template's design. You can change design aspects such as the images you display, the colors of various elements, and you can modify your Web pages' Cascading Style Sheets (CSS).
From the Advanced Design Options window, you can also select and manage images for your Web pages' backgrounds. When you select a background image, it replaces the design elements your template displays.
Launching Advanced Design Options
With Website Tonight, there are several different ways to launch the Advanced Design Options window.
To Launch Advanced Design Options
- Log in to your Website Tonight account.
- From the Design menu, click Launch Page Designer. The page designer displays.
- Do one of the following:
- From the Design drop-down menu, select Advanced Color Options.
- From the Design drop-down menu, select Advanced Style Options.
- From the Page tab, click Template Images.
- From the Page tab, click Background Image.
- Double-click anywhere on your Web page outside a content block. When you mouse over a content block, a dotted line displays.
- The Advanced Design Options window displays.
Managing Template Images
With Website Tonight, template images make up the way your template displays. You can change or delete the header image and the various graphic images that comprise your template.
To Manage Template Images
- Log in to your Website Tonight account.
- From the Design, click Launch Page Designer. The page designer displays.
- From the Page tab, click Template Images.
- The Advanced Design Options window displays. Go to the Template Images tab.
- From the Changes affect drop-down menu, select whether your changes affect the entire Website or only the Web page you selected.
- To delete an image:
- Select the image you want to delete, click Delete Image, and then click Apply.
- Click OK. The image no longer displays in your template.
- To change an image:
- From the Template Images tab, select the image you want to change, and then click Change Image. The Image Library displays.
- Select the image you want to use, and then click OK. The Advanced Design Options window displays.
- Click Apply, and then click OK. The new image displays in your template.
Managing Background Images
With Website Tonight, you can replace the background color of your Web page with a background image you choose.
To Manage Background Images
- Log in to your Website Tonight account.
- From the Design menu, click Launch Page Designer. The page designer displays.
- From the Page tab, click Background Image.
- The Advanced Design Options window displays. Go to the Background Image tab.
- From the Changes affect drop-down menu, select whether your changes affect the entire Website or only the Web page you selected.
- To add a background image:
- Click Change Image. The Image Library displays.
- Select the image you want, and then click OK. The Advanced Design Options window displays.
- Click Apply, and then click OK. The new image displays under Image, and in your background.
- To change the image's position:
- From Position, select the position you want for your image relative to the Web page, click Apply, and then click OK. The new image position displays on your Web page.
- To change the image's alignment:
- From Image align, select the alignment you want for your image relative to the Web page, click Apply, and then click OK. The new image alignment displays on your Web page.
- To delete the image:
- Click Delete Image, click Apply, and then click OK. The image no longer displays in your background.
Managing Advanced Color Options
With Website Tonight, you can customize the colors of your template's various design elements.
To Manage Advanced Color Options
- Log in to your Website Tonight account.
- From the Design, click Launch Page Designer. The page designer displays.
- From the Design drop-down menu, select Advanced Color Options. The Advanced Design Options window displays.
- Go to the Color tab.
- To customize your colors, go to the Feature you want, and then do one of the following:
- In the Color field, enter the hex value for the color you want.
- Next to the feature you want to change, from the Select Color window, select the color you want, and then click OK.
- To preview your changes, click Preview Changes. A window displays previewing your changes.
- To abandon your changes, click Restore Original Colors. The color values reset to their original states.
- To apply your changes, click Apply, and then click OK. Your template displays the new colors.
Managing Advanced Style Options
With Website Tonight, you can modify your website's CSS to customize the template's various design elements.
To Manage Advanced Style Options
- Log in to your Website Tonight account.
- From the Design, click Launch Page Designer. The page designer displays.
- From the Design drop-down menu, select Advanced Style Options. The Advanced Design Options window displays.
- Go to the Styles tab.
- From the CSS File list, select one of the following:
- Theme — (selected by default) Your website template. This option will display if you are using a CSS-based template.
- Colors — Your website's color scheme. This option will display if you are using a CSS-based template.
- Style — Your website's template and color scheme. This option will display if you are using a non-CSS based template.
- Highlight and copy the text displayed in the Read only view of CSS file section, and then paste it in the Edit view of CSS file section.
- From the Edit view of CSS file section, make your edits to the CSS file.
- Select Use Modified CSS, click Apply, and then click OK. Your template displays the new CSS values.
