Levi is a bold new EPK and website template for musicians who want their header image to make a statement. Levi's confident approach to color works together with header shape options to turn your homepage into something closer to a poster than a typical website header.

'Levi' template features

Header image

The 'Levi' template features a height adjustable header space. Each Bandzoogle template offers different header sizes and options. Using the 'Levi,' template, your header image will display on all your pages, and the height for your home page is independent of your inner site page header space —something to consider when choosing your theme.

Within the 'Levi' template header settings, you can make use of the 'image shape' option to give your image a unique and striking look. Shapes will cut out sections of your image to match the pattern chosen. The 'Rounded' and 'Cut' options will customize the outside edges of your image.

You can adjust your 'Header/Image' display settings within the 'Edit Theme' tab, modifying it as follows:

  • Image shape
  • Add an image filter (see the 'Header Image Filters' for detailed options)
  • Custom mobile header height
  • Header height
  • Header height (inner pages)

Title/logo

In the 'Levi' website template, your site's title or logo is displayed overtop of your header image. You can use a text title, upload a custom logo, or set this option to 'none' using the following options:

  • Text: Enter your band or artist name text in the 'Site Title' field; select the font color; set the font style, size, and spacing, and toggle on/off the 'uppercase' option. You can also toggle on 'Custom mobile size' setting to adjust the size of your site title on your mobile site only.
  • Logo: CClick 'Choose An Image' to upload a logo, and adjust the size using the slider. Toggle on 'Custom mobile size' to adjust the size of your logo on mobile.
  • None: This option leaves the site title area blank.

You can further customize your website title using these options:

  • Loading animation: title animation can be on or off.
  • Loading animation style: Animations include ‘puff in’, ‘flip in’, ‘Slide in from back’, ‘Blur in’, ‘Wipe in’,and ‘Box highlight’.
  • Blend modes: The title in either ‘font’ or ‘logo’ settings can be ‘blended’ against the header background in different ways
  • Alignment: Align the title / logo either left, center, or right.
  • Scale title to fit: Forces the title and logo to fit the full width of the header area.
  • Opacity: Adjust the transparency of the title / logo.

Menu

The navigation menu is the area where your website's page names are displayed. As clickable text buttons, they allow your visitors to check out the different pages on your website. In the 'Levi' template, your page names are listed horizontally - either above or below your site title and above your header image, aligned to the center of the page.

Customize the 'Levi' menu bar using these design options:

  • Menu font color
  • Menu font hover color
  • Submenu background color
  • Submenu font color
  • Mobile font color
  • Mobile background color
  • Menu font (type, style, size, and upper/lowercase)
  • Menu item spacing
  • Menu position

Page options

The 'Levi' template offers a full-page background, along with the following options for your page content:

  • Page background opacity: Set transparency of the image over the color of the page background.
  • Page background color: Set the color of the page background.
  • Page content width: Set how wide the page content spans across the screen (50-100%).

Content

The 'Content' section defines the consistent design choices throughout your website. This includes your content font, page positioning and design borders. The 'Levi' template allows you to adjust these options:

  • Content font: Set the font type, style, size, line height, upper/lowercase, and link style.
  • Title font: Set the font type, style, size, letter spacing, and upper/lowercase.
  • Heading 1 font: Set the font type, style, size, line height, and upper/lowercase options.
  • Heading 2 font: Set the font type, style, size, line height, and upper/lowercase options.
  • Apply borders to header: Border design settings are applied to the header area at the top.
  • Content outer border: Border design settings are applied to the left and right sides of the content area.
  • Content inner border: Border design settings are applied to the top and bottom sides of section rows in the content area.
  • Border size: The size of the borders in the design.
  • Border radius: The size of the border corner curves.
  • Mobile border size: The size of the borders in smaller mobile displays.

Buttons

Some of your template features include buttons, such as the 'Mailing List Signup Form' and the 'Custom Form' features. Here's how the buttons can be customized to flow with your website design:

  • Shape: Rounded / Square / Pill
  • Style: Outline / Solid

Site-wide 'MySites'

In the 'Levi' template, the site-wide 'MySites' social media icons display in the header area, either above the image, or below it, depending on your ‘menu position’ settings.

The customization options are:

  • Button size: Use the slider to set the icon size anywhere from 1.00rem to 2.50rem.
  • Button color: Set the loading color of the icons.
  • Button hover color: Set the rollover color of the icons.
  • Button alignment: Right / Center / Left

Section Styles

To give your content a modern look, organize your website by using styled sections. You can set the design of the section styles in the 'Edit Theme' tab, then apply your choices to blocks of content through the 'Edit Content' tab.

You can customize your sections by using these options:

  • Content font color: color of all content font within that section style
  • Link color: color of all links within that section style
  • Title font color: color of all titles within that section style
  • Heading 1 font color: color of all text using heading 1 within that section style
  • Heading 2 font color: color of all text using heading 2 within that section style
  • Button color: loading color of all buttons within that section style
  • Button hover color: rollover color of all buttons within that section style
  • Background color: color of the page background for that section style
  • Background color opacity: opacity of the background color for that section style
  • Shape: set the edge shape for that section style

Variations

The 'Levi' template offers six preset variations. Each preset variation loads with a base palette of complementary colors. With each variation, you can use the existing color palettes and simply add content, or you can adjust the colors and design options to suit your preferences.

Playful: Pairs a bold, condensed title font with teal and purple accents against a bright page background. A confident, high-energy look well suited to a touring rock band or a high-energy indie pop act.

Minimal: Keeps things clean with a light page background and warm teal and rust accent colors. A great match for a solo pop artist or a vintage-inspired singer-songwriter.

Sombre: Goes fully dark, with a near-black page background and white and grey accents throughout. A natural fit for a drummer or percussionist, or a dark techno or industrial producer.

Neutral: Strips color back to a quiet off-white page background with black accents and a thinner, more delicate title font than the other variations. A bold, no-nonsense look that suits a hip-hop artist or an electronic producer working the DJ circuit.

Elegant: Sets a soft lavender page background behind a thin, rounded title font in white. A lovely option for a folk duo or an acoustic singer-songwriter.

Bold: Commits to a solid black page background with a chunky, condensed all-caps title font and fiery red-orange accents. A strong choice for an alternative rock band or an experimental electronic artist.

'Levi' template tips

  • Experiment with the 'Image shape' and the Title / Logo ‘Blend modes’ and scaling options to take the look of your header area to the next level.
  • Adjust the 'border radius' settings to take your site from square to curves.
  • Adjust your section's background color opacity to add dynamics to the background image visible behind your page content.