How to use browser console Print

• HTTP requests
• warnings and errors (including CSS, JavaScript, security warnings etc.)
• input/output messages (commands sent to the browser via command line and the results of their execution)

Additionally Browser Console displays the messages which are related to the browser’s own code and to its add-ons. It is available in all updated browsers, such as Chrome, FireFox etc. 

If some of the files are not displayed properly on your website (images, CSS, js etc.), Browser Console may be a good debugging tool. The following tutorial will show you how to use it in order to debug certain issues. 

Images are not displayed

The images on your web-page(-s) may be displayed improperly due to different reasons. The most obvious one is the incorrect or unexisting path, via which the image should be loaded. 

Here is an example how it can be displayed in Google Chrome:

Open browser console by hitting Ctrl+Shift+J and navigate to Console tab:

Pay attention to the error message in red color. It means that host-300x241.jpg image in our example could not be found via the path displayed to the right of the error itself. 

To get it fixed, you should check if the path is correct and whether the image is uploaded at all:

1. Log in to your cPanel.

2. Navigate to Files section and click on File Manager menu. Check-mark Document Root for: and choose the domain in question. Click Go.

3. Use in-built search feature to find the exact image which failed to load: 

NOTE: make sure you search by exact name of the image the browser tried to send request to.

4. Once the output of the search is shown, check carefully the exact directory the file is located at.