Toggl Button has integrations with a lot of tools and it keeps adding new integrations all the time. By default Toggl Button supports the default domain addresses on each tool. If company uses their own private server to host the service the Toggl Button default setup is not enough. In this blog post I describe how users can customise the Toggl Button to support their custom domains.

As an example let’s say I have my Teamweek service on a domain called planning.mycompany.com instead of teamweek.com. Adding this domain to Toggl Button extension can be done as follows.

Clone the Toggl Button repo
git clone git@github.com:toggl/toggl-button.git

 

Add your domain and connected service information to manifest.json file

Add url permission:

"permissions": [
  "tabs",
  "*://*.toggl.com/*",
  "*://*.teamweek.com/*",
  "*://planning.mycompany.com/*",
...

 

Add common content script matching:

"content_scripts": [
{
  "matches": [
    "*://*.teamweek.com/*",
    "*://planning.mycompany.com/*",
    ...
    "*://*.wunderlist.com/*"
  ]
},

 

Add service specific content script matching:

{
  "matches": ["*://planning.mycompany.com/*"],
  "js": ["scripts/content/teamweek.js"]
},

 

Save file and load the extension
  • Navigate to chrome://extensions/ and enable “Developer Mode”.
  • Choose “Load unpacked extension…”
  • Open the src directory in the toggl-button directory you cloned and follow the prompts to install.

With these steps taken you should be up and running and the Toggl Button links should appear in the service running on your custom domain.