Map And Text
- Blocks
- Section
- Buttons
- Counters
- Blocks
- Comparison Table
- Columns
- Breadcrumbs
- Call To Action
- Landing Page
- Tabs
- YouTube
- FAQ
- Grid
- Hero
- Media Callout
- Voronoi
- Site Preview
- Jump Nav
- Jump Link
- Link-in-Bio
- Logos
- Map
- Media and Text
- Photo Feature
- Posts
- Price List
- Quote Blocks
- Quotes
- Slider
- Structured List
- Socials
- Timeline
- Yearbook
- Vignette
- Video Gallery
- Home ›
- Blocks ›
- Media and Text ›
- Map And Text
Map And Text
Display either a map using the Dirigible Blocks format.
Usage
The Map and Text block is a parent container that uses the Dirigible Blocks UX pattern. The first block, however, is a Map block rather than a standard Dirigible Blocks child. For more information about either of these blocks, refer to their respective documentation.
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.
Block Size
The sizing option will change the size of blocks on desktop. This is independent from the Swap Blocks setting, which means that even if you toggle the Swap Blocks option, if the left block is set to be larger, the leftmost block will always be the larger one regardless of which one is being presented on the left.
Map and Text with the leftmost child larger.
Map and Text with the rightmost child larger.
The default setting makes each block evenly sized (50%). With either of the other two options selected, the sizes are based on the golden ratio, with the larger block set to 61.8% and the smaller block set to 38.2%.
Swap Blocks
The Swap Blocks setting is used to change the order of the blocks on desktop and not on mobile.
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.
Even if Swap Blocks is enabled, displaying your map on the righthand side on desktop, the map block will still appear above your content on mobile. This allows the content to describe the map after it is introduced as the user scrolls.
Map and Text block viewed on mobile.
The same blocks viewed on desktop.