Customizing AccessPoint

Customize titles, labels, images, and CSS styling in AccessPoint.

You can customize elements of the AccessPoint pages index.htm and FormLogin.htm using the JSON file customConfig.json in %ProgramFiles%\QlikView\Web.

The following properties can be used to customize AccessPoint:

• title: Used to define the document title shown in the browser.

  For example:

  "title": "My Access Point"

• customFilesFolder: Points to the location of replacement images. This property is only necessary if substitute files are needed. You can use any folder to which QlikView has access.

  Information noteIt is recommended to keep replacement images in similar dimensions to the original images to avoid breaking the layout of AccessPoint.

  For example:

  "customFilesFolder": "customFilesExample"

• labels: Used to replace the default label defined in accesspoint.json. Use the tag all if you want your labels to be used regardless of language.

  For example

  "labels": {
  	"all": {
  		"attributeHeader": "My Attribute (All):",
  		"categoryHeader": "My Category:"

  Information noteFor the individual labels that can be customized, see %ProgramFiles%\QlikView\Web\lang\en-US\accesspoint.json.

  To have language-specific labels, use language tags such as en-US. The following languages tags can be used:

  • de-DE

  • en-US

  • es-ES

  • fr-FR

  • it-IT

  • ja-JP

  • ko-KR

  • nl-NL

  • pl-PL

  • pt-BR

  • ru-RU

  • sv-SE

  • tr-TR

  • zh-CN

  • zh-TW

  For example:

  "en-US": {
  	"attributeHeader": "My Attribute (En):",
  	"useridLabel": "Custom User Name:"
  }

• cssSelectors: Add a jQuery selector for the CSS elements you want to modify with the attributes you want to change or add. To change the styling of an element, use the attribute style. The style you specify is applied directly on the element, in addition to any other styling done directly or by CSS.

  You can view the elements available to be changed using your browser's developer tools on index.htm and FormLogin.htm.

  For example:

  "cssSelectors": {
  	"#logo_main": {
  		"src": "customFilesFolder/logo_main.png",
  		"alt": "Custom"
  
  	},
  	".pagination.topPag > h1": {
  		"style": {
  		"background-image": "url('customFilesFolder/logo_accessPoint.png')"
  		}
  	},
  	"body": {
  		"style": {
  		"font-family": "Arial, sans-serif",
  		"font-size": "14px"
  		}
  	},
  	".filter_view a": {
  		"style": {
  		"background-image": "url('customFilesFolder/ap_sprite.png')"
  		}
  	},
  	"#loginBox": {
  		"style": {
  		"background-image": "url('customFilesFolder/bg_login.png')"
  		}
  	},
  	"link[rel=\"shortcut icon\"]": {
  		"href": "customFilesFolder/favicon.ico"
  		}
  	}