Difference between revisions of "Simple Theme - selecting & modifying your colour scheme"

From Spiffy Stores Knowledge Base

(Created page with "<gallery heights="400px" widths="200px" class="right"> Image:Adelaide-ecommerce-typography-colours.png|Typography, Styles and Colours </gallery>The Simple theme allows you to...")
 
Line 50: Line 50:
  
 
== Footer ==
 
== Footer ==
* Background
+
* Background Colour
 
* Text & titles
 
* Text & titles
* Link colour
+
* Link colour - also controls the colour of your social media icons
* Link colour (hover)
+
* Link colour (hover) - also controls the colour of your social media icons
* Social & Payment Icons
+
* Payment Icons
  
 
<br>
 
<br>

Revision as of 08:35, 21 August 2020

The Simple theme allows you to change the colour of every element in your store.

In some cases, the theme also uses colours that complement colours you have selected in various other areas.

To change your font & colour scheme, go to your Theme Editor, open the Typography, Styles and Colours section, and make your changes.

To preview or submit your changes, you need to click the Save Settings button.

Once you have done that, simply click the Preview your store link, which is located in the top right of every page in your store's admin.

Typography

The Theme includes a large choice of heading fonts. You can see all of the included fonts in the image below.

To change your font, go to your Theme Editor, open the Typography & Colours section, and select your Heading typeface.

Adelaide-theme-fonts-split.png


General Colours

  • Site title - Used for text links, and primary buttons
  • Site title (hover) - Used for secondary buttons
  • H1
  • H2
  • H3
  • H4
  • H5
  • Borders and Divider Lines colour
  • Product image borders
  • Body Text
  • Menu Text
  • Menu Text (hover)
  • Link colour
  • Link colour (hover)
  • On sale tag
  • Sold out tag
  • Buttons
  • Secondary buttons


Background

  • Background colour
  • Use a custom background image?
  • Upload your custom image
  • Custom image treatment


Footer

  • Background Colour
  • Text & titles
  • Link colour - also controls the colour of your social media icons
  • Link colour (hover) - also controls the colour of your social media icons
  • Payment Icons




« The Simple Theme Guide