CMS Development

MNick2
Participant

Module within a Module?

SOLVE

Is there anyway to use a module within a module? We're developing a theme, so there's a dnd_section and inside that is a row, but we realized you can't have generic HTML inside these areas...

 

So originally we were planning on doing something like

 

 

 

{% dnd_section %}
    {% dnd_row %}
        <div class="class_to_affect_modules">
            {% dnd_module path="" %}
            {% dnd_module path="" %}
        </div>
    {% end_dnd_row %}
{% end_dnd_section %}

 

 

 

But that wouldn't work, not only because you can't wrap the modules in HTML code, but also dnd_module requires width and offsets, so it could then wrap span tags around the modules, and create un-necessary additional HTML..

 

An an ideal world you would be able to insert dnd_modules wrapped in HTML, and not have to set any width/offset on the dnd_modules, and let it just generate the module html only.. and wrap those modules in HTML code.

 

So because that doesn't seem to work, my next best idea was to wrap the two modules inside another module, but I also can't seem to find a way to do this.

 

modules.jpg

 

And to discuss a further point, we have tried to use a 2 column layout when adding a new section, and insert a module on the left and right, but this doesn't fix what we're trying to accomplish. The two modules basically need their CSS layout configured from the parent div.

1 Accepted solution
Stephanie-OG
Solution
Key Advisor

Module within a Module?

SOLVE

Thanks for the tag @Jaycee_Lewis !

 

Hey @MNick2 - the short answer to your main question is unfortunately no, there's no way to have a module nested within a module. 

 

As for your original plan, a dnd_section in a page template can't have a class, but if you're using it in a section template, you can add a class. So your section template could look like: 

 

<!--
  templateType: section
  label: My Section
  isAvailableForNewContent: true
  description: "A custom section"
-->
{% dnd_section 
  class="class_to_affect_modules"
%}
  {% dnd_module path="" %}
  {% end_dnd_module %}
  {% dnd_module path="" %}
  {% end_dnd_module %}
{% end_dnd_section %}

 

But you're right in that it would wrap those modules in a few divs/spans with additional code (which I guess you could technically override with your class). 

 

If you want more control but you want the two inner modules to be reusable, you could use something like web components or macros instead. Web components can be used in modules (althhough I haven't done much with them myself yet!) and I think macros can be tricky to use in custom modules but is somewhat possible (some discussion here).

 

I hope that helps! 

View solution in original post

3 Replies 3
CXurious
Member

Module within a Module?

SOLVE

Just adding this here in case anyone else stumbles upon this in attempts to find the way to reference an already-existing module inside a module. 

 

The best info I've found on this subject is here

 

Most recent Hubspot Developer documentation in full located here. 

 

@Jaycee_Lewis anyway we could get more info on this related concept wrapped into the developer documentation on modules? Sure would be helpful. Right now it seems like this concept is not possible at all when there are ways to achieve calling a module to create a complex module. This is a standard experience platform concept that could be better documented. 

 

 

Cheers, 
Jennifer

CXurious

0 Upvotes
Stephanie-OG
Solution
Key Advisor

Module within a Module?

SOLVE

Thanks for the tag @Jaycee_Lewis !

 

Hey @MNick2 - the short answer to your main question is unfortunately no, there's no way to have a module nested within a module. 

 

As for your original plan, a dnd_section in a page template can't have a class, but if you're using it in a section template, you can add a class. So your section template could look like: 

 

<!--
  templateType: section
  label: My Section
  isAvailableForNewContent: true
  description: "A custom section"
-->
{% dnd_section 
  class="class_to_affect_modules"
%}
  {% dnd_module path="" %}
  {% end_dnd_module %}
  {% dnd_module path="" %}
  {% end_dnd_module %}
{% end_dnd_section %}

 

But you're right in that it would wrap those modules in a few divs/spans with additional code (which I guess you could technically override with your class). 

 

If you want more control but you want the two inner modules to be reusable, you could use something like web components or macros instead. Web components can be used in modules (althhough I haven't done much with them myself yet!) and I think macros can be tricky to use in custom modules but is somewhat possible (some discussion here).

 

I hope that helps! 

Jaycee_Lewis
Community Manager
Community Manager

Module within a Module?

SOLVE

Hi, @MNick2 👋 Thanks for reaching out. Including your details + context about your goals is very helpful for the community. Let's see if we can get the conversation going — hey @Stephanie-OG @alyssamwilie @weiliang_lee, do you have any feedback you can offer @MNick2? Or thoughts on how you might tackle this type of project based on your experience?

 

Thank you! — Jaycee

linkedin

Jaycee Lewis

Developer Community Manager

Community | HubSpot

0 Upvotes