Welcome to your new website! This step-by-step guide will take you through how you can customize your website's background image, banner image, colors, and logos. This article will walk through the whole process of designing your website. Click on the links below to navigate to a specific section:
How to Access My SportsEngine HQ
If you are on your website, Sign in and click on the HQ Home icon located at the top of your screen.
How to Access Theme Settings
Once in "SportsEngine HQ", click Website.
Click Website Settings, then click Theme Settings.
How to Update My Website Colors
In the middle of the screen, choose the Brand Color sub-tab.
Click on Primary and/or Secondary color to update your color(s).
Change your colors.
Click Save Changes.
Choosing Your Background Image
Choosing Your SportsEngine Background Image
Scroll down until you find a background you would like to use.
In the top-right corner, click the gray gear icon, then choose Copy.
Click on the Background sub-tab.
Scroll down until you see the background you just copied under the Inactive section.
If you don’t see the background that you copied, please refresh your page.
In the top-right corner, click the gray gear icon, then choose Edit.
Set up the settings of the graphic.
In-depth banner settings are found below.
Click Save Background Graphic.
Choosing Your Own Background Image
Click Add Background Graphic, then set up the settings of the graphic.
In-depth banner settings are found below.
Choose the file from your computer and click Create This Background Graphic.
Background Image Settings
Active: You must check this in order to use the background image.
Site Default: The graphic will appear on all pages (only one site default is allowed per website.
If you do not want your background on all pages, manually choose the pages you want the background to be located on.
Title: A name to identify the background image.
Description: A description to identify the background image.
Background Color: The solid color that will display on the sides of or in place of a background image.
Position: The position on the website page where the image appears.
Repeat: Determines if the background image is repeated vertically or horizontally (not recommended).
Attachment: Determines if the background image stays in the window if a visitor scrolls.
Background Graphic: The image to be placed in the background.
Section: Select a section to only show a background image on specific pages (not necessary if site default is set).
Choosing Your Own Banner Image
Choosing A SportsEngine Banner Image
Scroll down until you find a banner you would like to use.
In the top-right corner, click the gray gear icon then choose Copy.
Click on the Banner sub-tab.
Scroll down until you see the banner you just copied under the Inactive section.
If you don’t see the background that you copied, please refresh your page.
In the top-right corner, click the gray gear icon then choose Edit.
Set up the settings of the banner.
In-depth banner settings are found below.
Click Save Banner Graphic.
Choosing Your Banner Image
Choose the Banner tab.
Click Add Banner Graphic then set up the settings of the banner.
In-depth banner settings are found below.
Choose the file from your computer and click Create This Banner Graphic.
Banner Image Settings
Active: You must check this in order to use the banner image.
Site Default: The graphic will appear on all pages (only one site default allowed per website).
If you do not want your background on all pages, manually choose the pages you want the background to be located on.
Other Site Default: Use the banner as a secondary default banner for messages.
Show Headline on Banner: Display a headline on the banner, such as your organization's name.
Title: A name to identify the banner image.
Show Title on Banner: Display the title on the banner image.
Show Tagline on Banner: Display a tagline or subtitle on the banner.
Transparent Background: See the background through the banner (only if the image itself is transparent).
Description: A description to identify the banner image.
Banner Graphic: The image to be placed in the banner.
Section: Select a section to only show a banner image on specific pages.
Sizing: The suggested banner size is noted under each theme name.
Ex) 990 pixels by 150 pixels
How to Change Your Website Logo
In the middle of the screen, choose the Logo sub-tab and click on the logo square.
Logo: The main logo for your website.
Touch Icon: Used when you bookmark your website and are seen on the home screen of a mobile device.
Favicon: Icon that is shown on the tab of your web browser.
Choose an image from your computer and click Open.
Click Save Changes.
How to Customize My Site Name
Choose the Information sub-tab.
To the right of Site Name, input a name.
Site Name: Displays in browser windows and website
To the right of Short Name, input a name.
Scroll down and click Save Changes.
How to Go Live
Click HERE to read how to go live with your website.