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.

Style section overview


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.


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.


How to Customize Styles

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

  2. You can now customize various style options:

    WARNING

    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.

  3. Click Update to save your changes.


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.

    Clone icon

  2. Click on the Clone icon.

  3. Click Proceed to confirm the action.


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:  Edit icon

    • Rename the Style:

      1. Edit the style Name.

      2. Click Update.

    • Remove Style:

      1. Click Remove Style.

      2. Click Proceed to confirm.

        IMPORTANT

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


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.
    Image showing funnel settings icon

  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.
    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.