https://community.hubspot.com/t5/CMS-Development/Multi-layered-backgrounds-with-drag-and-drop/m-p/555815#M26810 <P>Hey everyone, I need some help here.</P> <P>&nbsp;</P> <P><STRONG>SCENARIO</STRONG></P> <P>I’m building out a dnd template for a theme. I’d like to have a section that contains a multi-layer background. The background contains 3 gradient layers, an image layer, and a blend-mode for each layer.</P> <P>&nbsp;</P> <P><STRONG>CSS</STRONG></P> <LI-CODE lang="css">background: linear-gradient(to right, rgba({{ bgColor|convert_rgb }}, 1), rgba({{ bgColor|convert_rgb }}, 0)), linear-gradient(to right, rgba({{ bgColor|convert_rgb }}, .5), rgba({{ bgColor|convert_rgb }}, .5)), linear-gradient(to right, #fff, #fff), url({{ bg.bg_image.src }}); background-position: {{ convert_position(bg_hor, bg_vert) }}; background-size: cover; background-blend-mode: normal, normal, saturation, normal; background-repeat: no-repeat;</LI-CODE> <P>&nbsp;</P> <P><STRONG>IDEAL SOLUTION</STRONG></P> <OL> <LI>How can I build this type of background for a dnd section? I see dnd section options for “background_image,” “background_color,” and “background_linear_gradient,” but not for “background” or “background-blend-mode,” which are needed in order to get this effect. Is the effect possible?</LI> </OL> <P>&nbsp;</P> <P><STRONG>POTENTIAL WORKAROUNDS</STRONG></P> <OL> <LI>Build a custom module with the background and then create a dnd section that uses the module. A content editor can then add the section to any dnd area. How can I turn off the dnd section options (content alignment, padding, margin, background) after setting default values, since adjusting those will cause the module background to not fill the dnd section correctly?</LI> </OL> <OL start="2"> <LI>Build a custom module that can be added to a flexible content area. How can I allow a content editor to add a module or a dnd section without designating specific dnd areas and flexible widget areas (so they can add a module or dnd section anywhere on the page)?</LI> </OL> Thu, 13 Jan 2022 19:41:57 GMT r_levine 2022-01-13T19:41:57Z