This article is for the cloud and self-hosted versions of Campaign Pro.

Setting the logo

Campaign Pro allows you to have complete control of your logo. You can even set different logos for mobile, tablet and desktop!

In this section:

  1. Logo basics
  2. Head over to the header theme settings
  3. Click the header and the settings panel will appear
  4. Click “Display header” and open the logo accordion
  5. Click “add image”
  6. Select logo
  7. Add a 2x logo (optional)
  8. Add tablet/mobile logo (optional)
  9. Click “Update”

1. Logo basics

Your logo is often the first thing people associate with your brand, so spend a bit of time crafting a good ‘un. A maximum width of 200px works best (because otherwise it will be resized), and ideally in landscape (is wider than it is tall). The best format for the logo is png, but jpeg should be fine.

2. Head over to the header theme settings

Head over to the fonts settings page by going to Theme Settings >> Header (self-hosted version) or Campaign Pro Settings >> Header (cloud version).

Hover over Theme Settings in the left hand menu and then click Header

3. Click the header and the settings panel will appear

You’re now on the Header settings page. Simply click on the header [1] and the settings panel will appear.

The settings panel will display on the right of the screen on desktop, and will cover the whole screen on mobile

4. Click “Display header” and open the logo accordion

If this is your first time changing a setting on the Header then you will need to turn on the Header by simply clicking Display header [1]. To view the logo settings open the Site Logo accordion [2] by clicking on it.

5. Click “add image”

To add your logo simply click “add image“, this will bring up the Media Library.

Select your logo from the Media Library by clicking on it and then clicking Select (at the bottom of the Media Library) and your logo will then be set. Simples!

Your logo will now appear in the Header and once you click Update will display on your site for the world to see. Before you go ahead and save, you may want to add a 2x version of your logo, see below for more info.

A 2x logo is optional, although recommended to avoid possible blur on high res displays.

2x logos are for high res displays, like iPhone, high-end Android and some laptops and MacBooks. Apple came up with ‘retina’ monitors, and since then, more and more devices are ‘retina’. They basically cram more pixels in to the same space (pixel density), and because of this, “normal-res” stuff can look blurry, to avoid this, simply add the same logo, but double the size, so if your logo is 150x75px then the 2x version would be 300x150px.

To add a 2x logo simply click Add 2x version [1] and add your logo [2].

A 2x version of your logo will make sure your logo looks sharp on high-res displays

Tablet/mobile logos are completely optional, for most folks, just one logo will be enough, but if you’re a logo connoisseur, the option is always there 🙂

A tablet/mobile logo will only display below the resolution you set, so for example you could have a big(er) logo for desktop, and a small(er) logo for tablet/mobile. Take a look at for some inspiration.

Click the tablet [1] and mobile [2] tabs and uncheck the toggle [3], you’ll then be able to add your tablet/mobile logo.

Simply add the logo (as above) [1], and click the settings button [2] to set the maximum resolution for the logo, and add a 2x version [3].

9. Click “Update”

Once you’ve added your logo simply click Update and your logo will display on your site.

And that’s it! You’ve now mastered managing your most important brand asset with Campaign Pro 🙂