Posts module

Author Box block

The post author’s avatar, name, biography, website and a link to all their posts — or any chosen author.

Overview

The Author Box introduces who wrote a post: their profile picture (Gravatar or avatar plugin), name, biography from their WordPress profile, website, and a link to all their posts. Place it in a single-post template to show each post’s author automatically, or pick a specific author.

At a glance

Block name: wpbb/author-box
Module: Posts
Find it by searching: Author Box
Loads JavaScript on the site: No

When and why to use it

Author bio at the end of articles.
Team or guest-author spotlights.

Example scenarios

Blog template: Post author, Side by side, Tint, “Written by”.

How to add the Author Box 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 Author Box in the search field. Brigade Blocks appear in the Brigade Blocks category and show the coral block icon.
Insert it. Click Author Box in the results. The block appears with a preview of the post author.
Configure the content. The name, picture and bio come from the author’s WordPress profile (Users → Profile: “Biographical Info” and “Website”). Use the Settings tab to choose what is shown.
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.

Settings panel: Author

Show

What it does: Whose details appear.
What to enter or choose: One of: Post author, Choose author.
Default: Post author
How to use it: Click one of the buttons in the group.
When to use it: Post author in templates; Choose author for a fixed spotlight.
Example: Post author.
Result: The preview updates.

AuthorShown when Show is Choose author

What it does: The author to show.
What to enter or choose: A user from the list (“— Select —”).
Default: 0
How to use it: Open the dropdown and pick an option.
When to use it: With Choose author.
Example: Your editor-in-chief.
Result: That person’s details.

Label

What it does: A small line above the name.
What to enter or choose: Short text, or empty to hide.
Default: Written by
How to use it: Type into the text field. Changes appear in the preview right away.
When to use it: Optional.
Example: “About the author”.
Result: Shown above the name.

Settings panel: Style

Layout

What it does: Avatar beside the text, or above it and centred.
What to enter or choose: One of: Side by side, Centered.
Default: Side by side
How to use it: Click one of the buttons in the group.
When to use it: Always optional.
Example: Centered in a sidebar.
Result: The layout changes.

Box

What it does: The box look.
What to enter or choose: One of: Tint, Card, Plain.
Default: Tint
How to use it: Click one of the buttons in the group.
When to use it: Always optional.
Example: Card.
Result: Background and border change.

Avatar size (px)

What it does: The picture size.
What to enter or choose: A number from 48 to 160 (px), in steps of 4.
Default: 88 px
How to use it: Drag the slider, or type a number in the box next to it.
When to use it: Always optional.
Example: 96.
Result: Loaded at double size for sharp high-resolution screens.

Biography

What it does: Shows the profile’s Biographical Info.
What to enter or choose: On or off.
Default: On
How to use it: Click the switch to turn it on (blue) or off.
When to use it: Usually.
Example: On.
Result: Empty bios are simply not shown.

Website link

What it does: Shows the profile’s website.
What to enter or choose: On or off.
Default: On
How to use it: Click the switch to turn it on (blue) or off.
When to use it: If authors have websites.
Example: On.
Result: A link to the website.

"All posts" link

What it does: Links to the author’s archive page.
What to enter or choose: On or off.
Default: On
How to use it: Click the switch to turn it on (blue) or off.
When to use it: Usually.
Example: On.
Result: A link to all their posts.

Link textShown when “All posts” link is on

What it does: The archive link text.
What to enter or choose: Text, or empty for “View all posts”.
Default: Empty
How to use it: Type into the text field. Changes appear in the preview right away.
When to use it: Optional.
Example: “More from Sam”.
Result: The link shows your text.

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 Author Box offers.

Element: Name selected first

The author name.

Styles-tab controls for “Name”
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

States: Normal only.

Element: Block

The box.

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
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: Avatar

The picture.

Styles-tab controls for “Avatar”
Panel	Control	Per device	Available in states
Border	Border type	—	Normal
	Border	—	Normal
	Radius	Yes	Normal
Box Shadow	Remove shadow	—	Normal
Box Shadow	Shadow layers	—	Normal
Sizing	Width	Yes	Normal
	Max width	Yes	Normal
	Height	Yes	Normal
	Min width / Min height / Max height	Yes	Normal

States: Normal only.

Element: Label

The small label.

Styles-tab controls for “Label”
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

States: Normal only.

Element: Bio

The biography.

Styles-tab controls for “Bio”
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

States: Normal only.

Element: Links

The links. Hover and Focus states.

Styles-tab controls for “Links”
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, Hover, Focus
Colors	Text	—	Normal, Hover, Focus

States for this part:

Hover — When the mouse pointer is over it. (Touch screens have no hover; they show the normal style.)
Focus — When it has keyboard focus — reached with the Tab key. Mouse clicks usually do not show focus styles.

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.

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

An <aside> with the author details. No JavaScript.

Limitations and notes

Nothing is shown for authors without any published posts (so user accounts are not exposed).
Profile details are edited in Users → Profile, not in the block.

Troubleshooting

The box is empty on the site.

The author has no published posts, or the block is outside a post (use “Choose author” there).