Text blocks

Text blocks are intended to build header areas for sections. You can catch attention with these or just say a one liner.

Attribute(s)
  • title: set the title of the block.
  • title_tag: set the title tag of the block. (values: h1, h2, h3, h4, h5)
  • title_color: set the title color of the block.
  • bg_color: set the background color of the block.
  • bg_image: set the background image of the block.
  • text_color: set the text color within the block.
  • sep_padding: set the padding of the separator.
  • sep_color: set the color of the separator.
  • padding_top: set the top padding of the block.
  • padding_bottom: set the bottom padding of the block.
Demo

Black on white

Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.

[text_block bg_color="#fff" title_color="#1c1c1e" text_color="#9c9d9f" sep_color="#1c1c1e" title="Black on white"]Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.[/text_block]

White on black

Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.

[text_block bg_color="#1c1c1e" title_color="#fff" text_color="#9c9d9f" sep_color="#fff" title="White on black"]Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.[/text_block]

Background image

Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.

[text_block bg_color="#fff" title_color="#fff" text_color="#fff" sep_color="#fff" padding_top="10%" padding_bottom="10%" title="Background image" bg_image="path/to/image"]Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.[/text_block]

Custom Padding

Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.

[text_block title_color="#fff" text_color="#9c9d9f" sep_color="#9c9d9f" padding_top="20%" padding_bottom="20%" title="Custom Padding" bg_image="path/to/image"]Fusce blandit adipiscing libero, nec bibendum diam volutpat tempor. Donec fermentum diam leo, ut convallis nisl tristique ut. Ut rhoncus leo vitae tempus pulvinar.[/text_block]