Desktop Web App 2 - Customization options

2023-06-23 12:26:34 UTC

2022-11-16_10-40-05.png

This guide goes through the common settings available in Visiolinks Desktop Web App 2. It doesn't address more complicated matters, such as validation and file flow. These subjects are in other guides.

The focus of this guide is on the interface settings. 

Changes and updates

All information about changes and updates can be found in the Desktop Web App 2 release notes. We will update this guide whenever new options are added.

 

Global settings

These settings are across different regions/publications. All other settings (modules, region menu & publication menu) can all differ in settings. 

 

Language

Choose the language the interface should be displayed in. Doesn't affect the publications, just the interface.

The most texts have the option to be overwritten if you prefer a different text.

 

Date format

Date order will be different depending on chosen language. Example below is for English.

Choose between the following formats:

  • 9/7/2022
  • Sep 7, 2022
  • September 7, 2022
  • Wednesday - 9/7/2022
  • Wed, Sep 7, 2022
  • Wednesday, September 7, 2022 

 

Favicon

The icon displayed in the browser tab

2022-09-14_13-14-31.png

 

App title

As default it will be a dynamic title that changes depending on what content is showing, but can also be specified and in that case it will not change but always show the specified title.

2022-09-14_13-14-312.png

 

Search

Choose either:

  • No search
  • Search only in active region
  • Search across all regions

2022-09-14_13-25-54.png

 

Region picker

You have to option to hide region titles if you prefer a cleaner visual style.

- You have the option to always show region picker. By default the browser remembers what region you used previously. 

- Setting to choose what view is displayed after you select a region. Default is "Start" view, but you can select a different view ie. "archive" or "related".

 

For layout you can choose one of the following:

- Simple buttons

2022-09-14_13-31-20.png

- Publication covers half size

2023-06-13_11-24-25.png

- Publication covers full size

2022-09-14_13-30-39.png

You can also set a top logo and set a max width.

2022-11-15_13-44-05.png

The publications can be adjusted by area width, item width and margin. They will adjust within these requirements. This means that if you limit the area width to 800 and item width to 300, there will not be room for 3 columns and they will instead be displayed in 2 columns.

Area width:

2022-11-15_13-44-052.png

Item width:2022-11-15_13-44-053.png

Margin:

2022-11-15_13-44-054.png

 

Enrichments

Enrichments are elements in the publications which are clickable, most commonly clickable ads or emails. You can choose to have them blink when opening a page and/or you can have a hand icon displayed.

 

Login & Validation

There are 2 types of validation:

  • Standard validation - user login as usual
  • Token validation - user log in on your website and is automatically validated on Desktop Web App 2

For Standard validation you can choose any of the following:

  • Enable "Show password" button
  • Enable "Purchase" button - requires a link to where on your website that a reader can purchase subscription
  • Enable "Voucher" button
  • Enable "Forgot password" button - requires a link provided by you

2022-09-14_13-36-132.png2022-09-14_13-36-131.png2022-09-14_13-36-13.png

 

For Token validation you can choose any of the following:

  • Back button on token error
  • Session Timeout headline
  • Button label
  • Button URL
  • Logout URL
  • Specify validation cookie

Intro Splash

This is a graphic displayed shortly before the website opens. This can be enabled through Visiolink Hub or done manually here.

If done manually it will require the following:

  • Image URL
  • Image height
  • Image width
  • Minimum duration (in ms) - This can also be set if enabled through Hub

 

Sharing, Print & download

You can enable or disable sharing and specify which of the following should be available

  • Email
  • Facebook
  • Twitter
  • LinkedIn
  • Whatsapp - Note: This only works if you have Whatsapp installed on a phone/tablet device - we cant reliably detect what device the user is using, so we can't limit this to only be shown on phones and tablets.
  • Print (choose allowed number of prints)
  • Download PDF

 

Statistics

Enable/disable Google Tag Manager with following settings:

  • Tag manager account
  • Google Analytics code
  • Module tracking enabled/disabled

 

Interstitials

Choose either Visiolink or Google Publisher Tags

 

Consent manager

Can have up to 3 links, each with a URL and title of your choice.

Also have a setting which needs to be enabled if targeted ads exist in the app.

2022-09-14_14-40-34.png

 

Font

You can use a custom font, either for the entire solution or per region. However you have the responsibility to ensure the font is legitimate to use and you need to send the font to us in .woff2 format.

 

Color theme 

Colors can be set on app level (same on all regions) and fonts can be set on each region. Details will come in a separate guide.

 

Reader Mode

If you don't want to use the Web App part of our solution, then we can enable "Reader Mode", which means that any link will open directly in a publication and when you go back from a publication you go to a specified webpage (usually your own).

 

Modules

Modules can be added in any order and in any number.

 

Header Module

The standard top module which displays the latest publication, including any sections and also the latest previous publications, which is scrollable.

Options:

  • For the background you can pick an image or choose a gradient color
  • Pick if the "Previous editions" box should expand to the right edge or be limited to only show 2 publications
  • Show titles on top, on bottom or not at all (for previous editions)
  • Show date on top, on bottom or not at all (for previous editions)
  • You can also define text color

2022-11-16_10-16-05.png

