Block: Button

Button blocks are not semantically buttons, but links inside a styled div. 

If you do not add a link, a link tag without an anchor will be used.

Left aligned

Check to make sure that the text wraps correctly when the button has more than one line of text, and when it is extra long.

A centered button with
more than
one line of text

Buttons have three styles: 

Rounded
Outline
Square

If the theme has a custom color palette, test that background color and text color settings work correctly. 

Read more about the color palettes in the handbook.

Now lets test how buttons display together with large texts.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec mollis. Quisque convallis libero in sapien pharetra tincidunt. Aliquam elit ante, malesuada id, tempor eu, gravida id, odio.

Right aligned

Maecenas suscipit, risus et eleifend imperdiet, nisi orci ullamcorper massa, et adipiscing orci velit quis magna. Praesent sit amet ligula id orci venenatis auctor. Phasellus porttitor, metus non tincidunt dapibus, orci pede pretium neque, sit amet adipiscing ipsum lectus et libero. Aenean bibendum. Curabitur mattis quam id urna.

Left aligned

Vivamus dui. Donec nonummy lacinia lorem. Cras risus arcu, sodales ac, ultrices ac, mollis quis, justo. Sed a libero. Quisque risus erat, posuere at, tristique non, lacinia quis, eros.

Tags:

Leave A Comment

Fields (*) Mark are Required

Recent Posts

Recent Comments

Archives

Categories

Block Archives List

Block Archives Dropdown

Block Calendar

August 2025
M T W T F S S
 123
45678910
11121314151617
18192021222324
25262728293031

Block Categories List

Block Categories Dropdown

Block Latest Comments W/ Avatar

  1. Hi, this is a comment. To get started with moderating, editing, and deleting comments, please visit the Comments screen in…

Block Latest Comments W/O Avatar

  1. Hi, this is a comment. To get started with moderating, editing, and deleting comments, please visit the Comments screen in…

Block Latest Posts W/ Image

  • Hello world!
    by nextwpcook
    Welcome to WordPress. This is your first post. Edit or delete it, then start writing!
  • WP 6.1 Font size scale
    by Theme Reviewer
    This test post was generated using the block theme Emptytheme in WordPress 6.1.1. Small H2 Heading Medium H2 Heading Large H2 Heading Extra Large H2 Heading Small paragraph Medium paragraph Large paragraph Extra Large paragraph
  • WP 6.1 spacing presets
    by Theme Reviewer
    This test post was generated using the block theme Emptytheme in WordPress 6.1.1. On this page, some group blocks have border or background color set to increase visibility. This group has a no background color… Read more: WP 6.1 spacing presets

Block Latest Posts W/O Image

  • Hello world!
    by nextwpcook
    Welcome to WordPress. This is your first post. Edit or delete it, then start writing!
  • WP 6.1 Font size scale
    by Theme Reviewer
    This test post was generated using the block theme Emptytheme in WordPress 6.1.1. Small H2 Heading Medium H2 Heading Large H2 Heading Extra Large H2 Heading Small paragraph Medium paragraph Large paragraph Extra Large paragraph
  • WP 6.1 spacing presets
    by Theme Reviewer
    This test post was generated using the block theme Emptytheme in WordPress 6.1.1. On this page, some group blocks have border or background color set to increase visibility. This group has a no background color… Read more: WP 6.1 spacing presets

Block Login Link

Log in

Block Login Form

Block Page List

Block RSS

  • How to add typographic fonts to WordPress block themes
    by Matias
    The easy and compliant way that every theme developer should know.
  • Block Theme Building Tips
    by Ben Dwyer
    When building block themes there is often more than one way to achieve the same thing. It’s often not clear which of these options is preferable. Below I outline some tips and guidelines that I […]
  • Create A Blockbase Child Theme
    by Ben Dwyer
    We have been working on a plugin to help you create a Blockbase child theme. The idea is that you can use the existing tools to make changes to a Blockbase theme, and then export […]

Block Social Icons

Block Search Text Button Outside

Block Search Text Button Inside

Block Search No Button

Block Search Icon Button Outside

Block Search Icon Button Inside

Block Tag Cloud

alignment (3) captions (2) categories (2) chat (2) Codex (4) Columns (2) comments (4) content περιεχόμενο (12) content περιεχόμενο (10) css (7) edge case (8) embeds (5) excerpt (3) featured image (3) formatting (2) gallery (5) html (5) image (11) jetpack (2) layout (4) link (2) Love (1) markup (6) Post Formats (15) quote (2) readability (1) Sample (1) shortcode (5) standard (2) status (1) sticky (1) Success (1) Swagger (1) Tags (2) template (12) test tag (1) tiled (1) title (5) trackbacks (1) twitter (2) Unseen (1) video (3) videopress (1) WordPress (1) wordpress.tv (2)

Legacy Archives Dropdown

Legacy Calendar

August 2025
M T W T F S S
 123
45678910
11121314151617
18192021222324
25262728293031

Legacy Categories Dropdown

RSS Legacy RSS

  • How to add typographic fonts to WordPress block themes November 28, 2022
    The easy and compliant way that every theme developer should know.
    Matias
  • Block Theme Building Tips February 28, 2022
    When building block themes there is often more than one way to achieve the same thing. It’s often not clear which of these options is preferable. Below I outline some tips and guidelines that I find helpful. The guiding principle here is to remove as much complexity as possible from the theme; instead block themes […]
    Ben Dwyer
  • Create A Blockbase Child Theme November 17, 2021
    We have been working on a plugin to help you create a Blockbase child theme. The idea is that you can use the existing tools to make changes to a Blockbase theme, and then export a bundle of templates and theme.json as a new child theme. I tried to create a new theme called “Typewriter” […]
    Ben Dwyer

Legacy Text

Large image: Hand Coded

Large image: linked in a caption

This image is 960 by 720 pixels. :)

Meat!
Hamburger fatback andouille, ball tip bacon t-bone turkey tenderloin. Ball tip shank pig, t-bone turducken prosciutto ground round rump bacon pork chop short loin turkey. Pancetta ball tip salami, hamburger t-bone capicola turkey ham hock pork belly tri-tip. Biltong bresaola tail, shoulder sausage turkey cow pork chop fatback. Turkey pork pig bacon short loin meatloaf, chicken ham hock flank andouille tenderloin shank rump filet mignon. Shoulder frankfurter shankle pancetta. Jowl andouille short ribs swine venison, pork loin pork chop meatball jerky filet mignon shoulder tenderloin chicken pork.
Smile!
;) :) :-D
Select Element with long value


Copyright 2025 - All Rights Reserved By ThemeOri