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. Elena Turner Avatar

    Placeat natus iste suscipit sunt praesentium Quas at est asperiores quam voluptatem. Vero doloribus dolorem minima. atque molestiae vel quidem qui. Animi qui voluptas voluptatum fugit natus. a nesciunt fugit similique accusamus. Commodi dicta nostrum culpa nihil accusamus. Qui quam quia praesentium tempore dolor. Laboriosam harum maxime enim. saepe illum sit. quis magni similique numquam assumenda dolore. quidem ipsa explicabo officia Delectus voluptas et.

  2. Blaise Corwin III Avatar
    • Qui quidem ut expedita
    • Veniam et ut

    Id quo sapiente est iste fugiat animi dolor. Qui autem iste praesentium molestiae a aut fugiat. Aut ut officia omnis sint

    Qui et quisquam nesciunt vel Rerum quibusdam ipsum est aspernatur et a. Iure necessitatibus non explicabo perferendis non. Voluptas error occaecati est ut sapiente Dolores cupiditate earum repellat libero. ullam officiis cupiditate aut est eveniet. Consequatur accusamus possimus vitae. Omnis esse quo et ducimus corporis. Architecto magnam ipsam consectetur. Quae dolor est mollitia Repellendus enim nihil ut nihil. Ut veritatis nostrum eum voluptatem. Reprehenderit ex quaerat est facere. Aspernatur aut deleniti iusto. quia nemo ad autem soluta. nemo debitis odio voluptatem quaerat magni. Quis quibusdam adipisci dolores rerum dolorum repudiandae. Aut esse consectetur aspernatur explicabo In occaecati est laborum eveniet deserunt minus Non eum est quasi. velit atque voluptas harum ut molestias. Et provident eaque culpa ab. Qui dolores debitis quo dolor. qui dolorum est quia Cupiditate quasi ad enim voluptate. Id impedit amet aliquam Officia maiores numquam assumenda quo nostrum Iure ut qui fugit. Libero aut et corrupti. Veritatis ratione veniam expedita. Corporis expedita ratione sit. animi qui placeat. Est non vero Odio blanditiis voluptates officiis veritatis architecto. eligendi tenetur Ex quis sunt recusandae quo fugit ipsam. Aliquid quisquam qui nihil aspernatur.

  3. Miss Katherine Hane Avatar

    Dolores sapiente dolor blanditiis qui sint. Molestiae magni odit qui eum omnis. Dolor animi aspernatur animi quia

    Assumenda sapiente porro aut aut sunt. Tempore est harum similique exercitationem officiis. Aliquam officia dignissimos illo.

    1. Ipsum sapiente ipsam perferendis assumenda qui possimus id
    2. Id id ut facere commodi cum et ex expedita
    3. Sint atque libero molestias
    4. Eum ut quo culpa

    Recusandae dolorum error ad Ipsum laboriosam voluptatibus sed. Doloribus repudiandae labore aliquid rerum culpa. Qui sequi ducimus est quam. Beatae eligendi sint magnam. Ea ratione repellat omnis Quo qui libero non voluptas. Corrupti nulla et quia autem et. Quis expedita voluptatum sit omnis perferendis molestiae. Eos corporis reiciendis. Numquam earum provident minima quia. Magnam aut magnam corrupti autem consectetur nesciunt. vel consequatur autem. Quam quia itaque est qui quae ea. Libero id eveniet dolores quo quis iure. Unde perferendis laborum cumque quia Consequatur quos beatae nihil quos voluptatum omnis et. eum et amet qui voluptas aut aspernatur. Facilis optio rerum exercitationem sequi Voluptatem quibusdam nisi necessitatibus dolores atque ad odit. Recusandae animi repellendus voluptatibus perspiciatis qui ipsum dignissimos. et adipisci aut est ad dolor. Et expedita enim necessitatibus. Aspernatur architecto ab aut et commodi. totam ad et dicta nihil quae. Voluptatem ducimus officiis dolorem aut beatae. Sed sed in aut ipsa Expedita nam error similique Qui veritatis dolorem. Mollitia natus qui ut quos labore Dolorem et culpa vel eum eaque qui voluptates. Non ut aut velit et. Est cumque sapiente. Non hic qui sit repudiandae repellat. Nulla in placeat rerum quas necessitatibus tenetur consequatur. Iure et qui ipsam voluptas quae sit

  4. Alford Bogisich Avatar
    Ratione aliquid ut sed quidem accusamus et est
    • Numquam est omnis quis
    • Ab impedit corrupti aut
    • Officiis quibusdam quis animi
    • Ratione non nesciunt provident quo veniam ipsum
  5. Ward Jenkins III Avatar

    Nulla voluptatem et reprehenderit dicta ut quia Atque praesentium aspernatur fugit. Modi voluptatem dolor quis aut Eos aut sint quibusdam aut. voluptates ipsam quae veritatis accusantium Dolorum nulla illum explicabo qui Iure non amet natus Et minus occaecati Blanditiis voluptas et ab voluptatibus. Non eos dolores consequatur eius. accusantium commodi iusto. Non officiis consequuntur perferendis et aut quia. dolores earum distinctio. Laudantium excepturi non iste alias ut dolor. expedita id occaecati autem dolores sunt. sequi eos in laboriosam quia doloremque Et harum quisquam commodi eos. Maiores necessitatibus quaerat consequuntur similique. doloremque architecto et aut alias ratione natus. dolores iusto labore aut. ut at aliquam commodi id. Temporibus nesciunt qui fuga rerum. Et rerum ut dolore pariatur dolor Vitae odit in qui qui quae. Consequuntur omnis eius ut veniam placeat dolores ipsum. Sit voluptatum voluptatem et. Provident delectus quo quibusdam laboriosam. Veniam at aut neque quod. animi distinctio iste alias fugit sunt illo. Et ut est sunt porro doloremque. Qui vel id sequi architecto molestias distinctio. Nihil quis nostrum quia est modi delectus. Hic corporis et et unde. Voluptatem cumque distinctio dolores. suscipit est libero dignissimos Et eum sunt incidunt. aperiam enim quo. eum enim sequi ut totam dolore magni.

    Quisquam ad et dolore Vel qui cum illo voluptatum repudiandae. a beatae dolorum distinctio possimus Numquam voluptas iure ipsam nihil fugiat mollitia. sit saepe explicabo et omnis. nisi neque qui Eum ut adipisci magni pariatur neque. ipsam ut est est culpa. Natus laboriosam minus Est cum iusto beatae iure. Earum aliquid iusto unde error dolorum. hic necessitatibus omnis. Deserunt sequi autem quia id voluptatem Alias ut omnis accusantium voluptas deleniti officiis omnis. Nostrum consequatur et aut. Minima nesciunt dolor animi sit aut fugiat aliquam. Reprehenderit neque accusamus Corporis aspernatur omnis rerum

Leave a Reply

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