Step 2: Update your Colours

Changing the colours of your website can be a simple task that can make all the difference in the look of your site. In this guide, we'll show you how to do it step by step.

For Jane Users:

If you have linked your Jane account then your colours will automatically sync over with what you have set in Jane. If you don't have a Jane account linked skip to this section.

Your Clinic Sites website's primary and secondary colour syncs with the primary and secondary colours that are set inside of your Jane Branding Settings. If you've already set your Branding colours inside of Jane, then you should see your colours populated through the site.

This is the Branding area inside your Jane account where you choose your colours:

How the colours come over In Clinic Sites (we swapped out the orange colour in Jane for dark blue on your website)

What if you want different colours on your Clinic Sites website and in Jane?

Since the colours on your website are syncing automatically from your Jane account the only way to have different colours is to turn off the sync in your Clinic Sites settings.

This can be done in Admin > Settings > Jane Integration.

From there, uncheck Synchronize Theme and don't forget to click Save Settings before leaving the page. Check out this help article for more help with Jane Integration Settings

For Non-Jane Users

Here is a quick walk though on how to manually change the colours on your website.

Step 1: Access the Site Design Area.

To access the Site Design Area, click on the Admin section in the top right corner of your screen. Once you're there, click on the Design option, and it will take you to the Site Design Area.

Step 2: Navigate to Colours Option.

After landing on the Site Design Area, you'll notice that you've landed directly on the Colours option. Here, you'll see preset colours loaded in as a template, or your Jane colours may have synced over automatically.

Step 3: Edit the Colours.

If you need to adjust the colours or want to choose from one of the pre-existing colours, it's easy to do so. You can either enter a hex code or select from the pre-existing colours. You can change the primary, secondary, and tertiary colours, which will be used throughout your website.

Step 4: Choose Contrasting Colours.

Each colour also has the option to have a contrasting colour. For example, if you choose dark blue, you can contrast it with white. You can also adjust the contrast of lighter tones by selecting a darker tone to achieve better contrast.

To edit these click the Show/hide contrasting colours button

Step 5: Save the Changes.

Once you're done editing the colours, save the changes. The new colour scheme will be applied throughout your website immediately.

If this article didn't completely answer your question, or if you have any other questions, email us at anytime at support@clinicsites.co and we'll be more than happy to help you out!