Note: For these tests, the parent query loop is full width. “Inner blocks use content width” on the query loop is turned off, which is the default value.
Inner blocks use content width: Off
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Inner blocks use content width: On
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Grid, 3 columns
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Justification
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Custom width 200px, custom wide width 400px
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Color
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Block spacing
Block spacing preset: 0
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Block spacing preset: 4
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Block spacing preset: 7
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Typography
Font size
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Appearance
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Line height
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Letter spacing
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Decoration
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Latest Comments
Hide avatar Hide avatar and display date Hide avatar, date and excerpt Alignment Note: there is a spacer block above to clear the alignment. Typography Font size Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Custom HTML
Hello World
Categories list
Alignment Note: there is a spacer block above to clear the alignment. Typography Appearance Line height Letter spacing Decoration Letter case
Note: A separator have been added between each query loop.
Title & date variation
Site Logo
Navigation
Title & excerpt variation
Page break
Content before the page break.
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
Title, date & excerpt variation
Author Name
With link to archive: Color Alignment Typography Font sizes Appearance Line height Letter spacing Decoration Letter case
Author
With byline: Hide avatar: Show bio: Link to author page: Avatar sizes: Color Duotone Alignment (Text alignment) Typography Font sizes Appearance Line height Letter spacing Decoration Letter case Padding and margin Padding preset: 4 Margin preset: 4
Image, date, and title variation
Hello world!
Workers Go Go!
Post type: page
Filter: “Design” category
Offset: 1
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
Stack
Note: For other block settings like typography and background image, see the group block. Alignment Align none. A second paragraph inside a stack. Wide. A second paragraph inside a stack. Full width. A second paragraph inside a stack. Vertical alignment Note: Background color and min height has been added for visibility. Align top. A second…
Pagination without reload
Page break
Content before the page break.
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
Alignment
Page break
Content before the page break.
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
Page break
Content before the page break.
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
Page break
Content before the page break.
More
Content before the more block. On an archive page, only these two paragraphs should be visible.
