Reaching the Splash Screen Settings Page

Note: The PageSuite Portal is optimised for large desktop devices using the Chrome browser.

1. Log in to portal.pagesuite.com

2. Click “Publications”

3. Click “Edit Publication Settings” on your desired publication

4. Ensure “HTML5 Reader” is switched on and that you’re in that section.

5. Click the “Splash Screen” tab. The top of your page should look something like this: 

6. Further information on any setting can be found by hovering the cursor over the blue question mark next to it.

If you would like to find out how to edit the splash screen settings, click here.

Editing Splash Screen Settings

In order to edit splash screen settings, you must enable the splash screen by checking the “Enable Splash Screen” checkbox on the Splash Screen settings page.

When this is checked, you will be given the following options:

  1. Minimum Duration Here you can enter the minimum time (in seconds) that the splash screen should appear for.

  1. Background Colour in Chrome (and a few other web browsers) you will get a colour swatch next to a textbox.

Clicking this swatch will open up a colour picker similar to this:

Alternatively, you can enter the hex code for your desired colour. N.B. if you’re using a browser that does not support this colour picker you can use http://www.colorpicker.com/

  1. High Res Logo

This setting allows you to have a high-resolution custom logo appearing on the splash-screen. High resolution means a large image: we recommend a size of 1200 pixels by 1200 pixels. It has several parts to it:

a. A textbox – Here you can enter a URL (web address) of an image, alternatively selecting a file from one of the following parts will populate this textbox for you.

b. Upload Button – Clicking this opens up a modal (pop-up) where you can select from previously uploaded images or upload a new one.

c. Drop Down – This dropdown will contain a list of any image assets associated with your portal account. Click an option to select that image.

Hovering your cursor on the image preview will display a full-size preview of the image.

  1. Small Logo This setting has several parts to it (see High Res Logo). It allows you to have a smaller logo on smaller screens, we recommend a size of 600 pixels by 600 pixels. 
  1. Phone Background Image

To see phone background image settings click the blue “+” icon next to the title. You should see the following options:

 

To hide them, simply click the “-“ icon next to the title.

a. Phone Background Image Portrait  – This setting has several parts to it (see High Res Logo). It allows you to add an image background to the splash screen on phone devices. We recommend 600-pixel width and 920-pixel height for the portrait version of the background.

b. Phone Background Image Landscape – This setting has several parts to it (see High Res Logo). It allows you to add an image background to the splash screen on phone devices. We recommend 920-pixel width and 600-pixel height for the landscape version of the background.

  1. Tablet Background Image

To see tablet background image settings, click the blue “+” icon next to the title. You should see the following options:

 

To hide them, simply click the “-“ icon next to the title.

a. Tablet Background Image Portrait – This setting has several parts to it (see High Res Logo). It allows you to add an image background to the splash screen on tablet devices. We recommend 1536-pixel width and 2048-pixel height for the portrait version of the background.

b. Tablet Background Image Landscape – This setting has several parts to it (see High Res Logo). It allows you to add an image background to the splash screen on tablet devices. We recommend 2048-pixel width and 1536-pixel height for the landscape version of the background.

When you’ve finished editing the settings you wish, click the “Save” button.

N.B. It will not save if there are errors on the page but will let you know if this is the case.

http://origin.media.cdn.pagesuite.com/psapps/images/1/PSLoadingGif_Retina.gif

 

Editing the Page Restriction Logo Settings

Note: The PageSuite Portal is optimised for large desktop devices using the Chrome browser.

  1. Log in to portal.pagesuite.com
  2. Click “Publications”
  3. Click “Edit Publication Settings” on your desired publication
  4. Ensure “HTML 5 Reader” is switched on and that you’re in that section.
  5. Click the “Reader” tab. The top of your page should look something like this:

  1. Find the Page Restriction section and ensure the “Page Restriction Enabled” checkbox is checked.

  1. Several options should appear below it. Ensure that the “Enable Logo” checkbox is checked.

  1. An image setting should appear below it. You can:

a. Enter the web address of the image into the textbox.

b. Click the upload button to upload a new image or select from previously uploaded images.

c. Select an image asset associated with your PageSuite portal account from the drop-down list.

You can view a full-size preview of the image by hovering the cursor over the small image preview.

  1. Ensure there are no errors on the page (errored settings are highlighted in red).
  1. Save Settings by clicking the “Save” button at the bottom of the page. It will not save if there are errors on the page.

Further information on any setting can be found by hovering the cursor over the blue question mark next to it.

Editing the Data Capture Logo Settings

Note: The PageSuite Portal is optimised for large desktop devices using the Chrome browser.

  1. Log into portal.pagesuite.com
  2. Click “Publications”
  3. Click “Edit Publication Settings” on your desired publication
  4. Ensure “HTML5 Reader” is switched on and that you’re in that section.
  5. Click the “Reader” tab. The top of your page should look something like this:

  1. Find the “Data Capture” section and ensure the “Enable Data Capture” checkbox is checked.

  1. Several options should appear below it. The first option is an image setting for Branding Logo. You can select an image asset associated with your PageSuite portal account from the drop-down list.

You can view a full-size preview of the image by hovering the cursor over the small image preview.

  1. Ensure there are no errors on the page (errored settings are highlighted in red).
  1. Save Settings by clicking the “Save” button at the bottom of the page. It will not save if there are errors on the page.

