Fix Visual Studio Code HTML Boilerplate Shortcut Key

Web Development

In this tutorial you will learn how to fix the HTML5 Boilerplate Emmet Shortcut Key in Visual Studio Code aka VS Code. If the Shift + 1 shortcut key is not working then this is the solution.

June 2022 (version 1.69)

Welcome to the June 2022 release of Visual Studio Code. There are many updates in this version that we hope you’ll like, some of the key highlights include:

Sadly with this update they also somehow disabled the shortcut key for the HTML5 Boilerplate using Emmet that was Shift+1 then followed by TAB or Enter.

Why they did this… don`t ask me… but they did. So now we need to FIX it

Here are two possibilities:

  • Use html:5 code snippet
  • Re-Activate the ! code snippet using Emmet with the Shift+1

HTML:5 code snippet

In Visual Studio Code simply typing in html:5 will show you the <!DOCTYPE html> boilerplate using the build in Emmet Abbreviation in VS Code.

HTML Boilerplate Shortcut Key Shift +1

I guess the you still prefer the Shift +1 Shortcut key since you are still reading this article.

Here is how you can reactivate it.

Having Visual Studio code opened, go down in your left corner and click on the Manage icon.

From the Manage tab you can now chose the Command Palette. Click on the Command Palette to open it op.

In the Command Pallet type in “open user settings” and click on it.

In the user settings menu search for “Emmet” and click on it to open up the settings for Emmet.

Then scroll down to the bottom thill you find “Trigger Expansion on Tab” and check the “When enabled, Emmet abbreviations are expanded when pressing TAB”.

After having checked the box you could close up the settings tab and press Shift+1 then TAB and you should see the Boilerplate aperea.

Also check the Use inline Completions .

This will also show you the boilerplate graide out.

Hope this was helpful ! 🙂

Shot and to the point.

Video Tutorial

Check out the video tutorial for this post for a more detailed and visual explanation .

Check out more post

You might be interested in relevant Post link:

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.