Setting a Background Image in an Email

Setting a Background Image in an Email

Setting a background image for text is not a standard feature of Act-On, however, with a little custom in-line CSS, you can add your own background images!

Like this:

Here is the in-line CSS you will want to use for the background image itself:

background-position: center center; background-image: url('URL to your Image');

Here is the full example inline style from below:
style='padding-top: 20px; height: 400px; background color: #003b5c; text-align: center; vertical-align: middle; background-image: url('URL to your image');'

Example:

You will need 3 things:

1. The URL to your image (it must be hosted online) - to make it easy, you can simply upload it to your Act-On Image Library and use the Public URL for that Image
2. A Draft/Template in Act-On that you want to add a background image to
3. The above piece of in-line CSS

That's it!

A few notes:

1. You will likely need to adjust the positioning and size of your image/text to fit within the constraints of your message
2. As this is custom code, Act-On support cannot troubleshoot - but there are lots of online resources that can help you with your CSS!
3. You will see on the first line of my HTML block, that there is a fallback 'background-color' this is important, because not all email clients will be configured to support your background image and you will want a fallback color.

------------------------------
Robert Kohnke
Marketing Operations Strategist, Act-On Software, Inc.
------------------------------