How do I style my Member Profile Portal?

Step 1: Open the Settings menu

In the left-hand menu, click My Organisation > SETTINGS

Step 2: Find the Member Profile Display Template

As the top level of your hierarchy, you can access the design page for your member profile portal. Click the MEMBER PROFILE DISPLAY TEMPLATE tab

Step 3: Adjust the colours

Here, you can change the following colour elements for your Member Profile Portal:

• Button Colour: Any buttons on the login page or in the portal itself will be assigned this colour
• Button Text Colour: The text of all buttons will be assigned this colour
• Background Gradient Primary: This controls the main background colour of the login page, and is also applied as the colour of the sidebar when members login
• Background Gradient Secondary: This applies a secondary gradient colour on the background of the login page

Step 4: Make sure the Contrast Checker has a Pass status

As you adjust your colours, you will need to make sure the colours assigned for buttons and your background are contrasted sufficiently to ensure people are able to read the text. To make sure this is happening, the Contrast Checker will give you a Pass, Fail or Warning status. Make sure this is showing as Pass before saving the template to give your members the best possible experience

Step 5: Preview the design

You can use the tabs above the colour controls to preview the following design options:

• Mobile vs Desktop View: Toggle these options to view a representation of how the colour scheme will look on desktop devices as opposed to mobile devices
• Login/Profile: Toggle these options to view how the login page of your Member Profile Portal will look as opposed to a view of the profile after a member has logged in

The preview will be displayed in the central panel

Step 6: Check the front-end

You can view the portal itself by navigating to Members > Members > MEMBER PROFILE PORTAL