Coupon Affiliates

How can we help?

Search the documentation or ask the AI agent anything about the plugin.

Design & Layout Customisation

Coupon AffiliatesUpdated October 24, 2026

This article is mirrored from couponaffiliates.com.

The Design settings tab controls how the affiliate dashboard looks: colours, tab styling, dark mode, the registration form, and your own CSS. Find it at Coupon Affiliates → Settings → Design.

If you use the Affiliate Portal, its colours, font and theme are on the General tab instead, under Customise Affiliate Portal Design, next to a live preview of the portal. While the portal is enabled, the Design tab shows a “Portal Colours & Fonts” note with a Go to portal design settings link in place of the colour settings.


Affiliate dashboard tabs

Four options control the tab strip across the top of the dashboard:

  • Tabs Style – Style #1 (Basic, legacy) or Style #2 (Full Width, modern). Style #2 is the default.
  • Tabs Border Radius – Curved (5px), Rounded (25px) or Square (0px).
  • Tabs Size / Padding – Small (8px), Medium (10px) or Large (12px).
  • Tabs Font Size – a number between 10 and 30. Leave it empty for the default.

Under Icons you can also turn off Show icons on the affiliate dashboard tabs, and set the icon colour.


Colours

When you use the normal affiliate dashboard page, these are under Dashboard Colours on the Design tab. With the portal enabled, the same colours are under Portal Colours on the General tab (click Show More to see them all).

Each colour has a background and a text setting, with these defaults:

  • Tabs – background #1b3e47, text #ffffff. Labelled Sidebar on the portal.
  • Tabs Hover – background #005d75, text #ffffff. Labelled Sidebar Link Hover on the portal.
  • Table Header & Footer – background #f4f4f4, text #0a0a0a.
  • Buttons – background #005d75, text #ffffff.
  • Buttons Hover – background #1b3e47, text #ffffff.
  • Statistics Icons – #bebebe, for the icons in the statistics boxes.
  • Line Graph (PRO) – #008000.

If Performance Bonuses are enabled, extra colours appear for the progress bar and the reward summary box. See (PRO) Performance Bonuses.


Fonts

Primary Font sets the typeface for all text in the Affiliate Portal. It is on the General tab, under Customise Affiliate Portal Design > Portal Font & Icons. You can pick from the built-in safe fonts (System Default, Inter, Roboto, Open Sans, Lato, Montserrat, Poppins, Nunito, Source Sans Pro, Work Sans, Helvetica Neue, Arial, Georgia, Merriweather), or from any font you’ve added to the WordPress Font Library. Leave it on Default to inherit whatever the browser uses.


Dark mode

Enable Dark Mode to make dark styling available on the affiliate dashboard. Two further options then appear:

  • Display Dark Mode Toggle – shows a switch so affiliates can choose light or dark themselves. On by default.
  • Enable Dark Mode as Default – starts everyone in dark mode. They can still switch back if the toggle is on.

These dark mode settings are for the normal affiliate dashboard page. The portal has its own Show Dark Mode Toggle option on the General tab.


Registration and login form

  • Form Style – Style #1 (Default), Style #2 (Modern Bold) or Style #3 (Modern Compact).
  • Enable 2 Column Layout – puts paired fields like first and last name side by side. On by default.
  • Custom Registration Form Title – replaces “Register New Affiliate Account”.
  • Custom Submit Button Text – replaces “Submit Application”.

Mobile menu

Mobile Menu Style switches the dashboard navigation on small screens between Dropdown (the default) and Tabs.


Custom CSS

Custom Dashboard CSS takes your own CSS, applied to the affiliate dashboard. The box is a full code editor with syntax highlighting and line numbers, so mistakes are flagged as you type.

Use this for anything the settings above don’t cover. Keep a copy of anything substantial somewhere outside the plugin settings as a backup.


Also on this tab

Custom Terminology lets you replace the word “Affiliate” throughout the plugin – see Custom Terminology: Change the “Affiliate” text.

Was this article helpful?