Getting Started with Styles

ClickFunnels’ Styles help you create consistent and professional-looking funnels effortlessly. This article will help you understand what styles are and why they are important. You’ll learn how to create, customize, and apply styles to make your funnels look fantastic and consistent.

Table of Contents

• Requirements
• What are Styles and Why Are They Important
• How to Create a New Style
• How to Customize Styles
• How to Clone Styles
• How to Adjust Style Settings
• How to Apply Styles to Different Areas of ClickFunnels
  • Funnels
  • Site
  • Site Pages
  • Blog
  • Blog Posts
  • Courses
  • Landing Pages
• Additional Information

---

Requirements

• An active ClickFunnels 2.0 account

---

What are Styles and Why Are They Important

Styles in ClickFunnels are design settings that ensure all parts of your pages look consistent and match your brand. These settings include options for fonts, colors, shadows, borders, buttons, and corners. By using styles, you can create a uniform and professional appearance across all your funnels and pages, making them more attractive and user-friendly.

A consistent design helps build trust with your audience and reinforces your brand identity. When your funnels look polished and cohesive, it can enhance engagement and improve the user experience. Styles can be applied to various areas, including Funnels, Landing Pages, Sites, Blogs, and Courses. This makes it easy to maintain a unified look across all your online content.

Using styles also speeds up the design process because you don’t have to start from scratch each time. You can quickly apply your pre-set styles to new pages and elements, saving time and ensuring consistency.

Back to Top

---

How to Create a New Style

1. Click on Workspace Settings at the bottom left of your ClickFunnels dashboard.

2. Scroll down the menu on the left and click on Styles.

3. Click the New Style button at the top right.

4. Enter the Name for your new style.

5. Click Create style to save it.

Back to Top

---

How to Customize Styles

1. On the Styles page, find the Style you want to edit and click on the Customize Design icon to the right of it.

2. You can now customize various style options:

   Any updates you make to a Style will automatically be applied to all pages using that Style, keeping your site consistently up-to-date with your latest design changes.

   • Fonts: Learn how to manage fonts.
   • Colors: Discover how to manage colors.
   • Shadows: Explore tips on managing shadows.
   • Borders: Find out how to customize borders.
   • Buttons: Check out how to design buttons.
   • Corners: Understand how to adjust corners.

3. Click Update to save your changes.

Back to Top

---

How to Clone Styles

Cloning a style can be helpful when you want to create a new style based on an existing one. It saves time and ensures consistency by allowing you to replicate and then tweak a style to fit different needs without starting from scratch.

1. On the Styles page, locate the style you want to clone.

   

2. Click on the Clone icon.

3. Click Proceed to confirm the action.

Back to Top

---

How to Adjust Style Settings

1. On the Styles page, locate the style you want to edit.

2. Click on the Edit icon. You have two options:

   • Rename the Style:

     1. Edit the style Name.
     2. Click Update.

   • Remove Style:

     1. Click Remove Style.

     2. Click Proceed to confirm.

        If the style is in use, the Remove style button will not be visible.

Back to Top

---

How to Apply Styles to Different Areas of ClickFunnels

With ClickFunnels, you can easily maintain a cohesive and branded look across various elements of your online content by applying styles. Here’s how you can apply styles to different areas:

Funnels

1. Click on Funnels from the left-side navigation menu.

2. Locate the funnel you want to edit and click the Settings ⚙ icon to access the funnel’s settings.
   

3. Choose a style from the drop-down menu next to the Style option.

4. Click Update Funnel to save your changes.

Site

1. Click on Site from the left-side navigation menu.

2. From the drop-down menu, select Overview.

3. Click on the three dots ︙ icon at the top left of the Site Page.

4. Select Site Settings.

5. Scroll down to the Advanced Settings section and choose a style from the drop-down menu.

6. Click the Update site button at the bottom of the page.

Site Pages

1. Click on Site from the left-side navigation menu.

2. From the drop-down menu, select Site Pages.

3. Click on the Settings ⚙ icon at the bottom of the Site Page thumbnail.

4. Scroll down to the Advanced settings section and choose a style from the drop-down menu.

5. Click the Update Page button at the bottom of the page settings sidebar.

Blog

1. Click on Site from the left-side navigation menu.

2. From the drop-down menu, select Blog.

3. Click on the Settings ⚙ icon at the top left of the Blog Page.

4. In the Blog Information section, choose a style from the drop-down menu.

5. Click the Update Blog button at the bottom of the page.

Blog Posts

1. Click on Site from the left-side navigation menu.

2. From the drop-down menu, select Blog.

3. Locate the blog post you want to edit and click the Settings ⚙ icon to access the post’s settings.

4. Click Configure next to Advanced Settings.
   

5. Choose a style from the Style drop-down menu.

6. Click Save & close button at the bottom of the page.

Courses

1. Click on Courses from the left-side navigation menu.

2. Locate the course you want to edit and click the Settings ⚙ icon to access the course’s settings.

3. Scroll down to the Advanced Settings section and click Configure.

4. Choose a style from the Style drop-down menu.

5. Click the Update course button at the bottom of the course settings sidebar.

Landing Pages

1. Click on Landing Pages from the left-side navigation menu.

2. Locate the page you want to edit and click the Settings ⚙ icon to access the page’s settings.

3. Scroll down to the Advanced Settings section and choose a style from the Style drop-down menu.

4. Click the Update page button at the bottom of the page settings sidebar.

Back to Top

---

Additional Information

• How to Customize Style Colors
• How to Customize Style Fonts
• How to Create a New Funnel

Back to Top