Skip to main content

Desktop Web App - Customization options

Jeppe Bøttger
Updated

Note: all screenshots and examples are from Chrome browser 

Tab bar 

  • You can edit the title. 

This is the title of the solution which will be used as the browser tab title.  

  • You can edit the icon.  

The image shown in the browser tab. It should be 32x32px. Supported formats are .png. .gif and .ico. Visiolink will need a link to the image, which can be hosted anywhere online. 

blobid0.png

 

Top bar image 

  • You can add/change top bar image 

The image shown in the top middle of Desktop Web App. It should be in landscape and 40px high. Supported formats are .png. .jpg and .svg. Visiolink will need a link to the image, which can be hosted anywhere online. 

Air in top and bottom need to be part of the image and remember to deliver an image with transparent background. 

blobid1.png

 

Archive 

  • Enable/disable archive 

Choose whether you want archive displayed or not 

  • Change archive mode 

There are 3 different archive modes, designed after how often your publications are released:  

  • Daily (shows publication for a week at a time) 
  • Weekly (shows publication for a month at a time)  
  • Singles (shows publication for a year at a time) 

You can choose an archive mode which is different from your publication schedule if you prefer that layout (example daily publication releases but having Singles archive mode). Screenshot examples below. 

Most papers weekly 

  • Sort archive ascending/descending 

Should the archive be sorted with the latest publication first or last. 

  • Hide date and/or publication name

Option to hide the date and/or publication name

  • First day of week 

Choose between Monday or Sunday 

Archive mode: Daily 

Displays all publications in the selected week 

blobid2.png

Archive mode: Weekly 

Displays all publications in the selected month 

blobid3.png

Archive mode: Singles 

Displays all publications in the selected year 

blobid4.png

 

  • Add archive module to front screen

You can add a module to front screen showing 3 older publications from X years ago. Example 1 year ago, 2 years ago, 4 years ago. 

The only settings you have here are how many years ago each spot of the module should show ( example 1,3,5)

8784063a3e341ff511657a24772f2066.png

Date 

  • Change date format

You have the option to choose date format across the Web App. Here are the options:

Hide dates

27/10/2020

27 Oct 2020

27 October 2020

Tue, 27 Oct 2020

Tuesday - 27/10/2020

Tuesday, 27 October 2020

 

Desktop App Splash 

  • Set a splash screen 

You can set a splash screen with an image, which will show as the first thing when you open the Desktop Web App. The splash screen will require the following: 

  1. URL to image 
  2. Height 
  3. Width 

Example: 

blobid5.png

 

Back Arrow (in Desktop Web App, not browser) 

  • Hide back arrow 

Whether or not the back arrow should be displayed 

  • Back arrow redirection 

By default, the back-arrow points back to region picker (if you have one). Some prefer it to point back to their webpage instead, which is possible. Visiolink just need a URL. 

blobid6.png

 

Custom HTML blocks 

We have the option for custom HTML blocks several places in the Desktop Web App. HTML blocks can be used in a range of of different ways. It can be an ad, text, embedded youtube video, a link to your website or whatever else you desire. Only your imagination and your web development skills are the limit, because Visiolink doesn’t develop these custom HTML blocks for you. The blocks can be of any size (if it doesn’t ruin the general layout) but are limited to specific positions. 

Example of HTML block: <div style="color: red; font-size: 22px; background: white; height: 240px;width:300px; display: flex; justify-content: center; align-items: center"><b>This is a custom html block</b></div> 

HTML block positions: 

  • On the region picker: Above buttons 

Not completely centered due to checkbox to remember regions 

  • On the region picker: Below buttons 

Centered below regions  

  • As a global footer 

This is global which means it will always keep showing in the Desktop Web App. 

  • On the frontpage, EITHER at the top OR above archive 

We have limited the amount of positions for HTML blocks on the frontpage, so you choose to have it either at the top of the right side or further down above the archive.   

 Visual examples below: 

blobid7.png

blobid8.png

blobid9.png

 

Login 

  • Show or hide voucher 

Only relevant if you have voucher codes for your customers 

  • Show or hide password 

It can be relevant to hide password depending on what validation you have 

  • Show or hide forgot password option 

