Setting a Background Image in an Email

Robert Kohnke
  • Edited

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');'


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.




Please sign in to leave a comment.