Close Menu
  1. Photo And Text

Photo And Text

Display a photo using the Dirigible Columns format.

Usage

The Photo and Text block is a parent container that uses the Dirigible Columns UX pattern. The rightmost child block works the same as the Dirigible Columns child blocks, but the leftmost block is a simple image field.

To access the parent level controls listed on this page, make sure you have the parent block selected. If you need help selected the parent block, we’ve got you covered.

Note: This block is designed for ease of use and has a truncated feature set compared to the standard Dirigible Columns block. This block does not have options for text alignment, background, or reverse printing. If you need these options, use a Dirigible Columns block instead.

Choosing a Photo

Simply click the photo on the left to select one from your media library.

Swap Blocks

Change the order of the blocks on desktop.

The Swap Blocks setting is used to change the order of the blocks on desktop.

This is an important distinction and can be used to control the flow of your website on mobile, giving your users the best mobile experience possible.

For example, if you’d like to alternate blocks with photo backgrounds on desktop but want the accompanying content to be displayed under the photo on mobile, you would create the blocks in the editor with the leftmost block as the photo background and the rightmost block as the content block. This way, they will stack on mobile, left first then right. Then, selecting Swap Blocks on every other Dirigible Blocks group.

Mobile swap blocks example.

Example mobile stacking.

The same blocks viewed on desktop. In this example, the second Dirigible Blocks group has Swap Blocks enabled.

Show More Show Less

Photo And Text