Skip to main content

Styling the Image Block in the Triptease Messages Platform

Learn to upload, style, and position images with borders, padding, and alt text in Triptease Messages.

Updated over a week ago

TL;DR

  • Upload and customize an image up to 3MB in size

  • Control image shape, border, padding, and placement

  • Alt text improves accessibility and SEO


When to Use It

Use the image block when you want to:

  • Add a visual element to your message, such as a photo or a GIF

  • Highlight amenities, destinations, or promotions

  • Enhance message design with branding or lifestyle imagery

This block is especially effective in messages where visual impact supports decision-making or builds trust.


Step-by-Step Instructions

1. Upload or Change Your Image

  • Click the Upload image button to add a file (maximum size: 3MB)

  • Once uploaded, you will see Change and Crop buttons to adjust the image


2. Add Alt Text for Accessibility

  • Use the Alt text field to describe the image for screen readers

  • This also helps in cases where the image fails to load

Example: "Colorful sushi bowl with rice and vegetables"


3. Adjust Appearance and Layout

Corner Radius

  • Round the image corners using the Corner radius slider or input box

Layout Padding

  • Use Horizontal padding and Vertical padding to create space around the image within the section or container

Border Styling

  • Set Border thickness to outline the image

  • Choose a Border color to match your brand or message style


Pro Tips

  • Choose high-quality, lightweight images to avoid slow loading

  • Keep file sizes below 3MB and use .JPG or .PNG formats for best compatibility

  • Use consistent padding and corner radius for visual harmony across content blocks

  • Crop images to match the layout style and avoid awkward spacing


FAQs / Troubleshooting

Question: Why won’t my image upload?

Answer: Check that your file is under 3MB and in a supported format (.JPG, .PNG, or .GIF for animations).

Q: Why does the image look cut off or misaligned?

A: Check padding and section/container layout settings. Use the crop tool to adjust focus.

Q: How can I center my image in the message?

A: Adjust alignment at the section or container level.

Did this answer your question?