Theme & branding
Set your public website's brand colour, logo and browser-tab icon from Website → Settings → Theme.
Your public website carries your charity's own look — its brand colour, the logo at the top of every page, and the small icon visitors see in their browser tab. WAQAF gathers all three in one place, the Theme panel, so you can set them once and have them apply across the whole site. You'll usually do this when you first build your site, then come back to swap in a cleaner logo or adjust the colour to match a brand refresh.
Who can do this. You need a website role that grants update on the theme — typically the Site Manager, or a Site Editor. (Owners and Org Admins can do it too.) If you open the Theme panel and the fields are greyed out with no Save button, your role can view the theme but not change it; see Members & roles.
Where to find it. Website → Settings → Theme — it's the first tab in the settings sub-menu, marked with a palette icon. (An older bookmark to Website → Theme still works; it lands you on the same panel.)
What you can set here
The Theme panel has three controls, top to bottom:
- Brand colour — a single accent colour used throughout your public site (buttons,
links, highlights). It's set as a hex code such as
#2BA8E0, which is the WAQAF blue your site starts with. - Logo — the mark shown in your public site's header. A wide or a square mark both work.
- Favicon — the small icon in the browser tab. A square image works best; if you leave it blank, your logo is used instead.
There's no font or typography setting here. The fonts your site uses — Arabic and English — are chosen for you by WAQAF so both languages stay clear and consistent, and you don't need to manage them.
Setting the brand colour
Open the Theme panel
From the sidebar, go to Website, then Settings, and pick Theme from the sub-menu on the inline-start side. The brand colour is the first field.
Pick a colour
Click the small colour swatch to open your device's colour picker and choose a shade, or
type a six-digit hex code (like #2BA8E0) straight into the box beside it. The two stay in
step — picking from the swatch fills the code, and a valid code updates the swatch.
Save
Click Save theme. The button won't accept an incomplete or malformed code, so if it
won't save, check the code is a full six-digit hex value beginning with #. A confirmation
appears once it's saved.
Uploading a logo or favicon
The logo and favicon use the same picture uploader, one for each.
Choose an image
Under Logo (or Favicon), click the dashed upload area and pick an image, or drag one onto it. WAQAF accepts PNG, JPG and WebP images. A small spinner shows over the area while the picture uploads.
Check the preview
Once it's uploaded, the picture appears in the upload area so you can see what you've chosen. To swap it for a different image, click Replace; to clear it entirely, click Remove.
Save
Click Save theme at the bottom of the panel. Uploading the picture on its own doesn't make it live — saving the panel is what stores your logo and favicon against the site.
Changes here aren't a live preview — the Theme panel shows the image you've picked, but your public site only updates after you click Save theme. To see the colour and logo in place on the real pages, save first, then open your site (or its preview). See Publishing & preview.
This logo is for your public website's header only. The logo printed on your receipts, vouchers and reports — and the one at the top of your dashboard — is a separate setting under your organisation profile. See Organisation profile & logo if you're looking to change those.
See also
Your website
An overview of everything you can build and manage on your public site.
Publishing & preview
See your changes on the real pages and make them live for visitors.
SEO settings
Your site's name, tagline and how it appears in search results.
Organisation profile & logo
The name and logo used in your dashboard and on printed documents.