The [container] shortcode is helpful when creating your own custom layouts or stacking various shortcodes together. For instance, if you’re using the blank page template to create your homepage, you might want to use the [content_band] shortcodes to create a visually rich look as you go down the page. To do so, you would need to use your [content_band] shortcode first, followed by a [container] shortcode, and then finally your content. The result would be something like the following:

Check it out, I’m being contained both vertically and horizontally!

The great thing about the [container] shortcode is that the measurements it uses are completely fluid and built upon what you provide as your site measurements in the Customizer. It’s a very simple, yet exceptionally powerful feature to have at your disposal when you need it.

Code

[content_band bg_color="#ffba00" border="all"] [container] [custom_headline style="margin: 0;" type="center" level="h4" looks_like="h3" accent="true"]Check it out, I'm being contained both vertically and horizontally![/custom_headline] [/container] [/content_band]

Options

  • id: add a unique ID to the shortcode.
  • class: add a class or multiple classes to the shortcode.
  • style: add inline styles to the shortcode.