A Guide to WordPress Block Types: Text, Media, and Widgets
Introduction
The block editor Gutenberg was introduced to WordPress on December 7, 2018, alongside the default theme Twenty Nineteen. Quite some time has passed since then, and I’ve gradually become more comfortable using blocks. That said, the ones I regularly use are still the basics—Paragraph, Heading, Image, Gallery, Columns, Spacer, and Custom HTML.
Recently, while reviewing block types for a client of our website creation service, I thought it would be a great opportunity to organize and share that information here on our blog as well.
Depending on the plugins you install, the number and types of blocks available in WordPress can vary significantly. In this article, however, I’ll focus on the most commonly used blocks that come with WordPress by default—specifically, blocks in the Text, Media, Design, and Widgets categories.
(Please note: the icons are displayed at 10x their original size.)
Table of Contents
Widgets
Paragraph
The Paragraph block is the basic block for entering text.
Features
- Allows regular text input
- Supports text color, background color, and font size adjustments
- Press Enter for a new paragraph, and Shift + Enter for a line break within a paragraph
Usage Tips
- Bold important keywords to help readers identify key points
- Keep paragraphs short (2–3 sentences) to improve readability
Heading
The Heading block helps structure an article or page, improving readability.
Features
- Offers six heading levels (H1 to H6)
- H1 is typically used for page titles; H2–H6 are used in the body content
- Well-placed headings help readers quickly grasp the content
Usage Tips
- Proper heading use improves SEO and clarifies content structure
- Use H2 for main headings, H3 for subheadings, and H4 for smaller sections
List
The List block organizes information into bullet points or numbered steps.
Features
- Bulleted list (•): Ideal for simple lists
- Numbered list (1, 2, 3): Useful for step-by-step instructions or rankings
Usage Tips
- Use indentation (nested lists) for clarity when descriptions are long
- Keep list items short, adding breaks or explanations as needed
Quote
The Quote block highlights text from other sources.
Features
- Visually distinct formatting for emphasis
- Option to add a source (e.g., “— Source: XYZ”)
- Can be used to emphasize key messages within an article
Usage Tips
- Use for impactful phrases to make them stand out
- Always credit the source when quoting external material
Code
The Code block displays programming code or scripts in their original format.
Features
- Supports HTML, CSS, JavaScript, PHP, etc.
- Preserves formatting, including spaces and line breaks
- Unlike text editors, it displays code without executing it
Usage Tips
- Use syntax highlighter plugins (e.g., SyntaxHighlighter) for better readability
- Pair with
<pre>tags to enhance visibility
Details
The Details block creates expandable/collapsible content sections.
Features
- Ideal for FAQs and hidden content
- Helps keep the page clean by reducing clutter
Usage Tips
- Use short, clear titles that expand to reveal more details
- Great for organizing long text sections
Preformatted
The Preformatted block retains spacing, line breaks, and text alignment exactly as entered.
Features
- Maintains original spaces and line breaks
- Uses a monospaced font for better alignment
- Less affected by browser styles compared to the Paragraph block
Usage Tips
- Suitable for source code, command-line text, or formatted text
- Avoid using it for standard paragraphs
Pullquote
A Pullquote block visually highlights a quote within the content.
Features
- Bold and decorative styling for emphasis
- Enhances readability of key messages
Usage Tips
- Adjust alignment (center or left) based on text length
- Use to highlight powerful statements or key points
Table
The Table block organizes data into rows and columns.
Features
- Allows adding/removing rows and columns
- Supports text alignment (left, center, right)
- Simple table formatting for structured data
Usage Tips
- Use custom CSS for advanced styling
- Great for product comparisons, pricing tables, and data lists
Verse
The Verse block is used for poetry, lyrics, and special text formats.
Features
- Retains line breaks and spaces as entered
- Uses proportional fonts (unlike Preformatted text)
- Ideal for poems, haiku, song lyrics, and dialogues
Usage Tips
- Best for rhythm-based or visually structured text
- Not recommended for regular paragraphs
Classic
The Classic block provides the old Classic Editor interface within the new WordPress editor.
Features
- Allows text input in the traditional UI
- Supports “Visual” and “Text (HTML)” editing modes
- No need for the Classic Editor plugin
Usage Tips
- Useful for users familiar with the old editor
- Helps edit legacy content created in the Classic Editor
- Ideal for fine-tuning HTML and CSS
Image
The Image block inserts images into posts or pages.
Features
- Add images via upload, media library, or URL
- Supports alignment (left, center, right)
- Allows captions for additional context
Usage Tips
- Choose images relevant to the content
- Optimize image size for fast loading
Gallery
The Gallery block displays multiple images in a structured layout.
Features
- Customizable columns for evenly spaced images
- Supports cropping for a consistent look
Usage Tips
- Mix images with different angles for variety
- Useful for travel blogs, portfolios, or product showcases
Audio
The Audio block embeds sound files such as MP3, WAV, and OGG.
Features
- Supports uploads and external sources (e.g., SoundCloud)
- Includes a built-in player with play/pause buttons
- Offers loop, volume, and autoplay options
Usage Tips
- Ideal for podcasts or audio guides
- Avoid autoplay unless necessary to enhance user experience
Cover
The Cover block overlays text or buttons on a background image or video.
Features
- Allows image or video backgrounds
- Supports text overlays for emphasis
- Includes an opacity layer for better readability
Usage Tips
- Use for attention-grabbing headers or hero sections
- Adjust color overlays to ensure text visibility
File
The File block uploads and shares PDF, Word, Excel, and other documents.
Features
- Creates downloadable file links
- Option to open in a new tab
- PDFs can be previewed in browsers
Usage Tips
- Use for distributing brochures, manuals, or reports
- Give files clear names for easy identification
- Apply password protection for private documents
Media & Text
The Media & Text block places images/videos alongside text.
Features
- Supports side-by-side layouts
- Enhances design flexibility
- Mobile-responsive for optimized viewing
Usage Tips
- Great for product descriptions or service showcases
- Make images clickable for more details
Video
The Video block embeds YouTube, Vimeo, or uploaded videos.
Features
- Supports direct uploads or URL-based embeds
- Allows setting start times
- Reduces server load by using external services
Usage Tips
- Set an attractive thumbnail to increase engagement
- Use YouTube or Vimeo to avoid heavy file sizes
Button
The Button block creates a clickable call-to-action (CTA) button.
Features
- Customizable color, shape, and size
- Allows linking to external pages or internal content
- Text inside the button is fully editable
Usage Tips
- More noticeable than text links
- Best for purchases, inquiries, or downloads
- Maintain consistent button styling for branding
Columns
The Columns block allows you to create multiple columns to organize content.
Features
- Supports up to 6 columns
- Each column can contain different blocks
Usage Tips
- Use 2- or 3-column layouts to structure information and improve readability
- Ideal for designs that balance images and text
Group
The Group block lets you group multiple blocks together and treat them as a single unit.
Features
- Allows background color and spacing adjustments
- Enables consistent styling across grouped elements
Usage Tips
- Use to maintain a cohesive design layout
Row
The Row block arranges multiple elements horizontally, enhancing layout flexibility and visual organization.
Features
- Arrange text, buttons, images, and other elements side by side
- Adjustable alignment (left, center, right, or evenly spaced)
- Customizable width and spacing
Usage Tips
- Great for arranging buttons like “Learn More” and “Contact Us” side by side
- Useful for aligning text with icons when describing features
- Ensure responsive behavior—elements may stack vertically on mobile devices
Stack
The Stack block arranges multiple elements in a vertical sequence, helping create an intuitive layout.
Features
- Organizes content in a clean, readable format
- Allows easy text size and spacing adjustments for improved readability
- Optimized for mobile and tablet displays
Usage Tips
- Structure headings and paragraphs for better readability
- Combine images and descriptions in a clear layout
- Use spacers to fine-tune spacing for a clean design
Grid
The Grid block helps organize content into evenly spaced sections, making it ideal for structured layouts.
Features
- Aligns content in a grid layout
- Customizable number of columns (2, 3, 4, etc.)
- Ensures uniform sizing for a neat appearance
- Responsive design—automatically converts to a single-column view on mobile
Usage Tips
- Perfect for displaying service lists or product galleries
- Helps organize information using card-style layouts
- Maintain equal spacing for a clean and professional look
More
The More block separates the introduction from the main content, displaying a “Read More” link on blog archive pages.
Features
- Adds a “Read More” link on post archive pages
- Displays only an excerpt of the post, directing readers to the full article
- Increases engagement and click-through rates
Usage Tips
- Craft an engaging introduction to encourage clicks
- Use for long-form articles to keep archive pages tidy
- Ensure the break occurs at a logical point to maintain readability
Page Break
The Page Break block divides a long article into multiple pages for easier reading.
Features
- Splits content into multiple pages
- Automatically adds pagination links (“1, 2, 3…”) at the bottom
- Improves readability for lengthy articles
Usage Tips
- Use for lengthy content to prevent reader fatigue
- Helpful for increasing page views, especially for ad-based revenue models
- Check theme compatibility to ensure proper pagination display
Separator
The Separator block adds a visual divider to structure content.
Features
- Inserts a horizontal line to separate sections
- Simple design for a clean layout
- Some themes allow color and style customization
Usage Tips
- Use to visually separate different content sections
- Helps prevent long blocks of text from becoming overwhelming
- Avoid overuse to maintain clarity and readability
Spacer
The Spacer block adjusts white space between content elements for better layout balance.
Features
- Allows custom height adjustment to create spacing
- Enhances readability and design organization
- Helps achieve a visually balanced page
Usage Tips
- Use to avoid overcrowding by adding appropriate spacing
- Avoid excessive use to prevent unnecessary scrolling
- Adjust gaps between images and text for a polished design
Archives
The Archives block lists past posts by month, making it easier to browse older content.
Features
- Automatically organizes posts by publication month
- Can be displayed as a list or dropdown
- Helps users find older content easily
Usage Tips
- Useful for blogs with many posts
- Save space by using the dropdown option
- Display post counts to show activity levels for each month
Calendar
The Calendar block visually displays post dates, allowing users to navigate based on publication days.
Features
- Shows published posts in a calendar format
- Clicking a date links to posts from that day
- Highlights posting frequency
Usage Tips
- Helps visitors find older posts by date
- Useful for showcasing a consistent posting schedule
- Best placed in sidebars or footers for easy access
Term List
The Term List block displays categories or tags in a list format.
Features
- Lists post categories or tags for easy navigation
- Helps users find content by topic
- Customizable sorting options
Usage Tips
- Organize blog posts into categories for easier discovery
- Unlike tag clouds, this provides a structured list view
- Best placed in sidebars or footers for accessibility
Categories
The Categories block displays a list of post categories in either list or dropdown format.
Features
- Supports hierarchical category display
- Dropdown format saves space
- Helps users navigate site content efficiently
Usage Tips
- Helps visitors find posts by category
- Enabling post count display makes content quantity clear
- Best suited for sidebars or footers
Custom HTML
The Custom HTML block allows you to insert and customize content using HTML, CSS, or JavaScript.
Features
- Supports custom HTML, CSS, and JavaScript
- Enables embedding external content and widgets
- Provides complete design flexibility
Usage Tips
- Ideal for custom widgets or interactive elements
- Useful for embedding social media feeds or Google Maps
- Ensure proper testing when using JavaScript
Latest Comments
The Latest Comments block displays recent user comments.
Features
- Automatically updates with new comments
- Shows commenter names and avatars
- Adjustable number of displayed comments
Usage Tips
- Encourages community engagement
- Best placed in sidebars or footers for easy visibility
Latest Posts
The Latest Posts block lists recent blog entries.
Features
- Automatically updates with new posts
- Displays titles, excerpts, or thumbnails
- Can include publication dates
Usage Tips
- Helps visitors quickly find new content
- Only supports blog posts (not pages)
- Ideal for homepages or sidebars
Page List
The Page List block generates a list of all fixed pages on the site.
Features
- Automatically lists all static pages
- Displays pages in a hierarchical structure
- Unlike menus, it includes all pages
Usage Tips
- Useful for sites with multiple pages
- Helps organize page hierarchy
- Best placed in sidebars or footers
RSS
The RSS block fetches and displays content from external websites via RSS feeds.
Features
- Automatically retrieves updates from external sources
- Can display post titles, excerpts, and dates
- No manual updates required
Usage Tips
- Ideal for showcasing external blog or news updates
- Can be used to pull content from related sites
- Simply input the RSS feed URL for setup
Search
The Search block adds a search bar to help visitors find content.
Features
- Allows keyword-based site searches
- Customizable placeholder text and button label
- Improves site navigation
Usage Tips
- Essential for large blogs or content-heavy sites
- Best placed in headers, sidebars, or footers
- Helps users quickly locate relevant information
Shortcode
The Shortcode block lets you easily insert WordPress shortcodes into your content.
Features
- Add specific features simply by entering text in the
[shortcode]format - Call custom functionalities provided by plugins or themes
- Handle code that doesn’t work in regular text blocks
Usage Tips
- Great for inserting plugin-based features like reservation forms, galleries, and sliders
- Depending on the shortcode, the result may not appear in the preview and will only be visible after publishing
Social Icons
The Social Icons block allows you to display icons that link to your social media profiles such as Facebook, X (formerly Twitter), and Instagram.
Features
- Add icons for major social media platforms
- Direct visitors to your social media by setting URLs for each icon
- Customize the icon style and size to match your site
Usage Tips
- On corporate websites, adding links to official social media accounts can help grow your following
- On blogs, it’s also useful for introducing the author’s personal accounts
- Set links to open in a new tab to keep users from leaving your site
Tag Cloud
The Tag Cloud block displays a list of tags used across your site.
Features
- Shows tags in a visually engaging way, with more frequently used tags appearing larger
- Helps visitors easily discover popular topics, especially on content-rich sites
- Clicking a tag leads to a list of posts associated with that tag
Usage Tips
- As your content grows, using tags alongside categories allows for more detailed organization
- Especially effective on blog-style websites, giving users a quick overview of trending topics
- Best placed in the sidebar or footer for easy access to relevant content
About AEDI
We are AEDI Inc., a web and design company based in Kurashiki City, Okayama Prefecture, Japan.
Our services range from fully custom-built websites and WordPress development to multilingual and single-page sites—tailored to meet a wide variety of client needs.
We also offer a cost-effective website creation service called SimpleTastes, which combines essential functionality with high-quality design at an affordable price. This makes it easy for businesses to maintain a strong online presence without overspending.
While we are based in Okayama, we proudly serve clients across Japan. If you’re considering building a new website or redesigning your existing one, feel free to reach out to us anytime.
Related Articles
Operate a Cost-Effective, High-Quality Website with Essential Features
Recently, AEDI launched SimpleTastes, a website creation service that combines affordability, high quality, and essential functionality as a sub-brand of AEDI.
As a Web and Graphic Design Company in Kurashiki, Okayama - 2025 Part 1
This may sound simple, but our theme for this year is “Energy.” As a web and design company, we could have chosen a cooler or more sophisticated term. However, this year, we’ve decided to focus on this straightforward word.
Launch of SimpleTastes Website Creation Service – ST Base
We are excited to announce the launch of the demo website for ST Base, a versatile website development service under AEDI’s sub-brand, SimpleTastes, which is designed to offer affordability, high quality, and essential features.
