Content module

Text Editor block

Rich text — paragraphs, lists, quotes, headings and images — in the Donix body style, with optional columns and a drop cap.

Overview

The Text Editor block is a styled area for running text. Inside it you use WordPress’s own Paragraph, List, Quote, Heading and Image blocks, and the Text Editor gives them the plugin’s typography, optional newspaper-style columns and an optional drop cap (a large first letter). Its Styles tab can style headings, quotes and lists inside it all at once.

At a glance

Block name: wpbb/text-editor
Module: Content
Find it by searching: Text Editor
Loads JavaScript on the site: No

When and why to use it

Longer passages of text in a consistent style.
Two- or three-column text for a magazine look.
Introductions with a large, elegant first letter.

Example scenarios

About page: three paragraphs at size “Lead” with a drop cap.
Terms: a long document with headings and lists, where the Styles tab sets the colour of all headings at once.

See it in action

These are live examples: real Text Editor blocks rendered by WordPress with the plugin’s own styles and scripts. Use the buttons to see how they adapt to tablet and phone screens.

Lead text with drop cap and two columns

Open in a new tab

How to add the Text Editor block

Open the editor. In your WordPress dashboard go to Pages (or Posts) and click the page you want to edit, or click Add New. For headers, footers and templates, use Appearance → Editor (block themes).
Add a new block. Click the blue + (Block Inserter) button in the top-left corner, or the small + that appears where you want the block. You can also type / on an empty line.
Search for the block. Type Text Editor in the search field. Brigade Blocks appear in the Brigade Blocks category and show the coral block icon.
Insert it. Click Text Editor in the results. The block appears with an empty paragraph saying “Start writing…”.
Configure the content. Edit the text directly on the block, then open the Settings tab (gear icon) in the right-hand sidebar for the options described below. If the sidebar is hidden, click the gear icon in the top-right corner.
Customise the design. Switch to the Styles tab (half-filled circle icon) to change colours, spacing, borders and more — see Design & styling.
Save or publish. Click Save draft to keep working later, Preview to check it, or Publish / Update to make it live.

Content settings

You set up this block in two places: on the block itself in the editor, and in the Settings tab (gear icon) of the sidebar on the right. Every option is listed below, with its default value.

On the block (in the editor canvas)

Text content

What it does: The text itself, written with WordPress’s Paragraph, List, Quote, Heading and Image blocks inside the Text Editor.
What to enter or choose: Any text. Press Enter for a new paragraph; type / to add a list, quote, heading or image.
How to use it: Click inside the block and type. Use the + or / to add a list, quote, heading or image.
When to use it: Always.
Example: A paragraph, a bulleted list and a quote.
Result: The content uses the Text Editor’s typography.
Good to know: Other block types cannot be placed inside a Text Editor. If it is empty, nothing is shown on the site.

Settings panel: Text

Size

What it does: The base text size.
What to enter or choose: One of: Body, Lead.
Default: Body
How to use it: Click one of the buttons in the group.
When to use it: Lead (a larger size) for introductions and short passages; Body for everything else.
Example: Lead for the first paragraph block of an article.
Result: All text inside becomes larger or returns to normal.

Columns

What it does: Splits the text into 1, 2 or 3 newspaper-style columns.
What to enter or choose: A number from 1 to 3.
Default: 1
How to use it: Drag the slider, or type a number in the box next to it.
When to use it: For short-to-medium passages on wide layouts. Avoid for long texts: readers would scroll up and down.
Example: 2 columns for a company history section.
Result: Text flows from one column to the next.
Good to know: Columns collapse to one on small screens.

Drop cap

What it does: Makes the first letter of the first paragraph large, spanning several lines.
What to enter or choose: On or off.
Default: Off
How to use it: Click the switch to turn it on (blue) or off.
When to use it: For editorial, magazine-style introductions.
Example: On for the opening of a feature story.
Result: The first letter becomes a large coloured initial.

Design & styling

Select the block, open the Styles tab in the settings sidebar (the half-filled circle icon next to the gear) and use the three pickers at the top of the Style panel:

Element — which part of the block to style.
State — Normal, or a state such as Hover (only the states the part supports are offered).
Device — Desktop, Tablet or Mobile, for values that can differ per screen size.

Only panels that make sense for the chosen part and state are shown. The full meaning of every control is in the Styling Controls guide; below is exactly what Text Editor offers.

Element: Block

All the text in the block, including link colours.

Styles-tab controls for “Block”
Panel	Control	Per device	Available in states
Typography	Font family	—	Normal
	Font size	Yes	Normal
	Weight	—	Normal
	Style	—	Normal
	Line height	Yes	Normal
	Letter spacing	Yes	Normal
	Letter case	—	Normal
	Alignment	Yes	Normal
	Decoration	—	Normal
Colors	Text	—	Normal
	Link	—	Normal
	Link hover	—	Normal
Background	Type	—	Normal
	Color / Gradient	—	Normal
	Image	—	Normal
