In this article we will take you through the steps to customize your Website Theme.

  • On the Dashboard click on the Design Your Website button.

  • The Theme Editor will be displayed. Customize the theme by changing any of the theme items you want.

The following is a description of what each of the items mean: 

  • THEME TITLE: This is the title(name) of your theme, for example: Rustic Chic.

  • WEBSITE LAYOUT: This refers to the display of your website.

  • The choice of website layout also affects the arrangement of the menu items. Below is an example of a Parallax design, where the menu items are at the top of the screen.

  • BACKGROUND PATTERNS: The background pattern will be added to your website's background. Click on the dropdown arrow and you should see a screen similar to the one below. Background patterns can be displayed on top of a background color or image.
  • **Note: These are built-in patterns and cannot be edited nor customized.

  • BUILT-IN BACKGROUND IMAGES: The background image will be added to your website's background. Click on the dropdown menu in order to choose a background you like.

  • CUSTOM BACKGROUND IMAGE: You also have the option of uploading your own background image instead of choosing an existing one. Simply click on the Choose button, to pick an image from your computer.
  • You can even upload a GIF animation as a background. 

  • BACKGROUND-IMAGE POSITION: Here you can specify the positioning of your background image. 
  • Center: This will align the image to a position of center.
  • Fill: This will stretch the image to occupy the whole space of your screen.
  • Fit Width: This fits the image into a container.
  • Tile: This will repeat the image.

  • HEADER AND FOOTER PATTERNS: These are applied to your headers and footers. Click on the dropdown item and the options will be displayed.

  • HEADER ICON: The header icon will be added to your website. This will be added in the middle of your header section. Click on the dropdown and a list of different built-in header icons will be displayed.

  • DISPLAY MENU ITEM ICONS: This tick box will determine if the menu icons are shown or not.

  • FOREGROUND BORDERS: Click on the dropdown to add a border to your website.

  • CONTENT POSITION: Choose whether the information on the page should be aligned left, right or center.

  • THEME ANIMATIONS: Click on the dropdown menu in order to choose which animation to use for your website.
  • **Note: This animation does not show on a mobile.

  • FOREGROUND OPACITY: This option changes the opacity of the foreground - 0% means the foreground won't display while 100% means it will be a solid color.


Under the Fonts tab you can change the size and font type of headings and content on your website.

  • CONTENT FONT: Here you can specify the type of font to be used for your content. Click on the dropdown arrow and a list of fonts will be displayed. Whichever font option is selected will be used throughout your site.

  • HEADING FONT: This is used to specify the type of font for the header.

  • SUB HEADING FONT: This is used to specify the type of font for the sub-header.

  • EVENT DATE FONT: This is used to specify the type of font for the event date.


  • Under the color tab you can change the colors of the website, from your heading colors to your background colors.

  • When you click on a color, the following window will show, where you can add the RGB or Hex(#) color value.