Xmailer
  • Xmailer: The Ultimate Email Marketing Platform
  • CONTACT LIST MANAGEMENT
    • Create a contact list
    • Resubscribe after an unsubscribe
    • List X-Ray
    • View or search your contacts
    • Contact Tags Manager
    • Export your contact list
    • Uploading a suppression list
    • Large suppression files
    • Exclusion Lists
    • GDPR Delete & Export
  • SEGMENTING
    • What you can do with segments
    • Create a segment
    • Designing your segment
    • Tag contacts in a segment
    • Export a Segment's Contacts
    • A/B test using segments
  • BROADCAST
    • What you can do with broadcasts
    • Create a Broadcast
    • Broadcast Settings
    • Choosing your email composer
    • Augment your subject line with a preheader
    • Adding your recipients
    • Schedule your Broadcast
    • Resend to non-openers automation
    • Broadcast Reporting
    • Duplicate a broadcast
    • Tag contacts who Open your broadcast
    • Resume an incomplete broadcast
    • Export Broadcast Openers & Unsubscribes
    • Cancel a broadcast
    • Cancel a broadcast funnel trigger
    • Revise tagging and funnel triggers for sent broadcasts
  • USING THE DRAG & DROP EMAIL COMPOSER
    • The Basics
      • Content Row Properties
      • Designing your email - Using Columns
      • Footer
      • Social Media Component
    • Working with multimedia
      • Adding video to your page
      • Using the image editor
      • Using dynamic images for countdown timers and personalized content
      • Search for free, high-quality stock photos in Xmailer
      • Editing Image Properties
      • Adding GIF animations & animated stickers with GIPHY
      • Adding video to your email
      • Using the File Manager
      • How to use external images in your design
    • Working with content blocks
      • Table Content Block
      • Using Internal Links in Pages
      • Working with paragraph and list content blocks
      • Using dividers and spacers
      • Letter and Paragraph spacing
      • Working with titles
      • Working with menus in Xmailer
      • Working with icons
      • Working with custom HTML
    • Settings, rows, & columns
      • Dark Mode Preview
      • Designing with Workspace Styles
      • Designing with Saved Rows
      • Mobile design mode
      • Co-editing
      • Column management
      • Configuring design settings
      • Settings, Rows, and Content: How do they work?
      • Adding a background image to your designs
      • How do I change the properties of a row?
      • Mobile Optimization Options
      • How do I select a row vs. content?
      • Undo, redo & history
      • Working with padding
      • Working with borders
      • Saving your designs in Xmailer
      • Locking content to prevent editing
  • FUNNELS
    • What you can do with funnels
    • Create a funnel
    • Choosing your funnel type
    • From Name & From Email - editing
    • Activating your funnel
    • Trigger an email funnel from a broadcast
    • Tag contacts who open your funnel messages
    • Choosing your email composer
    • Page Augment your subject line with a preheader
    • Design your automated email sequence
    • Contact Suppression and Exclusion
    • Adding a funnel to an opt-in subscriber form
  • SUBSCRIBER OPT-IN FORMS
    • What you can do with forms
    • Create an opt-in form
    • Sending to double opt-in contacts
    • Choosing your form type: floating bars, lightboxes,inline naked embedded, slide outs
    • Exit intent and display rules
    • Adding email and name input boxes to your form
    • Setting the size of your form
    • Configuring how your form displays on mobile devices
    • Configuring your mobile width
    • Add a close window X to your form
    • Adding a "No" button that closes your form
    • Tag subscribers who opt-in to your form
    • Adding "no thanks" text which closes your form
    • View your form conversion rate
    • Connect an existing form to your account
    • Adding your form to your website
    • Add opt-in subscribers to an automated email sequence
Powered by GitBook
On this page
  • Where to find it
  • Row Background Image Settings Explained
  • Email Client Compatibility
  1. USING THE DRAG & DROP EMAIL COMPOSER
  2. Settings, rows, & columns

Adding a background image to your designs

PreviousSettings, Rows, and Content: How do they work?NextHow do I change the properties of a row?

Last updated 1 year ago

Where to find it

We've added more background image options! You can apply your background image to an individual row, or to your entire design.

Row background images

Use this option if you want your background image to only populate on a part of your design.

Start by selecting a row within your design. You will see a Row background image section in the sidebar.

Design background images (New!)

Use this option if you want to apply a background image to your entire design.

Start by selecting the settings tab in the builder sidebar. You will see a background image section in the sidebar.

In both options, the background image is controlled by a toggle. It's disabled by default. Once enabled, additional options will populate. Let's explore the settings available for background images.

Row Background Image Settings Explained

Selecting the image

Once enabled, you can upload an image for your background via the file manager. As with other image-based content, use the Change image button to get started. You can paste an image URL into the field if you wish to use an image hosted elsewhere.

Applying the image

After selecting your background image, you can choose how to apply it. You can apply the background image to the content area, or the entire row. If you select content area, the image will display within the content area width for your design. If you select row, the background image can extend beyond the content area.

Fit to background, Repeat, and Center

Now that you've applied your image, you may want to make some adjustments. What options do you have?

Fit to background

If you need to resize your image to fit the background, this is the option for you!

When you select the checkbox for fit to background, your image will resize to fit the container.

If you enable fit to background, you cannot select another option.

If you disable this option, your image will display with the original dimensions.

Repeat

As the name suggests, this option will cause your image to repeat. This works well with smaller images or symmetrical patterns. If you choose to repeat the popcorn background, for instance, the design would now look like this:

Center

As the name suggests, this option will center your background image.

If you use Repeat and Center simultaneously, the effect is similar to Fit to background. With these two options selected, the background image will repeat rather than resize. For example, say you created a background image specifically for one design. The dimensions may be important to the integrity of your overall design. If this is the case, consider using this combination of settings.

Email Client Compatibility

This section only applies to designing emails. Background images are compatible with all popular browsers. However, we always recommend setting a background color similar to your background image. This way your design will still work if your background image fails to display.

Xmailer uses advanced techniques to ensure background images render on most email clients. That said, there are situations where background images may not be shown.

According to our tests, the following clients do not support background images:

  • Outlook desktop on Windows. (However, background images work on Outlook 2011 & Outlook 2016 on OS X, and on outlook.com)

  • Lotus Notes 7

  • free.fr email client

  • T-Online.de email client

  • Xfinity / Comcast email client