# Issue: Formatting HubL + HTML code in VS code

**URL:** <https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109>\
**Category:** CMS Development\
**Created:** [May 28, 2024, 12:48pm UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109 "2024-05-28T12:48:15Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![JohanBHennius](https://avatars.discourse-cdn.com/v4/letter/j/c2a13f/32.png) [@JohanBHennius](https://community.hubspot.com/u/JohanBHennius)\
**Post date:** [May 28, 2024, 12:48pm UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109/1 "2024-05-28T12:48:15Z")

</div>

Hi all,

I am wondering if you can help me.

My VS code is not formatting the HubL + HTML code properly and i cannot figure out why. Please see below image

 ![JohanBHennius_2-1716900287375.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/a/af8d4ed2fc43b34ed4332a5f30a6f0210f5ae44b.png)

I followed the advice on [this post](https://community.hubspot.com/t5/CMS-Development/VS-Code-Formatting-Problem/m-p/816756?lightbox-message-images-817060=94383i264AE67D181DD565) and adjusted my setting as follows:

Files: Associations settings

 ![JohanBHennius_0-1716910930375.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/1/7/177ca420c2445e070d0ad8411b6f7fdc5c6151c7.png)

Emmet: Include Languages settings

 ![JohanBHennius_1-1716910956784.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/b/b4e88268c41a45fc53e0300cc403965266790ebc.png)

Current extensions:

 ![JohanBHennius_3-1716900456377.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/6/c/6c724c890589192b1fd000034849a04c45ac63a7.png)

settings.json

I must be missing something but i cannot figure out what.  
Anyone able to help?

---

<div class="post-metadata">

**Author:** ![GRajput](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/grajput/32/102020_2.png) [@GRajput](https://community.hubspot.com/u/GRajput)\
**Post date:** [May 28, 2024, 3:27pm UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109/2 "2024-05-28T15:27:32Z")

</div>

Hi @JohanBHennius

You will find a language detector below in your vs code window. Click on that and select HTML+Hubl. It will automatically format the code.

 ![GRajput_1-1716910019827.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/6/e/6e0973e862b488dd1b1467bac1c5163e5ac60f37.png)

I hope this will help you out. Please mark it as **Solution Accepted and upvote** to help another Community member.  
Thanks!

---

<div class="post-metadata">

**Author:** ![JohanBHennius](https://avatars.discourse-cdn.com/v4/letter/j/c2a13f/32.png) [@JohanBHennius](https://community.hubspot.com/u/JohanBHennius)\
**Post date:** [May 28, 2024, 3:31pm UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109/3 "2024-05-28T15:31:42Z")

</div>

Hi Gaurav,

Thank you for replying!  
Unfortunately, this has not worked. Please see below:

 ![JohanBHennius_0-1716910217594.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/b/b818df381ed9eec7040704f2fbabd5e78352c3b7.png)

Is there anything else i can try?  
Thank you!

---

<div class="post-metadata">

**Author:** ![GRajput](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/grajput/32/102020_2.png) [@GRajput](https://community.hubspot.com/u/GRajput)\
**Post date:** [May 29, 2024, 7:37am UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109/4 "2024-05-29T07:37:48Z")

</div>

Hi @JohanBHennius

It might did not work because you are using Pretteir. You can try Pretteir plugin for HubL. Here is the link of the [GitHub repo.](https://github.com/hubspot/prettier-plugin-hubl)

“I hope this will help you out. Please mark it as **Solution Accepted and upvote** to help another Community member.  
Thanks!”

---

<div class="post-metadata">

**Author:** ![JohanBHennius](https://avatars.discourse-cdn.com/v4/letter/j/c2a13f/32.png) [@JohanBHennius](https://community.hubspot.com/u/JohanBHennius)\
**Post date:** [May 29, 2024, 8:37am UTC](https://community.hubspot.com/t/issue-formatting-hubl-html-code-in-vs-code/108109/5 "2024-05-29T08:37:42Z")

</div>

Morning Guarav,

Thank you so much - that seems to have done the trick!

Hope you have a great day 🙂