Support
Still have questions? Message us.
These editable features cannot be added using the visual template editor and require either using the code editor, or editing your code externally to add in.
Enables option to replace a background image.
When area is clicked on, an option for uploading an image will be shown along with an option for entering a URL. Works for background attribute and CSS background/background-image property.
block-background or -block-background: true
Example:
<div class="block-background" background="image.jpg">Text copy for an area.</div>
The option shows as either standalone, with the block-bgcolor option, or with region options. You'll need to ensure it's not covered by other editable areas in order for it to be clicked on in the editor.
If there is an additional background property that is outside the container that has the block-background tag, you will need to also use the data-block attribute with a variable name on both the main container and the container with outside property. Like with Outlook code for example.
Example:
<div class="block-background" data-block="feature-bg" style="background-image: url(image.jpg)">
<!--[if mso]><v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width: 450pt; height: 300px; text-align: center"><v:fill type="frame" size="450pt,300pt" alignshape="true" src="image.jpg" data-block="feature-bg" color="#ffffff" /><v:textbox inset="0,0,0,0"><![endif]-->
Enables option to replace a background color.
When area is clicked on, a color palette option is shown. Clicking on it shows a field for entering the hex value for a color. If there is already a defined value, it will show that current value. You'll need to ensure the background area is not covered by other editable areas in order for it to be clicked on in the editor.
block-bgcolor or -block-bgcolor: true
Example:
<div class="block-bgcolor" bgcolor="#333333">Text copy for an area.</div>
Works for bgcolor attribute and CSS background/background-color property.
The option shows as either standalone, with the block-background option, or with region options.
If you want to hide certain areas from being seen in Blocks Edit when working with an email, wrap your code with the block-hide option. When the email is exported, the hidden code gets output.
<!-- block-hide -->
<p>Content</p>
<!-- end-block-hide -->
Still have questions? Message us.