html

How to Edit an HTML File?

HTML is the most used known language for creating websites. It is easy to learn and integrate the functionality. The user requirement changes time by time. So, it is necessary to update the website continuously. To do so, a developer needs to edit the HTML file to perform the required changes.

In this post, we will provide several possible methods to edit an HTML file. The outcomes of this post are:

Method 1: Edit an HTML file Using the Text Editor

The primary and most basic method to edit an HTML file is by using the text-editor. Here, we are using the notepad which is available by default on well-known operating systems. Follow the below-mentioned steps to edit the HTML file using notepad:

Step 1: Open a text editor
Search for the suitable text-editor and open it. In our case, we are going to use Notepad:

Step 2: Open the HTML file
After the text editor is opened. Go to the File menu and click on Open option:

A dialogue box will appear, select the “All files” option which will make the files with different extensions visible:

Navigate to the location where the HTML file is saved, select it and click on Open:

Step 3: Edit the file
The current HTML code placed in the file will be displayed as shown below:

We are making some changes in the above HTML code. After doing so, the code looks like as shown below:

To save the file, Press CTRL+S to save the file or you can go to File menu and click on Save (as shown below):

You have learned to edit an HTML code using the notepad.

Method 2: Edit an HTML File Using the Source Code Editor

The primary and recommended method is to edit the HTML file using a source code editor. While using the source code editor, the chances of mistakes are less as compared to a simple text editor. Here, we have listed down various steps to edit an HTML file using source code editor.

Step 1: Open a source code editor
Search for the suitable source code editor and open it. In our case, we are going to use Visual Studio Code:

Step 2: Open the HTML file
After the text editor is opened. Go to the File menu and click on Open File option:

A dialogue box will appear, select the HTML file you want to edit and click on Open:

Step 3: Change the code
Currently, the following code resides inside the selected HTML file:

After performing the suitable changes, the HTML code looks like as:

To save the file, press the shortcut key CTRL+S or click on File menu and then on Save option:

Here you go! You have learned to edit an HTML file using the text as well as a source code editor.

Conclusion

An HTML file can be edited using the text editor or any source code editor. This post has demonstrated the way to edit an HTML file using a text editor and a source code editor. As an example, we have used the notepad as a text editor and the Visual Studio Code as a source code editor to edit an HTML file.

About the author

Adnan Shabbir