March 2022 | Full Body Background Prerelease Notice
We are providing this pre-release notice of changes to the Beefree SDK UI so that you may update your customer-facing support teams and documentation. This release is currently scheduled for March 31, 2022.
We are excited to announce the release of a new Background image configuration property on the Settings tab of the Page and Email builders. This property will allow users to set a background image for an entire design document. These images can be sourced from an external link or imported via File Manager.
This feature will significantly enhance users' design experience by allowing more control over layering content over images. This property will also provide options for aligning the background image to fit the entire background, center, and/or repeat, allowing users complete control over the positioning of background images.
We have also redesigned the Row Background image property to be more functional with this release. Specifically, we've replaced the "Full Width" check box with a "Fit to Background" toggle to provide enhanced image control. We've also added buttons to apply the image to either the row or the content blocks within it.
Description of Changes
Full Document Background Image
The Background image property shown below will be available when a user clicks the Sidebar tab of the Settings tab.
As noted in the UI, background image support varies across email clients. A fallback content area background color should be chosen for optimal results.
The image below shows the placement of the new property within the UI.
If a user toggles on "Background image" and sets an image via external URL or File Manager import, the image will apply to the entire design background.
The selected image will display at its native resolution by default, not scaling to fit the display. We've added the following options to provide more control over image placement.
- Fit to background . When toggled on, this option scales the image to fit the background dimensions of the entire document. This feature is best used with high-resolution images.
- Repeat. When checked, this option will repeat the image across the entire background. This works best with small images that are designed to "tile".
- Center. When checked, this option will place the image in the center. This option may be used along with Repeat to tile the image around the center.
Reason for Change
The use of background images in design work has several recognized benefits, including:
- Layering of content on top of images. This is useful for CTA buttons, text content, and other elements best separated from the image.
- Enhanced readability when images are not rendered. Since the content is separate from the image, it will not be lost if an email client or web browser cannot render an image. This also helps improve general accessibility.
Row Background Images Property Changes
The following changes will be applied to the Background image property in the Rows tab of the Sidebar.
The option "Apply image to" Content area or Row will be added.
- "Full Width" will be replaced by a "Fit to background" toggle.
Reason for Change
Our development of this feature is intended to streamline the user experience. We believe that this change will:
- Clarify how Row image backgrounds can be formatted.
- Add more control over where image backgrounds appear within a design.
Specific implementation details will be provided upon feature release. The UI changes to the row background image property will apply automatically at that time. No action is needed to apply changes to existing templates; this feature is fully backward compatible.