How to see your website source code

When you are working on your site you may want to have access to its HTML source code for double checking your effort. Fortunately, it is very easy to have access. However, it is not that simple to understand it as it requires some HTML and web developer knowledge.

Every web browser allows you to do this but the steps are different.

Microsoft Edge users
  • To view the source code of a web page in Microsoft Edge, follow the steps below.
  • Press Ctrl+U or F12 on your computer's keyboard.
  • Select the Elements tab at the top of the right window.
Or
  • Right-click on a blank part of the web page and select View source from the pop-up menu that appears.
Or
  • Open Microsoft Edge and navigate to the web page of your choice.
  • Click the More Edge more icon icon in the upper-right corner of the screen.
  • Select Developer Tools from the drop-down menu that appears.
  • Select the Elements tab at the top of the right window.
Tip
In Microsoft Edge, the DOM tool also provides interaction with the source code and CSS settings, allowing users to see how changes in the code affect the web page immediately.
Microsoft Internet Explorer users
  • To view the source code of a web page in Microsoft Internet Explorer, follow the steps below.
  • Press Ctrl+U or F12 on your computer's keyboard.
  • Click the Debugger tab at the top of the new menu.
Or
  • Right-click on a blank part of the web page and select View source from the pop-up menu that appears.
Or
  • Open Internet Explorer and navigate to the web page of your choice.
  • Press the Alt key to bring up the browser's menu bar.
  • Select View, and then Source from the drop-down menu that appears.
  • Click the Debugger tab at the top of the new menu.
Tip
With the latest versions of Internet Explorer, pressing the F12 key brings up the DOM tool. This tool provides much more interaction with the source code and CSS settings, allowing users to see how changes in the code affect the web page immediately.
Firefox
Mozilla Firefox and Netscape users
To view the source code of a web page in Mozilla Firefox, follow the steps below.
Press Ctrl+U on your computer's keyboard.
Or
Right-click on a blank part of the web page and select View Page Source from the pop-up menu that appears.
Or
  • Open Mozilla Firefox and navigate to the web page of your choice.
  • Press the Alt key to bring up the browser's menu bar.
  • Select Tools, Web Developer, and then Page Source.
Tip
With the latest versions of Firefox, pressing the F12 key or Ctrl+Shift+I brings up the interactive developer tool. This tool provides much more interaction with the source code and CSS settings, allowing users to see how changes in the code affect the web page immediately.
View a section of the page's source code
  • Highlight the portion of a web page for which you'd like to view the source code.
  • Right-click that highlighted section, and then click View Selection Source.
Tip
Use the Firebug add-on to not only view the source code of a page but change and view those changes live through the browser.
Google Chrome users
To view the source code of a web page in Google Chrome, follow the steps below.
  • Press Ctrl+U on your computer's keyboard.
Or
  • Right-click on a blank part of the web page and select View page source from the pop-up menu that appears.
Or
  • Open Chrome and navigate the web page of your choice.
  • Click on Customize and control Google Chrome Chrome settings icon icon in the upper-right side of the browser window.
  • From the drop-down menu that appears, select More tools and then Developer tools.
  • Click the Elements tab at the top of the new section that appears.
Tip
With the latest versions of Chrome, pressing the F12 key or Ctrl+Shift+I also brings up the interactive developer tool. This tool provides much more interaction with the source code and CSS settings, allowing users to see how changes in the code affect the web page immediately.
Apple Safari users
To view the source code of a web page in Apple Safari, follow the steps below.
  • Press Command + Option + U on your keyboard.
Or
  • Right-click on a blank part of the web page and select Show page source from the pop-up menu that appears.
Or
  • Open the Safari browser and navigate to the web page of your choice.
  • Select the Develop menu.
  • Choose the Show page source option.
Opera users
  • To view the source code of a web page in Opera, follow the steps below.
  • Press Ctrl+U on your keyboard.
Or
  • Right-click on a blank part of the web page and select Page source from the pop-up menu that appears.
Or
  • Open Opera and navigate to the web page of your choice.
  • Click the Menu button The menu button in Opera. in the upper-left corner of the browser window.
  • In the Developer sub-menu, choose Page source.
Tip
If you don't see the Developer sub-menu, choose More tools → Show developer menu. Then, click the menu button The menu button in Opera. again. You should now see the Developer sub-menu listed.
Tip
With the latest versions of Opera, pressing the shortcut combination Ctrl+Shift+I brings up the interactive developer tool. This tool provides much more interaction with the source code and CSS settings, allowing users to see how changes in the code affect the web page immediately.

Android phone running Chrome
  • Open the Google Chrome Internet browser on your phone.
  • Open the web page whose source code you'd like to view.
  • Tap once in the address bar and then move the cursor to the front of the URL.
  • Type view-source: and press Enter or Go.
Tip
For example, to view the code for our homepage, you would type view-source:https://www.computerhope.com
How to close the source code page or tool
Once you're done viewing the source code on a web page, you may want to exit or close it. Closing the source code depends on the method you've used to open it.
If you've used the Ctrl+U method (except for Edge) or the right-click method, close the new tab that opened in the top of your browser window.
If you've used the developer method (pressing F12 or Ctrl+Shift+I), click the Edge remove x in the upper-right corner of the tools window.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us