Documentation

Browsersync

Motifmate use Browsersync to help you watch your changes and automatically inject the changes or reload your store. This helps you save time by not having to reload manually every time you want to see the changes you’ve made.

Starting/Stopping

A rocket icon in the bottom right of the Editor act as a toggler to start or stop Browsersync, click it to start/stop the Browsersync (Code EditorBrowsersyncToggle or keyboard shortcut : ctrl+shift+t or cmd+shift+t for macOS). Yellow-colored icon means the Browsersync is running.

When Browsersync started, it will open up a new tab in your current browser (or open up your browser if not opened yet) and will load following address https://localhost:5913/

Home

As default, Browsersync will load your live store and running on HTTPS in localhost. This will give you an unsafe connection notice. Since your localhost doesn't have a valid HTTPS certificate this behavior is expected. You can proceed through this warning to continue.
Force Reload

You can force Browsersync to reload whenever you need it by using Code EditorBrowsersyncForce Reload or keyboard shortcut ctrl+shift+r or cmd+shift+r for macOS.

Emulator

Whenever Emulator running or not, Browsersync will automatically detect it. If running, Browsersync will run on HTTP protocol in following address http://localhost:5913/, the process to switch between the adress is automatic.

The Fastest Way to Build Shopify Themes