Combine media and messaging like never before with Tailor's new Promotions grid section. Arrange Editorial, Text, and Image blocks to showcase products, share the brand philosophy, and more.
Add this section to
Customize section settings
Click the Promotions grid section to open its general settings.
Heading
Add a Heading using the provided field. Leave the field blank to exclude a heading.
Wide display
Enable Wide display for the section to span the full width of the window. Otherwise, the section will be limited by a horizontal container.
Spacing
Add space between blocks by activating Enable space between blocks. Disable to remove gutters between blocks.
Adjust the Text alignment to align text to the Left, Center, or Right.
Customize promotion blocks
There are three block types for the section: Editorial, Text, and Image.
Editorial
The Editorial block blends text and image together in one, dynamic container.
Click one of the preloaded Editorial blocks to customize its content.
Block width and height
Adjust the Block width and Block height to control the size of the Editorial block.
The first image in each row determines the height of that row
Select image
Click Select Image to connect your media with the block.
Adjust the Image focal point settings for the image(s).
The options are:
| Top left | Top center | Top right |
| Center left | Center | Center right |
| Bottom left | Bottom center | Bottom right |
These settings will produce different results depending on the number of images present, as well as the order and settings of blocks
Upload a separate Mobile image to provide an image more suitable for smaller devices. Adjust the Mobile image focal point to position the image within its container.
The options are:
| Top left | Top center | Top right |
| Center left | Center | Center right |
| Bottom left | Bottom center | Bottom right |
Heading
Add a Heading using the provided field. Leave the field blank to exclude a heading.
Adjust the Heading position and Heading size using the provided settings.
Text
Add Text using the provided rich text field.
Adjust the Text position and Text size using the provided settings.
Connect link
Add a Link to the provided field to connect the block with another page.
Customize the button text by adjusting the Label.
Text
Click the preloaded Text block to customize its content.
Block width and height
Adjust the Block width and Block height to control the size of the Text block.
The first block in each row determines the height of that row
Select image
Click Select Image to connect your media with the block.
Colors
Use the color pickers to select a Text color, Solid background color, and Gradient background.
Text and headings
Adjust the Text position using the dropdown.
Add a Preheading using the provided field, then adjust its size with the Preheading size setting.
To increase the font weight of the preheading, enable Bolder preheading.
Convert the preheading's capitalization to all uppercase with the Uppercase preheading setting.
Add a Heading using the provided field, then adjust its size with the Heading size setting.
Add Text using the provided rich text field.
Adjust the Text size using the provided settings.
Button
Add one or two buttons by completing the Label and Link fields for Button 1 and/or Button 2.
Adjust the styling for these buttons by selecting options for the Style, then colors for the Main color and Contrast color.
Image
Click one of the preloaded Image blocks to customize its content.
Block width and height
Adjust the Block width and Block height to control the size of the Image block.
Select image
Click Select Image to connect your media with the block.
Adjust the Image focal point settings for the image(s).
The options are:
| Top left | Top center | Top right |
| Center left | Center | Center right |
| Bottom left | Bottom center | Bottom right |
These settings will produce different results depending on the number of images present, as well as the order and settings of blocks
Overlay
Activate an Overlay for the image by selecting colors for the Solid overlay or Gradient overlay. Adjust the Overlay opacity to control the transparency levels for the overlay color.
Share your experience with Tailor
Your feedback is crucial! Help make Tailor better by sharing your thoughts.
What to provide:
- Pain points: What's not working for you?
- Missing features: What should we add to Tailor?
- General feedback: Any other ideas?
How to provide feedback:
- Fill out our quick and easy form.
- Details help us improve, so the more specific, the better!