Inspect Elements is a built-in web development tool found in most web browsers that allows real-time viewing and editing of the HTML, CSS, and JavaScript code of a website. It helps to better understand how a webpage is constructed, as well as diagnose and debug issues, such as mixed content.
To inspect your website's elements, you can use the element inspection tool. Expand the corresponding section for the instructions related to your preferred browser:
Google Chrome
Right-click on an empty area of the website or choose an element, and click on Inspect. Alternatively, you can use the keyboard shortcut Ctrl+Shift+I, which will open all the development tools. You can check the Elements tab to inspect elements or the Console tab to detect any errors or warnings.
Firefox
Right-click on an empty area of the website or choose an element, and click on Inspect. Alternatively, you can use the keyboard shortcut Ctrl+Shift+C.
Opera
Right-click on an empty area of the website or choose an element, and click on Inspect. Alternatively, you can use the keyboard shortcut Ctrl+Shift+I.
Edge
Right-click on an empty area of the website or choose an element, and click on Inspect. Alternatively, you can press F12, which will open all the development tools. You can check the Elements tab to inspect elements or the Console tab to detect any errors or warnings.
To ensure the elements you're analyzing correspond to the latest version of your website, make sure to clear your browser cache 💡
Related Articles
Website Builder: How to Add and Customize Website Elements
Website Builder: How to Organize and Layer Website Elements
Website Builder: How to Copy and Paste Website Elements
Website Builder: How to Check if Custom Code is Added to a Website
Website Builder: How to Customize Your Website’s Design Using Code