When you’re reporting an issue within your 10to8 account, we may ask you to provide a screenshot of your web browser’s console and network tabs in order to help us troubleshoot the problem. These often contain information about the data flow between your computer and the internet along with the website’s code, which can help us find the root cause of a problem.
The most common way to access the Console and Network Tabs is to do a right-click on the page and pick ‘Inspect’ from the drop-down menu A new window within the current window will pop up. At the top navigation bar of the window, you can access the ‘Console’ and ‘Network’ tab.
However, there are a few different ways to do this, and some handy keyboard shortcuts, depending on which browser you’re using. This article will show you how to access the logs via the 3 most popular browsers:
Finding the Console/Network Tab in Firefox:
To view the Network logs in Firefox, you’ll need to access the Network Monitor.
To do this, Press Ctrl + Shift + E ( Command + Option + E on a Mac).
Select ‘Network’ from the Web Developer menu, (which is a submenu of the Tools menu on OS X and Linux).
Click the wrench icon, which is in the main toolbar, and then select ‘Network’.
To access the Console, either select ‘Web Console’ from the Web Developer submenu in the Firefox Menu (or Tools menu if you are on a Mac) or press the Ctrl+Shift+K (Command + Option + K on a Mac) keyboard shortcut.
Finding the Console/Network Tab in Google Chrome:
In Chrome, the logs are part of the browser’s Dev Tools. There are two ways of opening the Console panel:
Either click the three dots in the top right of your chrome browser to open the menu. Then, go to ‘More tools > Developer Tools’ and then switch to the Console Tab.
Or, Press Ctrl+Shift+J (Windows / Linux) or Cmd+Opt+J (Mac).
To access the Network tabs, simply click Control+Shift+I or Command+Option+I (Mac).
Finding the Console/Network Tab in Safari:
Lastly, within Safari the Console and Network tabs are available as part of the ‘Develop Menu’ which is actually disabled by default. To re-enable it, go to ‘Safari > Preferences > Advanced’, then select, ‘Enable "Show Develop Menu in Menu Bar"’.
Taking a Screenshot
Once, you have located the Console and Network tabs in your browser, you’ll need to take a screenshot of them in order to help us troubleshoot your problem. Click here to learn how to take a screenshot.