Match Your Brand
Jetonomy overviewFree + ProGet Jetonomy →
Match Your Brand
Section titled “Match Your Brand”This guide is for community owners who want the community to look like their own site. You will decide whether to keep your theme’s colours or pin your own, check dark mode, and add your logo and wording.
What you will set up
Section titled “What you will set up”- Colours that match your brand, either from your theme or from you
- A check that dark mode looks right
- Your logo, community title and wording
- Page width and spacing that fit your theme
- (Pro) Your own name on the wp-admin menu
Before you start
Section titled “Before you start”- You need to be a WordPress administrator.
- Have your brand colour ready as a hex code, for example
#7c3aed. - Have your logo uploaded to the Media Library so you can copy its URL.
Step 1: Start with your theme’s colours
Section titled “Step 1: Start with your theme’s colours”Do nothing first. Jetonomy follows your active theme’s fonts and brand colour on its own. It reads the brand colour from BuddyX, BuddyX Pro, Reign and BuddyNext, from your theme’s WordPress “primary” colour, and from several popular themes. See Appearance Settings for the full order.
Open your community at /community/ and look. If the buttons and links already match your brand, you can stop here.
Step 2: Pin your own colours
Section titled “Step 2: Pin your own colours”Do this when the theme gives the wrong colour, or has none for Jetonomy to read.
- Go to Jetonomy → Settings → Appearance.
- Find the Color Palette card.
- Click the Accent picker and choose your brand colour. The Accent field controls buttons, links, active states and notification emails.
- Optional: set Text, Background, Subtle Background and Border. Leave any field empty to keep the default.
- Click Save Settings.
Tip: Set only Accent unless you have a reason. Hover shades and muted text are worked out from it for you.
The Accent picker shows #0073aa when nothing is set. That value means “keep matching my theme”. Pick any other colour to override the theme. A colour you set here applies in both light and dark mode and outranks the theme.
Button text turns black or white on its own so it stays readable on your colour.
Step 3: Check dark mode
Section titled “Step 3: Check dark mode”Jetonomy has no dark mode switch of its own. It follows your theme.
- Turn on dark mode in your theme, using whatever switch the theme offers.
- Reload
/community/. - Look at the home page, a space and a topic.
On Reign, BuddyX and BuddyX Pro, Jetonomy mirrors the theme’s dark switch automatically. On other themes, test it yourself and confirm the community goes dark with the rest of the page.
Tip: If you set Text, Background or Border in Step 2, those colours show in dark mode too. A light background colour will look wrong on a dark page. Clear those fields and keep only Accent if dark mode matters to you.
Step 4: Add your logo, title and wording
Section titled “Step 4: Add your logo, title and wording”- On the same Appearance tab, open the Logo card and paste your image’s address into Logo URL. The logo is used in the mobile app and wherever a brand mark is needed. A transparent PNG of at least 512px works best. With the field empty, your Community Title shows as text.
- Go to Jetonomy → Settings → General. Change Community Title. It is the main heading on the community home page.
- In the Terminology row, rename the words your community uses. For example, change Space to Forum, or Member to Player. Fill in both Singular and Plural.
- Go to Jetonomy → Settings → Email and paste your logo address into Email Logo. Around 200 by 40 pixels works well.
- Click Save Settings on each tab.
Custom wording is shown exactly as you type it. It is not translated, so on a non-English site, type it in your own language.
Step 5: Fit the page to your theme
Section titled “Step 5: Fit the page to your theme”Back on Jetonomy → Settings → Appearance, the Layout card has four controls. Each starts at its theme default.
| Control | Choices |
|---|---|
| Container Width | Theme Default, Full Width, Custom width (in px) |
| Theme Sidebar | Theme Default, Hide on community pages |
| Page Padding | Theme Default, None (edge to edge), Comfortable |
| Layout Density | Compact, Comfortable, Spacious |
For an app-like feel, choose Full Width, Hide on community pages and Comfortable. Click Save Settings. The rest of your site keeps its normal layout.
The Custom CSS card is there for small tweaks. Anything you type is used as written, so keep it short.
Step 6 (Pro): Rename Jetonomy in wp-admin
Section titled “Step 6 (Pro): Rename Jetonomy in wp-admin”White Label changes what your team sees in the dashboard. It does not change what members see.
- Go to Jetonomy → Extensions and switch on White Label.
- Go to Jetonomy → Settings and open Branding in the Advanced group.
- Fill in Brand Name, Admin Menu Label, Admin Menu Icon and Admin Footer Text.
- Click Save Branding Settings.
The brand name replaces “Jetonomy” in the admin menu, on the Plugins page and in the admin footer. See White Label.
Check that it works
Section titled “Check that it works”- Open
/community/in a private browser window, signed out. - Confirm the buttons and links use your colour.
- Switch your theme to dark mode and check again.
- Open the page on your phone, or narrow the browser to about 390 pixels, and check the layout.
- Send yourself a test email from Jetonomy → Settings → Email and check the logo. See Set Up Email Notifications.
Common questions
Section titled “Common questions”I picked a colour and nothing changed.
Clear your page cache and any cache plugin, then reload. If you set the picker back to #0073aa, Jetonomy goes back to your theme’s colour.
Can I get my logo in the community header? There is no logo field for the web header. The Logo URL is used in the mobile app. Your theme controls the site header.
How do I brand the mobile app? See Brand Your App.
Can I hide the Jetonomy name from members? Community pages do not add a “Powered by Jetonomy” line, so there is nothing to remove. Pro White Label only renames the admin side.