Setting default section maximum content width for auto generated sections in DnD templates!!
TL;DR
To ensure content editors create consistent layouts in pages. How can I set my theme to use a default maxiumum width/padding for auto generated section when modules are dropped into a DnD template?
The issue
I have setup a new theme which uses DnD page. We now have content editors populating the pages and have expressed that it is very fiddly to try and set the content width for the sections.
When they drag a module into the page, the section that is automatically generated reset to 0 for all values.
As the developer I have been asked to go back in and make the DnD sections consistent for them. Not sustainable for me as we are onboarding 6 new team members who will also be responsible for managing pages. So I can already see the nicely formatted pages I have set up loosing consistency. So I need a solution.
What I have done so far
1. Setting the dnd_section in the template
I have page template which contains:
<main id="main-content" class="body-container-wrapper">
{# Ensure pages with DND have a H1 tag #}
{% dnd_area 'dnd_area' class='body-container body-container--home', label='Main section' %}
{% dnd_section
vertical_alignment='TOP'
max_width=1180,
padding={
'top': '30px',
'bottom': '30px',
'left': '20px',
'right': '20px'
},
%}
{% dnd_column %}
<!-- Inside is where the modules will sit -->
{% end_dnd_column %}
{% end_dnd_section %}
{% end_dnd_area %}
</main>
My understanding is, when a new page is created a DND space will be created where modules can be DnDed.
This works:
Editor drops in module. Perfect width. Happy Days!
The issue comes when a Editor drops in a second module from the side. The new section does not retain the default settings I have set in the template file.
This does not work.
2. Setting the maximum spacing in the theme.json file
TBH I was just grasping at straws, I saw in the Theme boilerplate there is a Spacing option: