How do I open my browser’s Developer Tools?

When debugging UpdraftPlus, you will sometimes be told to open the JavaScript Console or Developer Tools.
Here is a quick guide on how to access this console on the most common browsers

Google Chrome

  1. Navigate to the desired page
  2. Press CTRL+SHIFT+J (CMD+OPT+J on a Mac) or F12
  3. A Developer Tools sub-window should appear, as in the screenshot below
  4. In the Developer Tools window, click the ‘Console’ tab

Chrome browser displaying developer console

Mozilla Firefox

  1. Navigate to the desired page
  2. Press F12
  3. A Developer Tools sub-window should appear, as in the screenshot below
  4. In the Developer Tools window, click the ‘Console’ tab
  5. Alternatively, press CTRL+SHIFT+J (CMD+OPT+J on a Mac) for a pop-out window containing the console

Firefox browser showing developer consoleFirefox browser showing pop-up developer console

 

 

 

Internet Explorer / Edge

  1. Navigate to the desired page
  2. Press CTRL+SHIFT+J or F12
  3. A Developer Tools sub-window should appear, as in the screenshot below
  4. In the Developer Tools window, click the ‘Console’ tab
  5. Reload the current page

Edge browser showing developer console

 

 

 

Opera

  1. Navigate to the desired page
  2. Press CTRL+SHIFT+J (Cmd+Opt+J on a Mac)
  3. A Developer Tools sub-window should appear, as in the screenshot below
  4. In the Developer Tools window, click the ‘Console’ tab

Opera browser showing developer console

 

 

 

Safari

  1. Open Safari’s preferences, and open the Advanced pane
  2. Enable the ‘Show Develop menu in menu bar’ setting, and close the preferences pane
  3. Press CMD+OPT+C
  4. A Developer Tools window should appear, as in the screenshot below
  5. In the Developer Tools window, click the ‘Console’ tab

safari_devtools

 

 

 

 

Posted in: Troubleshooting

twitterlinkedinFacebook