New CMS: Team logo
Admin Level - Webmaster
Upload a logo. GIF and PNG formats allow for transparent sections, which allows your site background to show through.
- In the side menu, click Website Design.
- Click the Team Logo overlay (it will generally be at the top and/or bottom of the page).
- If there is an existing logo and you want to replace it, click the in the upper right of the logo to delete it, then click Remove to confirm.
- Drag and drop a logo (up to 1200x1200 pixels!) onto the dotted line area, or click the area and then double click the desired logo.
- YMCA teams can click Generate YMCA Logo... and then enter their team data, pick a color, and then click Generate to have the system automatically build their YMCA logo and team name.
- Although the logo will automatically resize for mobile devices, if you have a squarish logo you can upload an alternative logo into the Optional mobile header logo area that is rectangular to take advantage of the mobile header format.
- Aspect ratio for phones: 5:1 (300x60 pixels)
- Aspect ratio for tablets: 13:1 (700x54 pixels). Since you can only upload one mobile logo, we recommend going with the phone version, as the tablet version will appear as a tiny thin logo on a phone.
- Display mode — Leave as Relative to let the system take care of resizing the logo for different screen sizes. It will generally expand to fill the size of the logo container. Select Absolute to enter specific sizes for each format if you want more control.
- Alternate text — Type your team or org name to be read aloud by screen readers for the visually impaired, and crawled by search engines for SEO.
- Horizontal alignment — If the Team Logo container is wider than the logo, you can set the logo to be in the Left, Center, or Right part of the container.
- Vertical alignment — If the Team Logo container is taller than the logo, you set the logo to be in the Top, Center, or Bottom part of the container.
- On Click Link to — Navigates to a page or URL when the user clicks the logo. If you set this, we recommend simply setting it to your home page. Click the page icon and select Home. Set Open Link in to Same Window.
- Click Save.
- Click the tablet and phone icons in the upper right to make sure the logo works for those sizes.
Notes on logo placement
Organizations will typically place their logo at the top and/or bottom of their site. Some templates show the logo (and anything else) on every page in the footer and top two layout sections, and some in the top three, which gives you flexibility in its placement. Below are the maximum sizes, in pixels, for each template the logo will be displayed in each layout section. These numbers will be smaller if you have other components in the same layout section as the logo.
|Business (2 sections)
Classic (3 sections)
Minimal (2 sections)
Full browser width - 2nd
Clean (3 sections)