Please note: while the written guidance in this article should be up to date, the screenshots may not be. Please bear with us. We’re carrying out work to update all the screenshots in the Knowledge Base for Citizen Space 7 and (hopefully) to automate the process for future. Thank you for your patience!
What is a theme? Your theme sets the overall look of your Citizen Space activities.
When you start your subscription with Citizen Space, we set up the overall theme of your Citizen Space site for you. Your theme includes your organisation’s logo, brand colours, and a site-wide wallpaper (either an image or block of colour). If you need to change any of these site-wide features at any point, just contact your customer success manager.
Sometimes, you might want one of your activities to have its own look. Perhaps you’re consulting on a project that has its own logo or branding, or maybe you’re running an engagement exercise with several other organisations and need to include their logos. Admins can change the look of their activities by managing the theme.
How to manage the theme of an activity
Log in to your admin account.
Select the activity you want to edit.
On the dashboard, select 'Manage Theme'
1. Choose an activity banner
You have 4 options here:
The site-wide wallpaper
This is the default option and displays the same wallpaper image that appears on your site homepage.
A full-width activity banner
This option allows you to replace your usual site-wide wallpaper with a different image. If you've created a survey that refers to a particular place, for example, you could use a picture of the place as the banner image. Ideally the image will be around 150 pixels tall by 1000 pixels wide, and no more than 750KB in file size.
There are some sample banner images attached to the bottom of this article if you'd like to experiment with uploading one.
If you want to add an image that has text on it, we recommend you use the 'one or more logos' option (see below) rather than choosing to add it as a full-width banner image.
Note: There are a few important things to consider when choosing a suitable banner image, like size and copyright. Find out how to make images look great in Citizen Space.
If your homepage has an image-based listing the activity banner image you select may appear as an image on your homepage. For information on setting images for these listing types, please read this article. If you're interested on how to configure your hub to add images to the listings, please get in touch with your customer success manager.
One or more logos
This allows you to add extra logos specific to this activity. These might be the individual logos of other organisations collaborating with you on this exercise or could be a single logo/branding image. If you are adding a single logo/piece of branding, this should be no taller than 400px tall and up to 940px wide (but can be smaller than this if you wish).
Please note, this option will only add these logo(s) to the specific activity you are amending.
There is a sample logo attached to the bottom of this article if you want to experiment with uploading one. You can upload it more than once if you want to see how the activity looks with multiple logos.
Note: There are a few things to bear in mind when uploading logos. Read how to make images look great in Citizen Space for some pointers.
There are some more options if you choose to add logos:
Background colour: this appears behind your logos; the default is white.
Logo description: this is the alternative text that will be used by screen readers, giving people with visual or cognitive impairments a description of the image.
Link URL: if you want users to be able to click on the logo and be taken to the website of that organisation, add the URL here.
Drag and drop to change the order that the logos appear in.
No banner image
You might choose this option if you want this activity to have a plain, minimal look. It will simply have the title of the activity.
2. Preview your changes
The preview box shows you how your changes will look - don’t forget to check both the desktop and mobile view.
3. Save changes
You’re all done!