How to Match the Community to Your Brand in Jetonomy

How to match the community to your brand in Jetonomy, step by step: open the Appearance tab, set the accent and other colours, fit the width, sidebar and padding to your theme, choose a layout density, add a logo address or custom CSS, and see the result as a member.

Transcript

In this tutorial you will match your Jetonomy community to your brand, on the Appearance tab. You need the free Jetonomy plugin, and an administrator account. It takes about three minutes. There are six steps. Open Appearance. Set your colours. Fit the layout to your theme. Choose the density. Add a logo or custom CSS. Then see it as a member. Step one. Open Appearance. In your WordPress admin, open Jetonomy, then Settings, then the Appearance tab. The first card explains the starting point. Fonts and colours follow your active theme automatically, so you may not need to change anything. Step two. Set your colours. Under Color Palette, Accent is the colour of buttons, links and active states, and of notification emails. Click Select Color beside it and pick your brand colour. Text, Background, Subtle Background and Border work the same way. A colour set here is used in light and dark mode, and wins over the theme. Leave a field empty to keep following the theme. Step three. Fit the layout to your theme. Container Width is how wide community pages are: Theme Default, Full Width, or a Custom width in pixels. Theme Sidebar can hide your theme's widget sidebar on community pages. Jetonomy's own sidebar stays. Page Padding sets the space around the page: Theme Default, None, or Comfortable. Step four. Choose the density. Layout Density sets how tightly lists are packed: Compact, Comfortable or Spacious. Comfortable is the starting choice. Step five. Add a logo or custom CSS. Logo URL takes the address of your logo image. It is shown in the mobile app, and anywhere a brand mark is needed. At the bottom, Custom CSS is added to the community pages only, for anything the settings above do not cover. Then click Save Settings. Step six. See it as a member. Now sign in as a member and open a space. The New Topic button and the links are where the accent colour shows. This site has no colours set, so the community wears the colours and fonts of its theme. That is all six. Appearance opened, colours set, the layout fitted, the density chosen, a logo or custom CSS added, and the member view. Your community now looks like the rest of your site. Next in this series: Help search engines read your community.