• Skip to primary navigation
  • Skip to main content
  • Skip to footer
Genesis User

Genesis User

Build your own website using a StudioPress theme and Genesis Blocks plugin..

  • Home
  • StudioPress etc
    • Genesis Blocks
    • StudioPress
    • Genesis Pro
    • WP Engine
  • Get Genesis for Free
  • Themes
    • Genesis Sample Theme
    • WP Engine Themes
  • Genesis Blocks
You are here: Home / Genesis Blocks / Website Builder / Customizing Genesis Blocks Page Layouts

Customizing Genesis Blocks Page Layouts

January 21, 2021 by PhilG

The Genesis Blocks full page layouts provide a quick way to set up complete professional webpages. But what if you need to add or remove page sections?

Adding and removing page sections from a Genesis Blocks layout

Want to customize your Genesis Blocks page layout?

That’s easy. You can build your own page sections from scratch. To do that use the Genesis Blocks page layout tools, such as the container, advanced columns, and post grid block. Or you can insert one of the readymade individual page sections available in Genesis Blocks.

Add a new page section above or below any other page section

Genesis Blocks builds the full-page layouts from individual page sections. That means you can add a new page section above or below any existing page section. You can also remove any page section if you don’t need it.

When you want to add a new row of content to your page, you can use the ready-made page sections, or you can build your own from scratch.

Ready made page sections

Using a ready-made page section saves a lot of time. You make many small design tweaks to margins, padding and background colors etc, even for a small page section. So, starting with a one click section makes sense even if you intend to tweak that section after inserting it into your page.

If the ready-made page sections are not suitable, you can build your own.

When building page sections from scratch…

  • Carefully select an existing section’s container block, then choose to insert above or insert below.
  • When you build each row of content make your first block a container block.
  • Place every block you add to this row inside that container block (think of it as a wrapper block). This enables you to add margin, padding, and a background color to the entire row.

Always start with a container block (or a cover block)

So, for instance, if you wanted to add a post grid block to your page. You would first add a container block, then place the post grid block inside that container block. This gives you more control over the width, margin, padding and background color settings.

The key building blocks you will use to build page sections are…

  • Container block.
  • Advanced Columns block.
  • Post Grid block.

Just remember, wrap all blocks inside a container block.

You can even nest one container block inside another container block, but that’s a bit advanced for this tutorial.

This is a list of blocks available in the free version of Genesis Blocks plugin…

  • Testimonial
  • Profile
  • Notice
  • Drop Cap
  • Button
  • Spacer
  • Accordion
  • Call to Action
  • Sharing
  • Post and Page Grid
  • Container
  • Pricing
  • Email Newsletter
  • Advanced Columns
  • Layouts

Many plugins add their own blocks

You are not limited to using the built in WordPress blocks and the blocks provided with Genesis Blocks plugin. Many other plugins add blocks to the WordPress post editor. However, my advice is to keep it simple.

Keep it Simple!

You can make a clean and professional website using a StudioPress theme and the Genesis Blocks plugin. Adding a few fancy features can make soon make your site look amateurish. So, proceed with caution.

Filed Under: Website Builder

Download Genesis Framework for Free

The Genesis Framework and the Genesis Sample theme are now free for all to download and use.

Get Genesis for Free

Footer

Search This Website

Get Genesis for Free

The Genesis Framework is now free, find out how to get it here…

Get Genesis Free

Did you see these pages?

  • WP Engine Themes (From StudioPress)
  • Genesis Blocks Tutorials
  • Get Genesis for Free
  • Genesis Sample Theme
  • 10 Free Themes With WP Engine Hosting
Get 10 StudioPress themes free with WP Engine hosting.
Get 10 StudioPress themes free with WP Engine hosting.

Copyright © 2023 · Genesis User: This website is independently owned by an affiliate marketer of StudioPress. It is not sponsored by StudioPress, WP Engine, Copyblogger Media LLC, WordPress, or Automattic Inc.
WordPress, Genesis, StudioPress and WP Engine, are registered trademarks of their respective owners.