topic Re: Calling a module from within a module in CMS Development

Calling a module from within a module

Oloph — Mon, 20 Apr 2020 11:28:33 GMT

Hi Forum, my apologies if this is already covered, please point me to the resource in that case!

I'm wondering if it's possible to "nest" code modules, i.e. calling in the entire functionality from a module in another module.

In this case I have a 2-column layout thing with left and right containers, which can hold rich text, image, video embed or a blog list. The content editor selects the type of content from a switch in the module.

So Hubspot has this ready-made video-embed module that pulls in Youtube or Vimeo clips. Can I somehow reference that whole module from my module and get it to work? Or do I need to copy the entire video module code into my module? Seems like bad practice to duplicate code like this.

I was hoping for something as simple as in the below, like "if 'video' is selected, enable this video module".

I'm just a designer and self-taught coder.

Thanks!

<div class="page-center content-section">
  <div class="two-column-highlight">
    
    <!-- RICH TEXT BOX -->
    <div class="highlight text {% if module.image_position =='img_left' %}image-left{% endif %}">
      {% inline_rich_text field="highlight_text" value="{{ module.highlight_text }}" %}
    </div>
    
    <!-- OPTION: IMAGE -->
    {% if module.media_content == 'image' %}
    <div class="highlight {% if module.image_position =='img_left' %}image-left{% endif %}">
        <img src="{{ module.image.src }}" alt="{{ module.image.alt }}" {{ sizeAttrs }}>
    </div>
    
    <!-- OPTION: VIDEO -->
    {% elif module.media_content == 'video' %}
    <div class="highlight {% if module.image_position =='img_left' %}image-left{% endif %}">
      {% module "module_1587375821196241" path="@hubspot/video_embed_lp", label="Video Embed - LP" %}

Re: Calling a module from within a module

BenSBM — Mon, 20 Apr 2020 12:08:20 GMT

Hi Oloph,

In both the design manager and local dev with the CLI, you will get an error showing that "'module' is disabled in this context" - so unfortunately I don't think that this is possible to do and you would need to add the code directly to your module.

Re: Calling a module from within a module

Oloph — Mon, 20 Apr 2020 19:22:18 GMT

Many thanks for replying Ben. So we're not quite there where we can build portable minimodules for re-use in other modules.

OK, will research workarounds. And learn!

Best!

Re: Calling a module from within a module

fdido — Thu, 01 Dec 2022 10:39:47 GMT

hmm then it would be sound dumb to use hubspot than just react huh

Re: Calling a module from within a module

CXurious — Wed, 17 Jul 2024 14:46:15 GMT

Adding this more recent thread as a referernce.

Re: Calling a module from within a module

JRodriguez76 — Fri, 17 Jan 2025 00:57:38 GMT

Hi, Can we implement a module within a module?
I have to repeat my code?

Re: Calling a module from within a module

CXurious — Fri, 28 Mar 2025 16:08:08 GMT

The way Hubspot solves for this is interesting. This is where Macros come in. You can create your "atoms" as macros then call them in other components to achieve what, in some CMSs are known as "complex components"--or combining multiple components to achieve a single experience.

There is no way to call a module within a module in hubspot. So you have to create the element you want to repurpose as a macro.

Just remember that your component field JSON has to match to get a consistent authoring/display experience.

I'm pretty sure it was this dhug video that helped me understand the macro as the solution to the complex component.

Hope this helps!