Border	Border type	—	Normal
	Border	—	Normal
	Radius	Yes	Normal
Box Shadow	Remove shadow	—	Normal
Box Shadow	Shadow layers	—	Normal
Spacing	Margin	Yes	Normal
Spacing	Padding	Yes	Normal
Sizing	Width	Yes	Normal
	Max width	Yes	Normal
	Height	Yes	Normal
	Min width / Min height / Max height	Yes	Normal
	Block alignment	Yes	Normal
Position	Position	Yes	Normal
	Top / Right / Bottom / Left	Yes	Normal
	Z-index	Yes	Normal
	Overflow	Yes	Normal
Transform	Move X / Move Y	—	Normal
	Scale X / Scale Y	—	Normal
	Rotate (°), Rotate X (°), Rotate Y (°)	—	Normal
	Skew X (°) / Skew Y (°)	—	Normal
Effects	Opacity (%)	Yes	Normal
	State transition (ms)	—	Normal
	Timing	—	Normal
Visibility	Show on Desktop / Tablet / Mobile	—	Normal

States: Normal only.

Element: Headings

Every heading (H1–H6) inside the Text Editor at once.

Styles-tab controls for “Headings”
Panel	Control	Per device	Available in states
Typography	Font family	—	Normal
	Font size	Yes	Normal
	Weight	—	Normal
	Style	—	Normal
	Line height	Yes	Normal
	Letter spacing	Yes	Normal
	Letter case	—	Normal
	Alignment	Yes	Normal
	Decoration	—	Normal
Colors	Text	—	Normal
Spacing	Margin	Yes	Normal

States: Normal only.

Element: Quotes

Every quote inside — box, background and text.

Styles-tab controls for “Quotes”
Panel	Control	Per device	Available in states
Typography	Font family	—	Normal
	Font size	Yes	Normal
	Weight	—	Normal
	Style	—	Normal
	Line height	Yes	Normal
	Letter spacing	Yes	Normal
	Letter case	—	Normal
	Alignment	Yes	Normal
	Decoration	—	Normal
Colors	Text	—	Normal
Background	Type	—	Normal
	Color / Gradient	—	Normal
	Image	—	Normal
Border	Border type	—	Normal
	Border	—	Normal
	Radius	Yes	Normal
Box Shadow	Remove shadow	—	Normal
Box Shadow	Shadow layers	—	Normal
Spacing	Margin	Yes	Normal
Spacing	Padding	Yes	Normal
Sizing	Width	Yes	Normal
	Max width	Yes	Normal
	Height	Yes	Normal
	Min width / Min height / Max height	Yes	Normal
Effects	Opacity (%)	Yes	Normal

States: Normal only.

Element: Lists

Every bulleted and numbered list inside.

Styles-tab controls for “Lists”
Panel	Control	Per device	Available in states
Typography	Font family	—	Normal
	Font size	Yes	Normal
	Weight	—	Normal
	Style	—	Normal
	Line height	Yes	Normal
	Letter spacing	Yes	Normal
	Letter case	—	Normal
	Alignment	Yes	Normal
	Decoration	—	Normal
Colors	Text	—	Normal
Spacing	Margin	Yes	Normal
Spacing	Padding	Yes	Normal

States: Normal only.

Responsive settings

Brigade Blocks uses three screen sizes: Desktop (wider than 1023px), Tablet (600–1023px) and Mobile (599px and narrower). Tablet and Mobile values are optional: when empty, the value of the next larger screen is used.

Multi-column text automatically becomes a single column on small screens.

In the Styles tab, pick the Device first; these controls can then have a different value for that screen size: Font size, Line height, Letter spacing, Alignment, Radius, Margin, Padding, Width, Max width, Height, Min width / Min height / Max height, Block alignment, Position, Top / Right / Bottom / Left, Z-index, Overflow, Opacity (%).

The Visibility panel (Styles tab, Normal state) can hide the block entirely on Desktop, Tablet or Mobile.

Advanced options

HTML anchor (Advanced section of the Settings tab) — a unique name such as pricing, so you can link straight to this block with #pricing at the end of the page address (for example from a menu).
Additional CSS class(es) (Advanced section) — for custom CSS from your theme or the Site Editor. Separate several classes with spaces.
Custom attributes (Advanced section) — add data-*, title, aria-label, aria-describedby, lang or dir attributes. See Custom attributes.
State transition (Styles tab → Effects, Normal state) — how smoothly hover and focus styles animate.

How it works on your site

The paragraphs, lists and quotes you wrote, inside one wrapper with the plugin’s typography. No JavaScript.

Accessibility

Headings inside should continue the page’s heading order.
Give images inside alternative text in the Image block’s settings.

Tips and best practices

Keep lines at a comfortable length: use a Container with a max width (around 720px) around long text.

Limitations and notes

Only Paragraph, List, Quote, Heading and Image blocks are allowed inside.