This will require an URL and a system to handle forgotten passwords at your end 

  • Show or hide purchase option 

This will require an URL to a place where the customer can purchase access 

 

blobid10.png

 

GDPR

All the settings related to GDPR, including which texts can be overwritten.

You can read more about GDPR here: Q&A: Visiolink GDPR v. 3.0

You can see our cookies here: Cookies ePaper and here if you have Google Ads: Cookie ePaper Targeting

 

  • Allow all buttons, color

Specify which color the "Allow all" button should have. Defined in Hex color (#002000)

  • GDPR link 

Up to 3 links can be added, most commonly used for privacy policy. Requires a link text and URL for each link.

  • 3rd party script

A script if you have a 3rd party integration. Right now we've implemented support for cookiebot.

  • GDPR language overrides

The following texts can be overwritten. Some HTML formatting is possible, but we require you to send the text complete with HTML tags. 

You can see all our standard GDPR texts here: GDPR translations: Web

  • Privacy dialog button - the button opening the privacy dialog
  • GDPR header - The top header, Privacy Settings in example below
  • GDPR text - The main text
  • GDPR help text - the text displayed when clicking the (i)
  • GDPR buttons - Allow all, allow necessary, allow selected
  • GDPR switches - Necessary, performance, targeting

gdpr.png

Key Color 

  • Add a Key Color to the Desktop Web App 

A key color is a color which will give the app a bit of customization. It will change the color of some selections and buttons throughout the app (example below). You can only choose 1 color and it must be in a hex color code (example: #289d2f).  

blobid11.png

 

Search 

  • Enable or disable search 

Whether the search is possible or not 

 

Tracking

  • Disable tracking events

This is only relevant if you have a huge amount of tracking events and reach your limit in Google Analytics. You can then disable specific tracking event, so the important ones still track.

 

Language  

  • Pick a language 

Pick a language for your app 

  • Overwrite language strings 

You have the option to overwrite certain strings if you are not satisfied with the translation or prefer another wording. You have the option to override the following words and sentences:

  • Additional titles header 
  • Allow tracking text 
  • Archive header 
  • Archive no issues 
  • Back 
  • Cancel 
  • Cover view header 
  • Email 
  • Forgot password 
  • Go to archive 
  • Latest header 
  • Log out 
  • Login 
  • Login button text 
  • Login no subscription 
  • No issues for title 
  • Open archive text 
  • Open info text 
  • Open issue from search 
  • Open search text 
  • Password input  
  • Previous issues header 
  • Purchase 
  • Region picker header 
  • Related issues header 
  • Remember region check box 
  • Return to regions button text 
  • Search button text  
  • Search header 
  • Search no results 
  • Search page numbering 
  • Search to 
  • Sections header 
  • Select 
  • Session timeout header 
  • Session timeout login button 
  • Show more 
  • Solution disabled button text 
  • Solution disabled description 
  • Solution inactive header 
  • Timeout text description 
  • Voucher 
  • Voucher code 

 

Related content / Additional titles  

  1. You can add a module with Related content
  2. You can add a module with additional titles 

This is only relevant if you have a publication containing more than one title, linked with other regions or in other ways have a link to other publications. For more detailed info contact a Visiolink Project Manager. 

blobid12.png

 

Regions 

For each region you have the following customization options: 

  • Publication frontpages as regions

This is an option suitable for papers with very distinct frontpages and wanting a more visual region picker.

 

 

  • Image on Region picker 

We recommend a image of size 236x60 px with transparent background

See picture of example below. 

  • Enable archive or not 
    • Ascending or descending search
    • Archive mode 
  1.  

Same as general settings, just on Region level 

  • Add Custom HTML block 

Same as general settings, just on Region level 

  • First day of week (Sunday or Monday) 

Same as general settings, just on Region level 

  • Show publication dates 

Same as general settings, just on Region level 

  • Show supplements 

Same as general settings, just on Region level 

  • Key color 

Same as general settings, just on Region level 

  • Language  

Same as general settings, just on Region level 

 

blobid13.png

Related articles

Comments

0 comments

Please sign in to leave a comment.