Site Management

Content Blocks

4 min read

> Reusable components for building rich, engaging pages.


Overview

Blocks are reusable content components that you add to pages and posts. They provide structured layouts for common content patterns like heroes, pricing tables, and testimonials.

TallCMS includes 17 built-in blocks organized into categories, plus 9 additional Pro blocks available with a TallCMS Pro license.


Adding Blocks

  1. Edit a page or post
  2. Click inside the content editor
  3. Click the + Add Block button (or type / to search)
  4. Select a block from the picker
  5. Fill in the block's fields in the modal
  6. Click Save to add the block

Block Picker

The block picker organizes blocks by category:

  • Content: Hero, Content, CTA, Features, Pricing, Divider
  • Media: Media Gallery, Document List, Parallax
  • Social Proof: Testimonials, Team, Logos, Stats
  • Dynamic: Posts, FAQ, Timeline
  • Forms: Contact Form
  • Pro: Accordion, Tabs, Table, Comparison, Before/After, Video, Counter, Code Snippet, Map

Use the search box to quickly find blocks by name or keyword.


Block Reference

Click any block for detailed documentation and live examples.

Content Blocks

BlockDescription
HeroFull-width section for page headers and landing pages
ContentRich text section with title and body
Call to ActionPromotional section to drive conversions
FeaturesGrid layout for product or service features
PricingPricing table with plan comparison
DividerVisual separator between sections

Media Blocks

BlockDescription
Media GalleryImage and video gallery with lightbox
Document ListDownloadable documents from collections
ParallaxFull-width section with parallax effect

Social Proof Blocks

BlockDescription
TestimonialsCustomer testimonials and reviews
TeamTeam member profiles
LogosClient or partner logo showcase
StatsKey metrics and statistics

Dynamic Blocks

BlockDescription
PostsDisplay blog posts from your site
FAQFrequently asked questions accordion
TimelineChronological events or milestones

Form Blocks

BlockDescription
Contact FormCustomizable contact form

Pro Blocks

Pro blocks require a TallCMS Pro license.

BlockDescription
AccordionCollapsible content sections for FAQs and lists
TabsTabbed content sections with rich text and icons
TableData tables with headers, highlighting, and styling
ComparisonSide-by-side feature comparison for plans or products
Before/AfterInteractive slider for image or text comparisons
VideoEmbed YouTube, Vimeo, or self-hosted videos
CounterAnimated number counters with scroll trigger
Code SnippetSyntax-highlighted code with copy button
MapInteractive maps from OpenStreetMap, Google, or Mapbox

Block Settings

Most blocks share common settings:

Content Width

Controls how wide the block content appears:

  • Inherit from Page: Uses the page's width setting
  • Narrow (672px): Focused reading
  • Standard (1152px): Default for most content
  • Wide (1280px): Image-heavy layouts
  • Full Width: Edge-to-edge

Background Options

Many blocks support background customization:

  • Solid colors (using theme palette)
  • Images with overlay
  • Gradient options

Alignment

Control text and content alignment:

  • Left, Center, Right
  • Some blocks have vertical alignment too

Tips for Using Blocks

Start with HeroMost pages benefit from a Hero block at the top to set the tone.

Alternate block typesVary your blocks to create visual interest. Don't stack multiple Content blocks without variety.

Use consistent stylingStick to 2-3 background colors throughout your site for a cohesive look.

Preview oftenUse the Preview button to see how blocks look on the frontend.


Common Pitfalls

"Block looks different in preview"Admin preview shows structure but may not match exact theme styling. Always check the frontend.

"Images are blurry"Upload high-resolution images. Most blocks work best with images at least 1200px wide.

"Block not saving"Ensure all required fields are filled. Required fields are marked with an asterisk.


Next Steps

Choose Theme