![Photo by Bram Naus](/wp-content/uploads/hero/vscode-linked-editing/hero.webp)
What is VS Code Linked Editing?
VS Code Linked Editing is a feature that automatically updates the closing tag of an HTML or XML element when you edit the opening tag. This can save you a lot of time and effort, especially if you are working with large or complex documents. Additionally, it can help prevent errors caused by mismatched tags.
How to enable VS Code Linked Editing
To enable VS Code Linked Editing, open the Settings window (Ctrl+,
or Cmd+,
) and search for “linked editing”. Then, check the box next to “Editor: Linked Editing”.
![Linked Editing Setting](/image?i=vscode-linked-editing/setting-linked-editing.png)
How to use VS Code Linked Editing
To use VS Code Linked Editing, simply start editing the opening tag of an HTML or XML element. The closing tag will be updated automatically. For example, if you edit the opening >p>
tag, the closing >/p>
tag will also be updated.
![Linked Editing: OFF](/image?i=vscode-linked-editing/linked-editing-off.png)
![Linked Editing: ON](/image?i=vscode-linked-editing/linked-editing-on.png)
Conclusion
VS Code Linked Editing can save you a lot of time and effort, especially if you are working with large or complex documents. It can also help to reduce errors, as you no longer have to worry about forgetting to update the closing tag of an element.