# CMS Development Tutorials - "Getting started with modules" Bug

**URL:** <https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189>\
**Category:** CMS Development\
**Tags:** local-development, css, html, starter\
**Created:** [August 2, 2022, 7:16pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189 "2022-08-02T19:16:58Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![HLin](https://avatars.discourse-cdn.com/v4/letter/h/6bbea6/32.png) [@HLin](https://community.hubspot.com/u/HLin)\
**Post date:** [August 2, 2022, 7:16pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/1 "2022-08-02T19:16:58Z")

</div>

I am trying my hand at working with the web development side of HubSpot and going through the tutorials one by one. I’ve started the [“Getting started with modules” tutorial](https://developers.hubspot.com/docs/cms/guides/getting-started-with-modules) and got through Part 1 without problem. In Part 2, however, when I attempt to add the

Testimonial.module

created from Part 1 into the

home.html

template in the suggested line, I get an error along the lines of:

Invalid argument in ‘dnd\_module’: dnd\_area-module-4 spanning columns 1 to 6 overlaps with dnd\_area-module-3 spanning columns 1 to 12

After attempting to redo the tutorial and doing my own debugging, I determined that the code I’m adding doesn’t result in the desired change that is shown in the tutorial:

 ![Default-Module-in-Template-11.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/b/2/b23cf3c7b31454ec5084efaa89dc62dbfb878080.png)

In addition, the tutorial references a

homepage.html

that doesn’t exist and thus I assumed would be the

home.html

file.  
And so, I came to the conclusion that either there is a bug I don’t understand while attempting this tutorial, or the tutorial is possibly out of date. I am wondering if anyone else is running into the same issue or if they have resolved this before and how?

---

<div class="post-metadata">

**Author:** ![Jaycee\_Lewis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jaycee_lewis/32/61352_2.png) [@Jaycee\_Lewis](https://community.hubspot.com/u/Jaycee_Lewis)\
**Post date:** [August 2, 2022, 8:30pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/2 "2022-08-02T20:30:03Z")

</div>

Hi, @HLin 👋 Thanks for bringing this to our attention. I am going to block some time off today and run through the guide up to where you are having issues. I’ll follow up here with what I find out for us.

Talk soon! — Jaycee

---

<div class="post-metadata">

**Author:** ![cprv](https://avatars.discourse-cdn.com/v4/letter/c/df788c/32.png) [@cprv](https://community.hubspot.com/u/cprv)\
**Post date:** [November 17, 2022, 8:40pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/3 "2022-11-17T20:40:28Z")

</div>

I also ran into this same issue.

---

<div class="post-metadata">

**Author:** ![lourancostahs](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/lourancostahs/32/2790_2.png) [@lourancostahs](https://community.hubspot.com/u/lourancostahs)\
**Post date:** [January 25, 2023, 6:57pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/4 "2023-01-25T18:57:37Z")

</div>

Hi @HLin and @cprv .

I was having the same problem, maybe these two link can help you.  
[https://community.hubspot.com/t5/CMS-Development/Cant-get-grid-system-to-work/m-p/435588](https://community.hubspot.com/t5/CMS-Development/Cant-get-grid-system-to-work/m-p/435588)

> **[Drag and Drop Areas HubL Tags - HubSpot docs](https://developers.hubspot.com/docs/cms/reference/hubl/tags/dnd-areas)**
>
> The HubL tags used to build drag and drop areas that allow developers to create sections of pages that support layout, stylistic and content changes directly within the content editors.

In my case I decide that each module has width=4, the first start with offset = 0, the secont with offset = 4 and the last with offset = 8.

 ![Screenshot 2023-01-25 at 15.43.14.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/b/0/b00466a9c9850de77edac9622f2325e175484bb6.jpeg)

 ![Screenshot 2023-01-25 at 15.56.35.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/b/2/b22738f4dfb331a82339ddda362394db2db759bd.png)

---

<div class="post-metadata">

**Author:** ![Jaycee\_Lewis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jaycee_lewis/32/61352_2.png) [@Jaycee\_Lewis](https://community.hubspot.com/u/Jaycee_Lewis)\
**Post date:** [January 27, 2023, 11:10pm UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/5 "2023-01-27T23:10:55Z")

</div>

Thanks for sharing that, @lourancostahs 🙌

---

<div class="post-metadata">

**Author:** ![LFilip](https://avatars.discourse-cdn.com/v4/letter/l/c89c15/32.png) [@LFilip](https://community.hubspot.com/u/LFilip)\
**Post date:** [April 26, 2023, 8:58am UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/6 "2023-04-26T08:58:35Z")

</div>

I got into the same issue following the tutorial, I’m stuck, any news with this?

---

<div class="post-metadata">

**Author:** ![LFilip](https://avatars.discourse-cdn.com/v4/letter/l/c89c15/32.png) [@LFilip](https://community.hubspot.com/u/LFilip)\
**Post date:** [April 26, 2023, 9:05am UTC](https://community.hubspot.com/t/cms-development-tutorials-getting-started-with-modules-bug/62189/7 "2023-04-26T09:05:11Z")

</div>

For anyone here with the same issue, the problem comes from the grid system. @lourancostahs answer should be accepted as a fix. In my case for the same issue, his suggestion did the trick.