2022-11-16_10-34-31.png

 

Article Teaser Module

A module containing articles from the latest publication.

Options:

  • Add a "See More" button
  • Add this to the menu

2022-09-14_13-54-39.png

 

Historical Editions Module

A module containing older publications, specified in options.

Options:

  • Display publications from X years ago (e.g. 1,3,5,10,50)
  • Module headline
  • Module height (in px)
  • Show titles on top, on bottom or not at all 
  • Show date on top, on bottom or not at all 

2022-09-14_13-57-28.png

Publications Module

A module displaying one or several other publications.

Options:

  • Specify which publications to display
  • Module headline
  • Module height (in px)
  • Show titles on top, on bottom or not at all 
  • Show date on top, on bottom or not at all 
  • Add a "See More" button
  • Add this to the menu

2022-09-14_13-57-14.png

 

Google Ads Module

A module showing ads from Google Ads

 

Weekli Module

A module showing content specified from a Weekli script (using an iFrame)

 

Custom Module

You also have the option for custom modules, either with iFrame or custom HTML. These modules are designed to be a placeholder for code you deliver to us, but will, cant and wont take responsibility for building and maintaining code in these custom modules. 

 

Region Menu

We have two different menus. One when a region is selected (in left side) and one when a publication is selected (in right side). Here are the options for buttons in the region menu + some region specific settings.

Same for all menu items is that you can specify title and icon if you prefer something different than the default. The icons needs to be provided by you and no larger than 1mb in size. 

2023-01-23_14-21-48.png

 

Single Page spread 

An option to force singlepage view of publication

Logo

Can set an image and an URL to go to when clicked. You can also set a padding.

If nothing is set, everything will move up.

2022-11-15_13-57-03.png

 

Region picker

In a region there is a button that will go back to the region picker. By default this is the name of the chosen region, but alternatively you can give it a different text (example "Regions"). This will take effect on all regions and can't be region specific.

You can also hide this if you don't want it displayed.

2022-11-15_13-46-23.png

 

Divider

You can insert a divider where you want to group items.

There will always be a divider below the region picker and above Privacy.

2023-01-23_14-22-10.png

 

Start

This button go back to the front page of the region. 

2022-09-14_14-15-15.png

 

App Guide

Will open a view displaying a how-to-use guide, which will help the user navigate the website.r

1.png

Archive

Will open the archive content. Will go to the same view as when you click on the top right icon in the "Previous editions" box of the top module.

2022-09-14_13-59-11.png

Choose either:

  • No archive
  • Display monthly selection
  • Display weekly selection

You can choose section headlines when scrolling:

  • No headlines
  • Month & year
  • Year

You can choose ascending or descending order. 

 

You can set a limit for the archive to X publications.

 

Note: Even though the archive is set to show week/month, the archive have infinite scroll, so it's never limited. This means that if you select week 32, it will first display publications from week 32, then week 31, then week 30, etc.

2022-09-14_13-19-45.png2022-09-14_13-18-58.png

 

2.png

 

Article teasers

Opens the overview of articles in the latest publication. Will go to the same view as the "see more" button in the Article teaser module. 

You have a setting to hide date in top of article overview (as many publications have the date in the name as below)

2022-09-14_14-01-18.png

3.png

 

Custom publication titles

Opens a view with a specific publication(s). You can specify which publications this should link to and a name for the button. Can be done by specifying a list of publications or by using a related script.

2022-09-14_14-04-11.png

4.png

 

Link

Opens a link to any specified location. Requires a link and a name for the button. Can open a separate tab or open in same tab.

5.png

 

Search

Opens the search function to search either in the selected region or across regions.

2022-09-14_14-05-31.png

6.png

 

Privacy

This button accesses the GDPR settings and is always there.

7.png

 

Loading animation

We have a standard loading animation (below) that can be replaced with an image. Can be changed per region.

2023-01-23_14-07-36.png

Example of a image that has replaced our load animation.

2023-01-23_14-06-40.png

 

Publication Menu

We have two different menus. One when a region is selected (on the left side) and one when a publication is selected (on the right side). Here are the options for buttons in the publication menu.

Start

This button goes back to the front page and is always there.

1.png

 

App Guide

Opens a view displaying a how-to-use guide, which will help the user navigate the website.

2.png

 

Full Screen

Sets the window to full screen.

3.png

 

Info View

Opens a view with information. This information is cross-platform and specified with your project manager.

2022-09-14_14-10-47.png

4.png

 

Link

Opens a link to any specified location. Requires a link and a name for the button. 

5.png

 

Page Overview

Gives a clear overview of pages and sections

2022-09-14_14-06-47.png

6.png

 

PDF Download

Downloads the publication as a PDF

Can display a warning that PDF is for personal use only

7.png

 

Cut and Save

Select and area of the publication and save it as a PDF

2023-05-19_09-41-58.png

2023-03-17_14-49-55.png

 

Publication Articles

Gives a clear overview of the articles in the publication.

2022-09-14_14-07-24.png

8.png

 

Search

To search within the publication.

2022-09-14_14-08-36.png

9.png

 

Privacy

This button accesses the GDPR settings and is always there.

10.png

 

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments