Text box over your photo, like famous companies sometimes do?
Our drag and drop editor works with rows. So, in principle, you would put a row over a row. You can't. That's why you cut your images into two pieces, so to speak.
Step 1: cut your image into two parts
What we've done in the above example is cut the image in two:
You now have a main image (the top part) and the bottom strip of the image.
Step 2: add 2 blank rows to your newsletter
Now you add two empty rows to your newsletter:
Step 3: add the images as background image
Now click on the row. In the right-hand side of the row properties you will see row background image. Move the slider to the right:
Place your first image on top. And your second, cut off image, below. Make sure that at 'Apply image to' you set 'row'. And that you have a check mark at 'center':
At this point you see the following in front of you:
Two rows, with 2 images in the background. As you can see, you still need to fit the images so that they match.
Step 4: fit your images with a spacer
Add a spacer to one row and to the other:
You now see the following in front of you:
The images still need to be stretched, so they fit perfectly.
Stand on the spacer. On the right side of the 'content' you will see properties,
height.
Increase the height all the way until the two images fit together again. In my example, this amounts to a height of 500:
Step 5: insert a text block
Now drag a text box into a spacer, like the example:
To make the text box white, stand on the row, and via rows make the 'content area background color' white instead of transparent:
Want to make your text block bigger? You can do that too! Go to the text block and go to 'block options'. Here you can adjust the padding of your text block:
I have already adjusted mine. My end result is as follows:
And you're done! Cool, huh! π
Please note that not every email client displays background images correctly on the mobile version. We have no influence on this.