The HubSpot Community team are continuously looking for ways to improve your Community experience. We want to hear your thoughts and feedback about the Community Profile Page.

Livereload for Design Manager

To keep the files of a theme organized you have to split them into many files and include them via {% include %} and {% import %} into the main file.

/* style.css */
{% import "Custom/page/css/settings.css" as settings %}
{% import "Custom/page/css/macros.css" as macros %}
{% include "Custom/page/css/custom.css" %}


/* main.js */
{% include "Custom/page/js/custom.js" %}


Everytime you make a change on an imported or included file you have to execute the following manual steps:

  1. Save the File
  2. Publish the File
  3. Save the Main File
  4. Publish the Main File (
  5. Refresh the browser or browsers

During development you have to repeat these steps many thousand times. That is not only tedious but a huge waste of time.


With liverreload you just have to save the file (!


In modern html stacks it is a standard to provide a file watcher and live reload function.

1 Reply
HubSpot Product Team
HubSpot Product Team
updated to: In Planning