Further information on any settings can be found by hovering the cursor over the blue question mark next to it.

Editing the Favicon Settings

The favicon is the icon used in the browser tabs

Note: The PageSuite Portal is optimised for large desktop devices using the Chrome browser.

  1. Log in to portal.pagesuite.com
  2. Click “Publications”
  3. Click “Edit Publication Settings” on your desired publication
  4. Ensure “HTML 5 Reader” is switched on and that you’re in that section.
  5. Click the “Reader” tab. The top of your page should look something like this:

  1. Find the Favicon section and ensure the “Enable Custom Favicon” checkbox is checked.

  1. An image setting should appear below it. You can:

a. Enter the web address of the image into the textbox.

b. Click the upload button to upload a new image or select from previously uploaded images.

c. Select an image asset associated with your PageSuite portal account from the drop-down list.

You can view a full-size preview of the image by hovering the cursor over the small image preview.

  1. Ensure there are no errors on the page (errored settings are highlighted in red).
  1. Save Settings by clicking the “Save” button at the bottom of the page. It will not save if there are errors on the page.

Further information on any setting can be found by hovering the cursor over the blue question mark next to it.

Editing the Top Bar Logo Settings

Note: The PageSuite Portal is optimised for large desktop devices using the Chrome browser.

  1. Log in to portal.pagesuite.com
  2. Click “Publications”
  3. Click “Edit Publication Settings” on your desired publication
  4. Ensure “HTML 5 Reader” is switched on and that you’re in that section.
  5. Click the “Top Bar” tab. The top of your page should look something like this:

  1. Find the Logo section, there should be an image setting. You can:

a. Enter the web address of the image into the textbox.

b.Click the upload button to upload a new image or select from previously uploaded images.

c. Select an image asset associated with your PageSuite portal account from the drop-down list.

You can view a full-size preview of the image by hovering the cursor over the small image preview.

  1. If you wish to have an alternative version of the logo on small screens, you can enable that by checking the “Use small Logo” checkbox. We recommend having a squarer version here.

  1. An image setting should appear below it. You can:

a. Enter the web address of the image into the textbox.

b. click the upload button to upload a new image or select from previously uploaded images.

c. Select an image asset associated with your PageSuite portal account from the drop-down list. 

You can view a full-size preview of the image by hovering the cursor over the small image preview.

  1. Ensure there are no errors on the page (errored settings are highlighted in red).
  1. Save Settings by clicking the “Save” button at the bottom of the page. It will not save if there are errors on the page.

Further information on any setting can be found by hovering the cursor over the blue question mark next to it.

Image Advert Options Explained

When you select Image adverts, you will be given the following options. You must complete all required settings before being able to save.image-advert-options-explained-1

  1. Image URL This option is required and has several parts to it:

a. A textbox – Here you can enter a URL (web address) of an image, alternatively selecting a file from one of the following parts will populate this textbox for you.

b. Upload Button – Clicking this opens up a modal (pop-up) where you can select from previously uploaded images or upload a new one. image-advert-options-explained-2

c. Drop Down – This dropdown will contain a list of any image assets associated with your portal account. Click an option to select that image.

Once you have selected an image, this option should look something like this:

image-advert-options-explained-3

Hovering your cursor on the image preview will display a full-size preview of the image.

  1. Image Link

This is an optional setting. Enter the web address you wish the image to link to when clicked in the reader.

  1. Image URL

Phone See Image URL. N.B. Even if the image you wish to use on phones is the same as those used on desktop and tablet devices, this setting is required, so select the same image.

  1. Image Link Phone

This is an optional setting. Enter the web address you wish the image to link to when clicked in the reader.

URL Advert Options Explained

When you select URL adverts, you will be given the following options. You must fill out all of them before you can save the settings.

1. Phone URL Enter the web address of the advert you wish to display on phone devices.

2. Tablet/Desktop URL Enter the web address of the advert you wish to display on tablet and desktop devices. N.B. If you want to display the same advert as on phone, you need to fill out both settings with the same URL.

DFP Advert Options Explained

When you select DFP adverts, you will be given the following options. You must fill out all of them before you can save the settings.

enabling-adverts-4

  1. DFP Ad Code – This is the DFP Network Code that is associated with the advert you wish to use on desktop and tablet devices.
  2. DFP Ad Unit – This is the DFP Ad Unit that represents the advert you wish to use on desktop and tablet devices.
  3. DFP Mobile Ad Code – This is the DFP Network Code that is associated with the advert you wish to use on phone devices. N.B. Even if this is the same as the desktop/tablet one, this setting is required, simply enter the same code here too.
  4. DFP Mobile Ad Unit – This is the DFP Ad Unit that represents the advert you wish to use on phone devices. N.B. Even if this is the same as the desktop/tablet one, this setting is required, simply enter the same code here too.

Reaching the Advert Settings Page

Note: The PageSuite Portal is optimised for large desktop devices.

  1. Log in to portal.pagesuite.com
  2. Click “Publications”
  3. Click “Edit Publication Settings” on your desired publication
  4. Ensure “HTML 5 Reader” is switched on and that you’re in that section.
  5. Click the “Adverts” tab. The top of your page should look something like this:

reaching-the-advert-settings-page-1

  1. Further information on any option can be found by hovering the cursor over the blue question mark next to it.

 

reaching-the-advert-settings-page-2