With each Bandzoogle template we offer a template customization guide. This is a valuable tool not only to help you choose the best template for your music website, but also customize it to your style.
The number of customizations can be daunting for a new user, so this key helps to explain the terms and options.
Note: You can change your template at any time without affecting your page content. You can also switch back to your previous template (including any customizations) in the ‘My Themes’ section of the template selector.
Home page This is the first page a visitor will see when they arrive to your website. (This is not the same as an intro/splash page.)
Inner pages These are all the other pages on your website after your homepage.
Intro page A page that displays before a visitor can see your homepage. We do not recommend using intro pages as this is just an extra step a visitor has to go through to get to your main content. It’s also not great for your search engine results.
With each Bandzoogle template we offer a few variations of the base template. These variations include preset colors and fonts to get you started with the template. Some variations have different style behaviors as well (they will be noted in the template guide). Some themes also allow you to start with a blank theme. If the blank theme option is selected, no stock header image, colors, or fonts will be pre-loaded.
Each template customization guide includes the number of variants for that template, as well as whether starting with a blank theme is an option.
Some Bandzoogle templates load with a bit of movement. This may be something like the header title floating in or the title size decreasing as you scroll. It makes the website just a bit more alive for the viewer.
Animation on loading Each template customization guide will describe what animation (if any) is included with that template. Each template that offers animation includes a toggle to turn it off as well.
Enable parallax scrolling With Parallax scrolling the page of the website background moves at a slower rate than the foreground. This gives the page an illusion of depth and content dimension. Parallax scrolling can be toggled off as well.
Fade in image on scroll When this option is selected the header image will fade in as the page loads. This is a subtle effect but gives the illusion of the image moving toward the viewer. This option can be toggled off as well.
Title animation/decoration Each template customization guide will describe what title animation (if any) is included with that template. For example, our Meridian template allows you to add a triangle behind the header title. Each template that offers animation includes a toggle to turn it off as well.
The header image is the image (or video) that sits at the top of your website. Your header image is the first thing a visitor sees when they land on your website, so it’s important to make it stand out. Each Bandzoogle template offers different header sizes and options.
Header image display This is a general idea of the way the header image appears on the website. Many templates offer a large rectangle image that spans most of the top of the website. This is a popular style among musicians as it provides a nice space for band or artist imagery. Some templates use the header image as the full background of the website.
Header image - shape and position Some Bandzoogle templates offer the option to display their header in a shape other than a rectangle (circle, triangle, square). Some templates also offer the option to move the header image position vertically or horizontally within the header area.
Header image - homepage only (default) Some of our templates are set to only display the header image on the homepage. With these templates it is not an option to add header images to inner pages.
Adjust header height (Homepage) This option allows you to control the height of the header image on the homepage. This is useful if you have a rectangle image that is shorter vertically, or if you want to display a more narrow portion of the image.
Adjust header height (Inner pages) This option allows you to control the height of the header images on all pages except the homepage. This controls all inner pages, so variable heights cannot be set for different inner pages.
Remove header image (Home) Most musicians will want to show themselves in the header. If you are a songwriter or working on a different project, you may not want a header image at the top of your website.
Remove header image (Inner pages) Certain themes provide the option to remove a header image from an inner. Most musicians will want to show themselves in the header, but if you have a page on your site for a different project, you may not want a header image there at all.
Image filters This option allows you to add a filter over your header images. These filters are similar to Instagram filters or those provided in other popular image display apps.
Image filter customization Choose ‘Custom’ in the photo filter dropdown and you’ll be presented with more options. Here you can choose a custom color and color mode for your filter.
Custom mobile header height adjustment This allows you to adjust the height of your header image so it fits better on a mobile device.
Show full header image on mobile Some templates display the full header image on mobile, as opposed to other templates which scale the image for small screens. For example, our Mezzo theme shows the whole header image at 100% but a theme like limelight does not display at 100%. Templates with a full header image on mobile are fixed and this option cannot be turned off.
Scroll arrow option Certain templates will add an arrow graphic at the bottom of the header image. This is useful if you use a large header image and want fans to know to scroll down to see more content.
Title and menu background color Provides additional controls to customize color for the title and menu area.
Your band or artist name should display prominently on your website. You can use our title text option or if you already have a logo, you can upload it to this section. You can also choose ‘None’ to go without a title/logo altogether.
Logo/title position Add your name or a custom logo to the header area. Some of our templates give you the option to adjust where the title or logo is located in the header area.
Site title font color Set the color for your band or artist name. This option is only available with the title option (not the logo option.)
Site title font options When using the text title option you can choose the font style, adjust the font size, and change the spacing between letters. If you’d like the title to be in all caps you can toggle on the ‘uppercase’ option.
The navigation menu is the area where your page names are displayed. The page names are clickable buttons that direct visitors away from the current page.
Menu location This notes where the navigation displays in the header (top, bottom, or middle).
Horizontal navigation The menu buttons will display either above or below the header image in a horizontal row. This is the most common navigation style, with the majority of our templates using this horizontal layout.
Vertical navigation The menu buttons will display either to the left or to the right of the header image, in a vertical row.
Sticky navigation This option will keep the menu fixed to the top of the page as you continue to scroll down the page. Templates with sticky navigation are fixed and this option cannot be turned off.
Menu bar Some templates allow you to add a color behind the full navigation menu. You can generally set a color and adjust the opacity of the background bar as well.
Navigation decorations Some of our templates provide the option to add a decoration to your menu buttons. As an example, you may be able to add an underline or squiggle overtop of the menu button.
Hamburger navigation on desktop A hamburger menu is the standard on mobile devices. In internet design terms, this is called a “hamburger menu” because the three horizontal lines stacked on top of each other looks like a hamburger. Some of our templates allow you to switch from a full menu to a hamburger menu for desktop viewing.
Call-to-Action Header (CTA)
A call-to-action (CTA) is the primary action you’d like visitors to take once they land on your site. This can be something like ‘Buy my album’ or ‘Sign-up to my mailing list’. The key is to place it high on the page to direct fans to a specific action. Most of our themes offer the option to overlay the CTA on the header image.
CTA text This is the most prominent section of your CTA. It includes the CTA title and subtitle. You can assign font color, style, case, and letter spacing.
CTA button The call-to-action button is the action element of the feature. The button color and hover color can be customized. Button shape and text color is customized in the ‘Buttons’ section of the Edit Theme’ tab.
CTA container To make the CTA stand out even more you can apply a background color and adjust its opacity. You can also add a border and adjust the border color and width.
CTA position There are various vertical and horizontal alignment options for placement of the call-to-action feature.
The content section of your website is where all your image, text, and features live. This is where you add your music, blogs, events, and anything else you’d like to present to your visitors.
Page background color To change the color of your content background you’ll want to use our section styles option. That said, we do offer a couple themes where changing the color of the background is an option.
Adjust content width There are a select few themes where the section width does not span the page edge-to-edge. With these themes you can control the content width using the toggle in the settings pane. This will be noted in the template customization guide for each theme.
Button shape/style Some of our features include action buttons. As an example, the Mailing List Signup Form feature has a button that says ‘Sign up’. Some of our templates offer the option to customize the shape (rounded, square, pill) and style (solid or outline) of these buttons. All button customizations are applied site-wide.
Site-wide music player style The Site-wide Player displays on each page, and continues to play as visitors navigate your website. Most of our templates display the site-wide player at the bottom of the page, at full content width. Select templates may display a compact player or be set within the menu.
Site-wide MySites position Links to external platforms can be added through the MySites feature. There are two versions of the MySites feature: Site-wide (either in the header or footer) and per-page. Each individual template guide will indicate whether the site-wide MySites icons are displayed in the header or footer of the site.