Summary: This guide walks you through editing the header for any specific page on your Sites website, using the Edit Header button to customize text, fonts, background images/videos, and color overlays to ensure a unique and engaging look for every section.
Before You Begin
- The Edit Header button is found in the bottom right of every header on the page you want to edit.
- Header Background Video Caution: A Vimeo PRO account is needed for video to play in the background. If you do not have a Vimeo PRO account, your video will display as a static image.
- Image Upload: Be sure there is only one image loaded at a time for a single image background; images for the slideshow are managed separately.
Step-by-Step Instructions
1. Navigate to the page on your Site you would like to customize the header for.
2. Click the Edit Header button found in the bottom right of the header.
3. Customize the Text Tab controls:
- Modify the Heading and Subheading Text.
- Customize the Heading and Subheading Fonts.
- Edit the Button Labels and Links for the two available header buttons.
4. Customize the Background Tab controls:
- Image: Upload an image to use as the background (ensure only one image is loaded at a time).
- Video: Embed a video from YouTube or Vimeo Pro (recommend 720p or less for loading times).
- Full-Width Slideshow: Upload multiple images via the Images tab, drag and drop to reorder, and use the 'eye' icon to toggle visibility of individual pictures in the rotation.
Instructions for Adding Slideshow Images
To ensure images display correctly, please follow this specific workflow:
Upload to the Image Section: Do not add images directly through the Slideshow section. Instead, navigate to the Image section.
Select and Save: Select all desired images within the Image section and click Save.
Initialize the Slideshow: Reopen the Header Image section and then navigate to the Slideshow section.
Note: Skipping the initial save in the Image section will prevent the images from appearing in the slideshow.
5. Customize the Style Tab controls:
- Adjust the Overlay Color and Opacity to create a visual effect over the background.
- Change the Height of the header.
6. Configure the overall Layouts Tab (for header element arrangement).
7. Click the Save button for the changes to take effect.
Troubleshooting & FAQs
- Why is my Vimeo video not playing? You need a Vimeo PRO account for the video to play in the background. If you only have a standard account, the video will display as a static image.
- How do I manage the images in the slideshow? All images for the slideshow are uploaded from the Images tab. You can drag and drop to reorder them and use the 'eye' icon to toggle visibility on or off in the rotation.
- What video resolution is recommended? We recommend 720p or less to help with loading times and buffering.
- Can I add more than two buttons to the header? No, headers are designed to include only two button options.