BRANDING

YES - you can customize your ShinePages Website, Funnel, Course, Blog, etc. to YOUR business and YOUR Brand!

This includes Colors, Fonts, Images, Logo, layout and more! 

Images

Your website images speak to your audience and with Shine Pages there are so many ways to show off your brand photoshoot!

Upload all of your images into your File Manager (hot tip: create folders to organize your files first you won't be able to change that later. Ideas: Headshots, Logos, Fonts, Products, Portfolio, Stock Images...) 

EXAMPLE OF HERO WITH IMAGE BACKGROUND

You can add a visual effect by selecting Parallax in the settings this will dynamically change the view of the image as you scroll! Looks real fancy! 

Scroll to begin

Example: How to use the images within a column

THIS IS AN IMAGE WITH A CAPTION

This image is stretched to fit the column. Select Add Image Caption within the settings

This is a image as a column background. You can a text widget to any column even with an image background. 


This column also shows the example of having rounded edges - "border radius" set to 20px.

This is a image widget inside as column with 2% spacing on either side. It is not stretched. You can a text widget above or below any image inside a column. Follow the orange guidelines for placement. 

Image 1 within a Column

This image is stretched to fit the image widget. The image will change as you adjust it. 

 Image 2 within a Column

This image is not stretched the image will not change sizes if you adjust the widget size.

Colors

While each pre-built Website & Funnel Template comes pre-loaded with a gorgeous color palette that you can use if you'd like - the whole idea is for you to set your OWN brand palette and to use your OWN brand colors with just a few clicks!  


You can easily set your Primary color and up to 4 Secondary colors in your Global Styling area. This will immediately change the colors across all pages.


You can keep them as-is, or edit the colors for each individual block, column, heading, button, etc.  

Example: How to Use Color in Columns

Overlay Transparent Color Onto Image

Adding and overlay to an images allows you to add readable text on top of any image. In the column settings select add overlay. Choose grey or black for white text. Use the opacity slider to change the transparency. 

Column BackGround Color

In the column settings select background color. Choose any of your globally styled colors. 


This column also shows the example of having

rounded edges - "border radius" set to 70px.

Color

Gradients

In the column settings select add gradient. Choose any two of your globally styled colors. Select if you want a linear or radial gradient.

Example: How to Use Color in Borders

Border Example 1

To create this border change column settings - choose any background color and select Border. Choose any globally styled color and use the slider to choose your size. This border is 3px wide. 

Border Example 2

To create this border change column settings -choose a white background and select Border. Use the slider to change border size and border radius. This border is 3px wide and 50% radius.

Border Example 2

To create this border change column settings -choose a white background and select Border and Shadow. Use the slider to change border size and border radius. This border is 8px wide and 20% radius. The shadow is set to color #3E3E3E,  blur radius 25%, all other settings 0%

Example: How to Use Color within a block

Example 1: 

You can change the background color of any block or column. This block has 3 columns. The columns on either side of the colored column are set to transparent while this block is a global color. 

Example 2: 

You can change the background color of any block or column. This block has 3 columns. The entire block has a background color and the column to the right has a background image.

Fonts

Every ShinePages Template comes loaded with a free Google Font already formatted for you! Simply swap out existing fonts with our library of Free Fonts OR upload any custom fonts you'd like to add your own style to your website. 

The magic behind a ShinePages template is the global styling allows you to make changes across your entire website! So when you're ready to glow up your site with new branding simply change fonts from the Global Styling and your builder will change all fonts ties to that Heading or Text! To learn more about the Text and Heading Widgets head to basic widget examples. 

How to Use Fonts in Your Hero Block

THIS IS HEADING 1

THIS IS BEST USED AT THE TOP OF YOUR WEBSITE AS YOUR MAIN HEADLINE!

THIS IS TEXT - CAN BE USED ANYWHERE ON YOUR WEBSITE. THIS SHOULD BE A SANS SERIF FONT SO I CAN BE EASY TO READ. SOME GREAT SANS SERIF FONTS ARE OPEN SANS, MONTSERRAT, BUTTONS, TAHOMA, OR HELVETICA. YOUR BUTTON FONT SHOULD BE THE SAME FONT AS YOUR TEXT. YOU CAN USE THE SHINEPAGES BUTTON STYLING AS WELL - FONT: OPEN SANS, FONT SIZE: 17-20, LETTER SPACING: 2PX, PADDING: 17%.

How to Use Fonts in Your General Blocks

THIS IS HEADING 2 BEST USED FOR ALL YOUR MAIN HEADLINES 

THIS IS HEADING 3 - BEST USED IN COLUMNS AND SUBHEADLINES

This is text - Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.

ICON EXAMPLES [THIS IS HEADING 2] 

USE LARGE AND SMALL HEADINGS TO DRAW USERS ATTENTION AND PROVIDE DETAILS!

[THIS IS HEADING 3 or 4]

THIS IS AN ICON SECTION WIDGET 

ICON SECTIONS are also tied to headings. This is heading 4. We recommend using Heading 3/4.

THIS IS AN ICON SECTION WIDGET

ICON SECTIONS are also tied to headings. This is heading 3. We recommend using Heading 3/4. You can style your icon section with a left icon or centered icon. 

THIS IS AN ICON SECTION WIDGET

You can remove the description like this one by unchecking "Show Icon Description" in the settings 

THIS IS HEADING 4

Hi, This is Heading 6

We recommend Heading 6 is an accent font. Use accent fonts sparingly. Even though they are beautiful and add a flair to your website they can be harder to read. So have fun sprinkling in some accent here and there. 

Layout

Your website template is made up of blocks and then columns inside blocks. You have infinite possibilities so we took the guesswork out and provided you with block templates. But in case you wanted to adjust things every block be customized: With a click you can change the width, height, background color. 

Example of a boxed block 

A block is a container within your website. You can resize containers based on the style you are going for. This block is set to "boxed" with a "normal" width. You can change these setting in the upper right hand corner of each block under "resize"

Example of a Full Width  block 

A block is a container within your website. You can resize containers based on the style you are going for. This block is set to "full width" with a "normal" width. You can change these setting in the upper right hand corner of each block under "resize"

EXAMPLE OF OVERLAYING COLUMNS ONTO NEIGHBORING BLOCKS

To get this look where columns from one block interact with a different block change the column margin within the column settings. Move the margin higher or lower to achieve this desired look

Shadow Box Example 1

To create this look adjust the column settings -choose a white background and select Shadow. Use the slider to change shadow settings to color #AAAAAA, blur radius 25%, all other settings 0%. Top column margin -70%

Shadow Box Example 2

To move all the content in a block to the bottom select the bottom content alignment options. This give you more room at the top for an image or blank space. Top column margin -125%

Shadow Box Example 2

To move all the content in a block to the middle select the bottom content alignment options. This centers all the content in the center of your column. Top column margin -175%

HAVE QUESTIONS ABOUT SHINEPAGES

OR  NEED SOME HELP? 

We're here for you!  Email support@shinepages.com, visit ShinePages.com or use the button below to start a LiveChat session with one of our friendly Support agents. 

This is your Footer and appears on all pages unless you "hide" it from certain pages.  You can customize your footer, add in links, navigation menus, logo, forms, etc. 

© Copyright 2024 All Rights Reserved | Privacy Policy | Terms & Conditions

Demo Site Powered by ShinePages

Your cart is empty Continue
Shopping Cart
Subtotal:
Discount 
Discount 
View Cart Checkout
View Details
- +
Sold Out