How to auto reload browser while developing a WordPress theme or plugin
The best option for auto-reload Chrome browser which I found is: Live Reload: https://chrome.google.com/webstore/detail/live-reload/jcejoncdonagmfohjcdgohnmecaipidc
It works like a charm! So simple to set up. Hard to believe it took installing/uninstalling several extensions to get to this PERFECTLY working extension.
This is particularly useful for WordPress developers!
My 2-minute setup as a WordPress developer:
Step 1. Run localhost (XAMPP) for a live server.
Step 2. Install Live Reload
Step 3. Click on your extension icon –> click “Create a new reload rule…”
Step 4. Add Title of rule (can be your website name)
Step 5. Host URL: http://localhost/ (don’t forget the forward slash at the end)
Step 6. Source file URL’s: http://localhost/* Note: you cannot technically monitor changes in local folders/files (on your comp). Instead, you refer to the root folder by using your source URL followed by a forward slash (/) and asterisk (*) to monitor ALL files
Step 7. Ignore source file URL’s:
Note: This allows your website to use Live Reload without reloading WordPress admin areas. There may be other admin areas to ignore, but this setup works for me.
Step 8. Decide how many seconds the extension should wait before checking for updated source files. I set mine to 1s so the updates are immediate.
Step 9. Choose to enable/disable two reload options based on preference.
Step 10. Click “Save reload rule“.
Here are my settings for my WordPress dev environment (with PHP files):
Leave a comment