Block Image With Text: Difference between revisions
From Posstack.com Documentation
(Created page with "This block helps you create separate content blocks (Each block comes with its heading, tagline, description, featured image, and CTA button). You can easily position the image (left, right, center, or bottom) to pair with the description text. <image> From the Shopify theme editor, click on '''Image with text''' on the sidebar to view the details of settings. ''(If you’re new to our Easy Content Builder, please refer to section Add App Sections and Add ECB B...") |
No edit summary |
||
| Line 1: | Line 1: | ||
This block helps you create separate content blocks (Each block comes with its heading, tagline, description, featured image, and CTA button). You can easily position the image (left, right, center, or bottom) to pair with the description text. | This block helps you create separate content blocks (Each block comes with its heading, tagline, description, featured image, and CTA button). You can easily position the image (left, right, center, or bottom) to pair with the description text. | ||
From the Shopify theme editor, click on '''Image with text''' on the sidebar to view the details of settings. | |||
[[File:Block image with text.png|1200x1200px]] | |||
''(If you’re new to our Easy Content Builder, please refer to section [[Add App Sections]] and [[Add ECB Blocks]] for more details on how to create and edit a section or a block.)'' | ''(If you’re new to our Easy Content Builder, please refer to section [[Section Settings|Add App Sections]] and [[Add Blocks|Add ECB Blocks]] for more details on how to create and edit a section or a block.)'' | ||
{| class="wikitable" | {| class="wikitable" | ||
!Section settings | !Section settings | ||
Revision as of 02:34, 23 November 2022
This block helps you create separate content blocks (Each block comes with its heading, tagline, description, featured image, and CTA button). You can easily position the image (left, right, center, or bottom) to pair with the description text.
From the Shopify theme editor, click on Image with text on the sidebar to view the details of settings.
(If you’re new to our Easy Content Builder, please refer to section Add App Sections and Add ECB Blocks for more details on how to create and edit a section or a block.)
| Section settings | Description |
|---|---|
| Image | Add the image you want to feature in the block. |
| Image Width | Set the width (in pixel) of the collection’s featured image. |
| Image Height | Set the width (in pixel) of the collection’s featured image. |
| Image Crop | Cut out a part of the image: Top, Left, Bottom, Right, Center. |
| Image Border | Set the style of the image border: square, rounded, or thumbnail. |
| Image position | Position the image (left, right, center, bottom) to pair with the block’s main text content. This setting is only applied to Desktop devices. |
| Element Alignment | Align the content to the vertical position: top, middle, or bottom. |
| Text Alignment | Align text to the left, right, or center. |
| Title | Type a title for the content block. |
| Title Size | Change the heading to H1, H2, H3, H4, H5, or H6. |
| Tagline | Type a short tagline for the content block. |
| Tagline Size | Change the tagline to fs_1, fs_2, fs_3, fs_4, fs_5, or fs_6. Set to ‘fs_1’ for the largest size. |
| Description | Type the content of the block. |
| Description Size | Change the text size to fs_1, fs_2, fs_3, fs_4, fs_5, or fs_6. Set to ‘fs_1’ for the largest size. |
| Button Text | Enter the button’s text. Leave this field empty to disable the button. |
| Button URL | Set the internal or external URL for the button’s link. |
| Button Color | Choose the color of the button (based on the predefined button styles). |
| Button Size | Set the button size that ranges from 'fs-1' to 'fs-6'. Use ‘fs-1’ for the largest button size. |
| Padding Top | Set the padding top (in px) of the block. |
| Padding Bottom | Set the padding bottom (in px) of the block. |
| Margin Top | Set the margin top (in px) of the block. |
| Margin Bottom | Set the margin bottom (in px) of the block. |
