How To Open And Use Browser Dev Tools Error Console

The Browser Dev Tools Error Console is a vital tool for troubleshooting issues on your WordPress site. The 10Web Customer Care Team may occasionally request screenshots or exported error logs from your browser’s console to better assist you.

This guide shows you how to open the error console in major browsers, read different types of messages, and export logs for support and troubleshooting purposes.

Opening the error console

You can access the Dev Tools Error Console in most browsers using these general steps:

1. Right-click anywhere on your website page and select Inspect or Inspect Element.
2. In the panel that opens, click on the Console tab.
3. Alternatively, you can use keyboard shortcuts:
   • Chrome/Edge/Brave: Ctrl+Shift+J (Windows/Linux) or Cmd+Option+J (Mac)
   • Firefox: Ctrl+Shift+K (Windows/Linux) or Cmd+Option+K (Mac)
   • Safari: Enable the Developer menu in Safari > Settings > Advanced, then press Cmd+Option+C

Identifying different message types

In the Console tab, you’ll see messages color-coded and marked by icons:

• Errors: Shown in red, these indicate something has failed. These are the most critical for troubleshooting.
  Important: To properly capture errors, refresh the page and reproduce the issue (e.g., click the button that’s not working) while the console is open.
• Warnings: Shown in yellow, these suggest potential issues but don’t usually break functionality.
• Logs/Messages: Shown in white or gray, these are general messages or debug information.

Reading and understanding errors

When reviewing errors:

• Look for references to file paths, such as /wp-content/plugins/... or /themes/...
• Check the file name and line number shown on the right side of each message.
• Hover over or click on the link to see more details about where the error comes from (plugin, theme, etc.).

This helps pinpoint whether a specific plugin or theme is causing the issue.

Exporting console logs

To share the console log with the 10Web Customer Care Team:

1. Right-click anywhere inside the Console window.
2. Select Save as...
3. Choose a location and save the log as a .log or .txt file.
4. Attach the saved file to your support request.

Use this guide anytime you need to share detailed browser-side error information with our team for faster and more accurate support.