Website Appearance | LeagueAthletics.com Documentation

Category: Appearance

Logo Banner Background

Video tutorial

Fill Color Top ... Fade Down To: This feature will allow you to specify colors of the background for your website. Optionally, you can choose to have either a single, solid color - by entering only a color selection in the Fill Color Top field OR you may choose to fade your start color to another color - by entering a color in the Fade Down To field. When two different colores are added, this will create a gradient for your background fading down to the second color.
Fill Image or Fill Image File: You can select one of the pre-loaded backgrounds from the drop down selection OR you may upload your own image which will appear as the background image. Smaller images will be "tiled" or repeated in the page background. You may also use a larger image that may not be tiled.

Custom Designs: LeagueAthletics.com offers custom design services for a one-time fee. For more information, feel free to contact [email protected].
Tile Fill Image: This selection will determine how images are repeated in the page background.
Align Horizontally: This selection will determine the horizontal alignment of your background image.
Align Vertically: This selection will determine the vertical alignment of your background image

Upload Logo File: Upload an image file to your website that will be placed on the top of the left navigation. Optionally, you may include your logo within your banner. If included in the banner, the logo will not appear at the top of the left menu column.

Images wider than 120 pixels will be resized to that width. Pictures taller than 160 pixels will be reduced to that height. Note that only .jpg and .gif files are permitted. If you've already uploaded a logo to the site with this form, you don't need to specify the file again.

If you want to delete the Logo File, uncheck the box to the left of the File box and click submit. The logo image will be deleted if this field is not checked.

Load Banner from File: You can optionally upload a banner image file here. This image will be displayed in the horizontal banner space where your organization's full name is normally displayed. You can use any popular drawing program to create the image file but it must be a .jpg, .gif. or .png file and it must be at least 720 pixels wide. The height is up to you, but don't go too high or you'll push your site's content out of view.

Recommended sizes: 1000px wide (or site width) x 150px tall

If you want to delete the Banner File, uncheck the box to the left of the File box and submit the form. The banner image will be deleted if this field is not checked.

Note: If you adjusted your site width, you should keep in mind that when the website is stretched wider than your banner image, the extra space will be filled in with a strip of pixels taken from the rightmost row of pixels from your banner image. If the image has a solid or horizontally striped background, this will not be a problem but if you instead have a textured or complex background, the right edge will appear blurred or striped. In this case, you can force a solid color fill using the Banner Background Color field.
Banner Alignment: Use this field to control the horizontal alignment of your banner image. You can choose to have the image stay against the left side of the framework, centered within it or aligned to the right side.
Create Banner Using: This tool will allow you to create a graphic banner for your site. Using the tools provided in this section, you can incorporate pictures that have been uploaded in your site, select from several of our standard backgrounds or simply use a color. You can also choose to include your organizations logo, and/or a standard sport specific image, as well as selecting shading effects, shading colors and text colors.
Banner Background: Select from any of our pre-built backgrounds or select from the set of most recent photos that have been uploaded to your site. Optionally, you can upload you own custom background for your banner. You may also select "None", in which case only a color selection will be used. If you have selected to use uploaded photos, these photos will be selected from the most recent photos that have been uploaded to your site that are not in albums. You can also create a photo album named "Banner Montage" and photos kept in the album will be used. Keep in mind that only a few photos - 4 to 5 in most cases - will be used to create the banner.

If you are using your own custom banner background, the recommended size is 1000 X 150 pixels. If the custom background is smaller than the recommended size, the 'Shading Color' will fill in the remainder of the space.
Include Logo On: This selection will allow you to choose whether to use your logo (uploaded in the Logo tab of this section) and how to align the logo on your homepage:

Left Nav: places the logo at the top of the left homepage navigation
Left Banner: places the logo on the left side of the banner
Right Banner: places the logo on the right side of the banner
Accessories: Optionally, you can choose to include an "Accessory" image in your banner. These choices are sport specific images, such as Baseball, Basketball, Football, Hockey Puck, Lacrosse Stick, Soccer Ball, Softball and Volleyball. The accessories cannot be used if you have uploaded your own banner image file.
Shading Effect: This selection will allow you to add a shading effect to your banner. Effects included are: Curves, Glass, Ellipse, Shine, Pan Head, Ribbon,Sky and Plain Text. You can also choose to have no banner shading effect.
Shading Color: This selection determines the color of your auto-generated graphic banner or text banner. If this field is left blank, the auto-generated graphic banner will use the color entered in the Menu Text Bar field.

