CMS Development

Jacob02
Contributor

Custom layout modules

Hello,

 

I would like to code my own layouts - into which you could drop the custom modules. So for example an element with a background image and round borders into which I could drop all available modules.

 

Per default HubSpot offers the layouts on the screenshot but they aren't enough for my usecase.

 

layout.png

 

I tried to clone the existent layout with a custom module but it didn't worked.

Here's the code:

 

<section class="cos-section selectable draggable" draggable="true">
  <div class="mouse-events-handler" data-test="section-mouse-events-handler">
    <div class="mouse-events-handler-children">
      <div class="cos-snap-placeholder before" style="display: none;">
      </div>
      <div id="section_1571397665281" class="hse-section hse-section-1-col" style="opacity: 1;">
        <div class="hse-column-container" style="background-color: rgb(255, 255, 255);">
          <div id="column_1571397665281_0" class="hse-column"><div class="hs_cos_wrapper_widget hs_cos_wrapper_widget_placeholder">
            <div class="cos-drop-placeholder">
              <i18n-string data-locale-at-render="en-us" data-key="layoutBuilder.placeholders.content">Drop content here</i18n-string>
            </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

I appreciate any feedback.

0 Upvotes
3 Replies 3
Jacob02
Contributor

Custom layout modules

Hi,

 

just a quick update :

 

A dynamic {% include "module path" %} won't work within a custom module. It will only cause an overflow. And since {% module %} is deactivated for custom modules (probably for that reason) I'm still hoping that somebody can help me with the issue.

 

Best

 

0 Upvotes
Kevin-C
Recognized Expert | Partner
Recognized Expert | Partner

Custom layout modules

Hey @Jacob02 

 

My assumption is that the dragging and dropping of modules is the part that is not working? If that is not the case you could probably disregard this comment lol.

 

Have you taken a look at flexible columns?

Kevin Cornett - Sr. Solutions Architect @ BridgeRev
Jacob02
Contributor

Custom layout modules

Hi @Kevin-C ,

 

thanks for your answer.

 

Yes, your assumption is correct - the dropping of modules isn't working. 

 

You can see in the GIF how the Code of a default Layout module changes, but not the Code of the custom one.

 

custom_layout.gif

 

I just took a quick look at flexible columns, but "this module is not available on blog, system page, or email templates." And since I want to use the custom layout modules for the email drag and drop editor, they don't work.

0 Upvotes