How to manage the look and feel of a campaign

Antoine Adam -

You have the possibility to customize the design of your campaign for each publication channel defined in the 'Channels' step. Select a template, change the settings you want and apply it to your campaign.

1. Choose a template:


Read more:

2. Customize it by clicking on "Change Look and Feel": 

This opens a workspace dedicated to the design of your campaign. This zone takes the whole width of your screen and lets you real-time preview your changes, so you can see and adjust the design of your campaign as you go. On the left are the various steps used to customize your campaign.

General

Width and height: Set the width and height values in pixels of your campaign.

Position: This option enables you to control the behaviour of your iframe, page after page.

3 options

  • Stay on the same position (default);
  • Go to top of iframe;
  • Go to top of page.

Read more:

Banner: the image you upload here will be displayed on top of the iframe:

  1. always if no background image has been uploaded;
  2. when the screen is smaller than the width specified (810 px by default). The background color will then appear in the background of your campaign. It is displayed on the mobile version when there is no background image.

Background image: The image you upload here will become the wallpaper/background of your campaign when the user's screen is the same size as the image uploaded and defined in the "Look and Feel" tab. We set it up at 810px wide by default but you can choose other values.

This background image disappears when the width of your screen is smaller than the width given to your quiz. It is therefore important to add a banner, which will be displayed on smaller screens such as smartphones or tablets.

Footer: the image you upload here will be displayed below the content of your campaign:

  1. always if no background image has been uploaded;
  2. when the screen is smaller than the width specified (810 px by default). The background color will then appear in the background of your campaign. It will also be displayed on the mobile version when there is no background image.

Read more:

Game zone

Use this section to set the width, minimum height and background color of the game zone. It's also possible via this section to choose if you want to center the questions/answers as well as the form.

Texts

Use the 'Texts' section to set the font size, the color, the font family, and the font weight. There are 4 different kinds of texts:

  • General (simple texts, question fields and form fields, and links);
  • Titles (h1);
  • Subtitles (h2);
  • Questions.

Read more:

Buttons, Menu & Checkbox/Radio buttons

Use this section to set the style, format and color of the buttons and the menu buttons (top right of the iframe), as well as assign some colors to the radio buttons and checkboxes. You can also change the button labels using the "Button text" and "Menu text" sections, located outside the campaign design workspace (still in the 'Look & Feel' step).

Read more:

CSS

Use the CSS tab to go further in your customization.

Save

Once you're done customizing your template, you have 3 options:

1. Save and quit: your customized look & feel will ONLY apply to the campaign you are currently working on and on the selected channel. You will be redirect to the 'Look & Feel' step.

2. Save as new template: this option appears when you click on the 'Save the template' button located on the left of 'Save and quit'. This will create a new template, which will be available to this type of campaign and on selected channels.

NB: Campaigns that use this template won't automatically be adjusted. Changes will only apply to the campaign you are currently working on, as well as to future campaigns. If you wish to apply these changes to your previous campaigns, you need to access the said previous campaigns, go to the 'Look & Feel' step, load the new template, and save.

3. Save the template: This button saves the changes of your existing templates. This option is not available on templates proposed by Qualifio, as you cannot alter those. (In this case, you'll need to save it as a new template.)

NB: Campaigns that use this template won't automatically be adjusted. Changes will only apply to the campaign you are currently working on, as well as to future campaigns. If you wish to apply these changes to your previous campaigns, you need to access the said previous campaigns, go to the 'Look & Feel' step, load the new template, and save.

Next step

Powered by Zendesk