If you are using a custom banner and it does not completely fill the banner image area, the extra area can be filled with the color you specify here. If this field is left blank, the extra area will instead be filled with a pattern taken from the rightmost edge of the image file.
Banner Title: The entry made here will be the name that is shown on your banner.
Font: This selection will allow you to control the font of your banner.
Text Color: This entry will determine the color of text of the graphic banner. If this field is left empty, the graphic banner will use the color entered in the menu text.
Supplemental Text: This text will appear under the Banner's Main Title. This will default to the original location information given for the site.

Left Navigation: Un-checking this box will remove the left navigation bar on your website. Visitors will now navigate the site using only the drop down menus from the Menu Tabs located at the top of your site.
Drop-down Menus: Checking this box will enable drop-down menus throughout your primary and left navigation tabs. Unchecking this option will require users to click on a tab name to navigatet to the next section of your website.
Menu Tab Color: This field is used to specify the background color of the left hand menu strip and horizontal buttons.

Advice: Use a background color that contrasts well with the foreground color you select below. You want it and the bar pattern to contrast well with text.
Menu Text Color: Use this field to specify the foreground color of the text on menus.
Tab Contour: Admin > Config > Appearance > Menu
The selection made here will determine the look and feel of your horizontal Menu Tab buttons. You can select from: "Flat," "Round Head," "Pan," "Glass," or "Rounded". This is a great way to give your site a unique look.
Menu Contour: The selection made here will determine the look and feel of the your vertical Menu Page buttons. You can select from: "Flat," "Round Head", "Pan" or "Glass". This is a great way to give your site a unique look.
Accent Color: You can optionally specify a color that will accent the right edge of the menu bar and also your graphic banner. This allows you to bring in perhaps a second team color and/or enhance the visual interest of your site. The color specified here will also be used to highlight selected menu items.
Menu Pattern: You can choose from of a number of different background patterns for the menu bar. Click the button in the middle of a pattern to select it.

Page Background Color: Choose the default page color for custom pages on your site. The color entered here will be used as the default for all pages, but can be overridden individually using the color field on individual pages.

Note: You can choose a transparent background color by typing the word "transparent." In this case, the website's background will shine through.
Body Text Color: The color of text on your site will default to a dark version of the menu bar color specified above. If you'd prefer another color, you can specify it here.
Page Default Font: This section will allow you to determine the font for all pages of your site. You will be able to choose from: Arial, Courier, Lucida, Stencil, Tahoma, Times, and Verdana.
Hyperlink Color: This field specifies the color of links on the web site's pages. You'll want to pick a color that goes well with the menu colors you chose above. Once again, you can use the palette to help you choose the correct color.
Advanced CSS: This can be used to adjust the cascading style sheets that are used to control the appearance of your website. If you are familiar with css and how to use it, feel free to view the page source of the website and adjust any of these templated settings. Using the classes and ids used in the page source in this area will take precendence over LeagueAthletics.com template and apply your styles. For more information about css, visit http://www.w3schools.com/css/ .

Headline Style: You can chose a number of different styles that are used for headlines on your home page and other bulletins.

Home Page Layout: Choose from three layouts for your home page's content.
Page Background Style: By default, all home page messages - News Items and Welcome Message - will have their own separate box with a 3-Dimensional appearance. The boxes will have a white background with their messages and will appear to be on top of a light grey background.

You can choose not to have the 3-Dimensional appearance and select a color of your liking for the message boxes to appear on. This can be done in the Admin > Appearance > Home Page section of your site. Select the "Choose Color" option and enter whatever color you wish. If you would rather not have separate boxes for each news item, simply select White (#FFFFFF) as the background color.
News Articles: Choose default colors for news items. The colors entered here will be used by default for all new news items, but can be overridden individually using the color fields on the message form.

Note: You can choose a transparent background color from the pop-up color display or type in the word "transparent." In this case, the page's background will shine through.