The top part of each webpage on your Wild Apricot website is called 'Page header' - it is common across all of your webpages.(Page-specific headers can be created via Custom CSS code)
Also, depending on your selected theme (See Website themes), the Page header might contain a login box.
You can customize your header background when you create your site by using the Basic Visual Setup Wizard when you create your site or by accessing the Header settings under Settings -> Look and Feel -> Basic Setup -> Header background
In this mode you can:
When you make your selection you will see a preview of your site in the bottom panel of your web browser. You can drag and drop your logo and title to further customize your header.
To accept the header background, you can click either:
Clicking "Cancel" will take you out of the wizard and back to the Settings screen. None of your changes will be saved.
Problem: images are not shown in File Management / Insert picture (you can only see file names) and are not displayed on your Wild Apricot website
This can happen if your images use CMYK color space instead of RGB one.
Normally web images are saved with RBG color space and images meant for printing are saved with CMYK color space. Some systems only support images with RGB color space, not CMYK. You can get more information on color spaces by clicking here.
For additional options, click on Advanced Settings -> link:
Your toolbar will now give you all the additional options and tools - same ones as when you edit a webpage (See Editing web pages). As well, you will have the ability to use ArtText to give your text and header a little extra luster.
One important distinction between this screen and page editing screen is how the elements are positioned. In regular page editing, elements are positioned automatically, similar to how you write a document with Microsoft Word. In page header editing (advanced mode), you can put any element (text, picture, link etc.) in any place you want - this is called 'absolute positioning'. Start by clicking on any place in your page header. Your cursor will start blinking in that place. Start typing text - it will appear right there. Now you can select text, apply colors, styles, change font size etc:
To move around this block of text or header title inserted via basic setup wizard, click on it to select it, then click and drag on the four-way arrows handle.
You can insert and move around pictures in the same way.
Finally, for the most advanced users there is an HTML button to access HTML code directly and there is also CSS customization, e.g. Sample 2. Customize header background