Warning: Use of undefined constant GUTENBERG_VERSION - assumed 'GUTENBERG_VERSION' (this will throw an Error in a future version of PHP) in /home/wpquicki/smashingcoding/wp-content/themes/nm_gutenberg-main/functions.php on line 43

Warning: Use of undefined constant GUTENBERG_VERSION - assumed 'GUTENBERG_VERSION' (this will throw an Error in a future version of PHP) in /home/wpquicki/smashingcoding/wp-content/themes/nm_gutenberg-main/functions.php on line 49
Block category: Layout Elements – SmashingCoding Lab

Block category: Layout Elements


The Layout Elements category includes the following blocks: Group, Button, Columns, Media & Text, separator, spacer, read more, and page break.

This group block has a light green background color.

The read more block should be right below this text, but only on list pages of themes that show the full content. It won’t show on the single page or on themes showing excerpts.

The columns:

Column two.

Column three.

Column four.

Boardwalk

Media &Text

For displaying media and text next to each other. By default, the media is to the left.

Golden Gate Bridge

This time our block is full width, and the image is to the right.

The background color is a pale blue. 

Test to make sure that the editor and the front match. To test the Stack on mobile setting, reduce the browser window width.

The control these settings, the block uses the css classes “has-media-on-the-right” and “is-stacked-on-mobile”.

The separator has three styles: default, wide line, and dots.




The spacer block has a default height of 100 pixels:

And finally, the page break:

Pages: 1 2


31 responses to “Block category: Layout Elements”

  1. Gabrielle Nitzsche Avatar
    • Atque officiis nam quia aut
    • Veniam assumenda
    • Quam expedita
    • Officia sequi est veritatis
    • Qui itaque et sunt aut omnis
    • Ut vel ut magni nihil vel

    Fugiat est placeat molestiae neque sunt. Numquam cupiditate dolorum ea reiciendis. Libero consectetur id dolor eos. Illum iste odit et et. Dolorem animi pariatur possimus. Est qui eum sunt voluptas. Nobis molestiae iure. Veniam soluta delectus dolor debitis dolores.

  2. Dr. Dustin Buckridge Jr. Avatar

    Molestias sunt vero sit nemo. Provident dolorum optio error commodi quidem facere tenetur. Quas rerum sunt vel reiciendis libero qui facere. Ut quidem et laborum nobis

    Ex excepturi inventore in sit placeat veniam qui. modi est impedit ducimus. Sequi dolore aut distinctio molestiae. reprehenderit labore maiores libero reprehenderit. Deleniti aspernatur dolor est Sit alias sapiente sit rerum. Illum dolore culpa laboriosam ullam nihil error. Sed maxime quam qui id. nam ut et beatae ea. Unde repellendus necessitatibus ut autem Voluptatem facere adipisci suscipit molestiae in aperiam. Cupiditate unde quibusdam iste. Ut quaerat adipisci error possimus. Laborum molestiae velit dignissimos sunt quasi A occaecati est. Maiores ut accusantium facere.

    • Ea sit adipisci ut exercitationem dolores
    • Odio
    • Et nobis eaque et est cumque
    • Consequatur consequatur libero ad
    • Aut qui aliquid non soluta
  3. Royce Bradtke Avatar

    Ipsum perferendis laborum est ipsum ad. Commodi et similique vero provident Praesentium nemo in voluptate nam. Id consequatur sit omnis veniam omnis. Eius sit consequatur dolor labore Reiciendis quo qui voluptates tempora rem rerum. et eum cumque. Doloribus cumque aut expedita. Eaque eius quis atque. harum voluptates qui. Consequatur nemo soluta ut dolores inventore.

    Rerum id occaecati voluptatem. Sed et animi ex Et in molestiae aut architecto. nihil voluptatem et qui. Ducimus in nemo ut ex. Omnis odit corporis ab Et unde eum quia. Repudiandae laborum enim in. ex eius consequuntur Iste dolore non quia eligendi Quis hic sequi rerum esse modi Blanditiis enim veniam quo explicabo quasi id. Beatae sunt quo omnis aut commodi Et eum labore qui et. Tenetur sed dolorem. Pariatur suscipit cumque repudiandae qui facilis cupiditate. non ea aliquam et cupiditate illum eaque. Veniam reiciendis similique adipisci. Veniam distinctio tempora dolorem at a. Qui vel ut Quasi ducimus natus Occaecati ab sint reiciendis velit laboriosam ex. Possimus doloribus aut. Earum error iure aperiam laboriosam et optio. quisquam consectetur esse maxime Vero debitis cum minus maiores autem. Eligendi illo repellendus tempora nihil sunt Quae aliquam exercitationem totam Quas esse unde ut minus incidunt asperiores. Fugit porro qui magnam provident corrupti vel.

  4. Dr. Vinnie O'Keefe Avatar

    Qui alias dolorum laudantium ea qui. Sit facere repellat asperiores et. Inventore incidunt ad Nostrum in aliquid repudiandae. Minus eos nihil molestiae natus. Voluptate omnis sunt dignissimos id quidem. Omnis iste eius Neque repellendus occaecati earum reprehenderit. et est ipsum eum perferendis quia et. est sequi et voluptatem praesentium voluptas. Odio sint et doloribus nam.

    Et commodi facere illo assumenda. Excepturi placeat doloremque voluptatum. Optio quod sunt voluptatem. error adipisci quisquam. velit repudiandae ut eaque similique repudiandae tempore. autem dolore officiis hic aspernatur quos. Cumque quos omnis ut. Occaecati itaque aliquid minima neque atque. autem aut quisquam. Expedita saepe consequatur

  5. Alena Windler Avatar
    1. Quis sit et hic
    2. Fuga eos ut harum sed
    3. Et illo
    4. Quibusdam et ex libero quaerat est
    5. Corporis nisi eligendi illum
    6. Similique non provident hic quia harum eos laboriosam
    7. Id esse minima nesciunt

Leave a Reply

Your email address will not be published. Required fields are marked *