Knowledge base

Whitelabeling

Table of Contents

Overview #

The webhookie developer portal provides basic white label capability allowing you to quickly align with your companies brand. The parts of the portal that can be white labelled include:

  • Logo
  • Brand Colour
  • Tagline
  • Introduction
  • Hero Image
  • Favicon
  • Page Title

However, as this is an API product it is possible to bring your own UX using our REST APIs.

How to whitelabel #

Mount a folder or individual files #

In the instructions below several assets need to be provided as a file. If you plan to provide all assets then mounting a folder will be the simplest. If you are not planning to provide all assets and only do a partial white label then you must mount individual files.

If mounting a folder you must include the below files in the folder:

  • logo.svg
  • title.html
  • body.html
  • hero.svg
  • favicon.ico

To mount your folder using docker-compose include the following lines in your docker-compose file:

webhookie:
  container_name: webhookie-server
  image: hookiesolutions/webhookie:1
  # add below two lines to map your logo into the dev portal
  volumes: 
    - ./your_brand_assets:/var/data/webhookie/branding

Note: Do not change /var/data/webhookie/branding – only ./your_brand_assets

To include your logo you need to mount a volume of your logo file to the location of the logo within the webhookie container. You can do this by adding the mapping in the docker-compose file under the webhookie container volumes:

webhookie:  
  container_name: webhookie-server
  image: hookiesolutions/webhookie:1
  # add below two lines to map your logo into the dev portal
  volumes: 
    - ./your_logo.svg:/var/data/webhookie/branding/logo.svg

Note: Do not change /var/data/webhookie/branding/logo.svg – only ./your_logo.svg

Alternatively, if you are doing a full white label and have mounted a folder then you can include your logo in the folder with the name logo.svg.

Your logo must be an SVG and the recommended size is 180×30 (width x height) pixels.

Brand Colour #

The portal supports changing the primary colour to your brand colour. To change the brand colour you need to know the hex code and update the docker-compose file with the following environment variable:

- WEBHOOKIE_MAIN_COLOR=#0151cc

Tagline #

The tagline can be white labelled by mounting your own HTML file that includes the tagline you want to use.

If mounting an individual file you need to add this line into your volumes section of your docker-compose file:

- ./your_tagline.html:/var/data/webhookie/branding/title.html

or by including your tagline in a file called title.html and including it in the folder that is mounted (see above).

Introduction #

The introduction can be white labelled by mounting your own HTML file that includes the introduction you want to use.

If mounting an individual file you need to add this line into your volumes section of your docker-compose file:

- ./your_intro.html:/var/data/webhookie/branding/body.html

or by including your introduction in a file called body.html and including it in the folder that is mounted (see above).

Hero Image #

The hero image can be white labelled by mounting your own SVG file of the hero image you want to use.

If mounting an individual file you need to add this line into your volumes section of your docker-compose file:

- ./your_hero.svg:/var/data/webhookie/branding/hero.svg

or by naming your hero image hero.svg and including it in the folder that is mounted (see above).

The hero image must be an SVG and the recommended size for is 540 x 400.

Favicon #

The favicon can be white labelled by mounting your own ICO file of the favicon you want to use.

If mounting an individual file you need to add this line into your volumes section of your docker-compose file:

- ./your_favicon.svg:/var/data/webhookie/branding/favicon.ico

or by naming your favicon favicon.ico and including it in the folder that is mounted (see above).

Page Title #

The portal also supports changing the page title. To change the page title update the docker-compose file with the following environment variable:

- WEBHOOKIE_PAGE_TITLE=My Page Title

Powered by BetterDocs