Template Customization Guide: Synth

The ‘Synth’ template is a modern take on all things 80s. Featuring multiple site title effects, menu spacing and width options, and robust CTA style choices, this website template is great for a pop or new wave project.

If you’d like to try the ‘Synth’ template, head to the ‘Edit Theme’ tab. You can change templates any time while retaining your current content. There are a few variations to choose from and keep in mind your color and font choices are fully customizable.

'Synth' template features

Header

The ‘Synth’ template offers a full-width header image layered under your ‘Site title,’ ‘Call-to-action’ and ‘Menu.’ This template allows you to apply a few different filters and play with the dimensions of your image and menu.

You can make overall style choices for your header image in the ‘Edit Theme’ tab, modifying it as follows:

  • Add an image filter
  • Add an extra image filter layer with a custom mode
  • Use a custom mobile header height
  • Adjust the header height
  • Adjust inner page header height
  • Adjust the menu bottom spaces
  • Full width menu: toggle on/off

Title / logo

The ‘Synth’ template offers a variety of text ‘Title’ effects. You can use a text title, upload a custom logo, or set the option to ‘none.’ With the 'Synth' template you can use a text title, upload a custom logo, or set this option to ‘none’. The title will appear at the very top of your page. It features 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. Toggle on/off the ‘uppercase’ option
  • ‘Logo’: Click ‘Choose An Image’ to upload a logo, and adjust the size using the slider
  • ‘None’: This option leaves the site title area blank
  • ‘Page Title Effect’: Glitch, Retro, Neon, Rainbow, None

Navigation menu

The ‘Menu’ displays your page names as clickable text buttons, so your visitors can check out the different pages on your website. The ‘Synth’ template menu sits just below your ‘Site title’ and call-to-action text layered on top of your header image.

Change up the look of your menu bar by moving the menu bottom spacing toggle, placing it closer to your website content. Another nice way to customize your menu bar is to set it to full-width, making the bar’s background extend across fully the page.

Customize the look and feel of your ‘Synth’ menu bar using these design options:

  • Menu bottom spacing: determines the placement of your menu bar
  • Full width menu: toggle on/off
  • Menu font color
  • Menu font hover color
  • Submenu background color
  • Submenu font color
  • Mobile font color
  • Mobile background color
  • Menu font: type, style, letter spacing, and upper/lowercase
  • Background color: choose a solid color or use the slider to increase opacity

Call-to-action header

A call-to-action header (CTA) on the ‘Synth’ template will appear layered over your header image on your Homepage. You can use the CTA feature for a mailing list signup, to draw attention to new releases, link out to social media, and more!

Adjust your call-to-action’s placement by selecting the alignment options. See which position looks best over your header image. The ‘Call-to-action header’ is customizable in the following ways:

  • Heading color
  • Description color
  • Border color
  • Border width
  • Background color
  • Button hover color
  • Button shape: Rounded, Square, Pill
  • Button style: Solid, Outline
  • Button color
  • Alignment: left, right, or center of the header area. This will also change the alignment of your ‘Site Title’
  • Position: set the call-to-action to the top, bottom, or middle in the header image area. This will also change the alignment of your ‘Site Title’
  • Heading font (font type, style, letter spacing, and upper/ lowercase)
  • Subheading font (font type, style, letter spacing, and upper/ lowercase)
  • Inline headings: toggle on/off

Content

The ‘Content’ section defines the universal font styles across your site. The ‘Synth’ 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, line height, 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

Sections

Section styles allow you to set different colors for sections on your site. The ‘Synth’ theme offers three section styles. The ‘Synth’ theme looks great when you incorporate the colors from your ‘Site Title’ into your section styles. You can set the design of the section styles in the ‘Edit Theme’ tab as follows, then apply your choices to your sections in the ‘Edit Content’ tab.

You can customize your sections by using these options:

  • Content font color
  • Link color
  • Title font color
  • Heading 1 font color
  • Heading 2 font color
  • Button color
  • Button hover color
  • Background color

Buttons

Some of your features include buttons, such as the ‘Mailing List Sign-up Form’ and the ‘Custom Form.’ Here’s how the buttons can be customized in your ‘Edit Theme’ control panel:

  • Shape: rounded, square, or pill
  • Style: choose from ‘outline’ or ‘solid’

Site-wide music player

The ‘Synth’ template features a ‘Site-wide music player’ that can be added through the ‘Edit Content’ tab. This player sits at the bottom of your site on the right-hand side. It can be clicked on to open a larger player.

To customize the colors of the player, toggle on the ‘Use custom colors’ option in the ‘Edit Theme’ area, and adjust these settings:

  • Background color (set the color you’d like to use)
  • Text color (‘white’ or ‘black’)

Site-wide ‘My Sites’

This template includes site-wide social media icons that will display in your menu area on every page. You can adjust them as follows:

  • Button size (increase or decrease the size)
  • Button color
  • Button hover color
  • Button alignment: center, left, right

Variations

The 'Synth’ template offers four stunning variations. Each one is pre-templated with a base palette of complementary colors and fonts. With each one, you can use the existing settings or adjust the design options as you’d like.

Elegant: A moody palette with turquoise and fuschia accents. This variation looks great with the ‘Glitch’ effect applied to the site title.

Playful: This style uses fun fonts and looks great with the ‘Retro’ site title effect.

Playful: Another playful option, featuring high contrast elements. This variation looks good with the ‘Neon’ effect for the site title.

Sombre: Featuring dark and dramatic fonts and backgrounds, this variation is sleek and sophisticated.

'Synth' template tips

  • If you’ve applied a site title effect, try incorporating the colors from your site title into your ‘Section Styles.’
  • Choose different background colors for your section styles and apply them through your site to make your content really pop.
  • With a few header image options, try applying multiple filters. Then, adjust your menu spacing and header height to make a very custom look.