The Complete Beginner‘s Guide to Full Site Editing in WordPress

Full site editing is an exciting new feature introduced in WordPress 5.9 that allows you to edit all areas of your site visually using blocks. It combines features that previously required toggling between the block editor, customizer and theme files into one unified editing experience.

For beginners, wrapping your head around this new editing paradigm can be tricky. My goal with this guide is to explain what full site editing is, why it matters, how to use it, and most importantly, how to leverage it effectively as a beginner WordPress user.

What is Full Site Editing?

Full site editing allows you to customize the design and content of your entire WordPress site using blocks. This includes:

  • Individual Pages and Posts
  • Archives
  • Search Results
  • 404 Page
  • Global Elements like Headers, Footers, Sidebars
  • Typography and Color Schemes

In the past, these areas required toggling between the block editor, customizer and theme files to edit. With full site editing, everything is brought together into one visual block-based editing experience.

This unified approach makes it easier to create a cohesive site design. When you customize global styles for typography or colors, those changes apply everywhere automatically. If you want to update your header or footer site-wide, you can do it in one place instead of on individual pages.

Key Benefits of Full Site Editing

Some of the major benefits full site editing provides include:

  • Visual Editing: Edit design and content by dragging and dropping blocks instead of code.
  • Unified Workflow: Modify all areas of your site from one editing screen instead of toggling between multiple interfaces.
  • Global Styles: Define typography, colors, spacing that apply automatically across your site.
  • Reusable Sections: Create header, footer, sidebar and other blocks once to reuse them sitewide.
  • Design Cohesion: Easily maintain a consistent look, feel and branding across all pages.

For developers and agencies who build sites for clients, full site editing also enables creating starter themes with flexible customization options that are easy for end users to update on their own.

However, it‘s important to understand full site editing is powered by block themes which function differently than traditional WordPress themes. Let‘s look at what that means.

Block Themes: The Foundation for Full Site Editing

Full site editing relies on an important concept – block themes. These differ from the typical WordPress themes you may be used to in a few ways:

1. Built with Blocks

As the name suggests, block themes use the WordPress block editor as the core way to structure content. Instead of relying on PHP templates like legacy themes, everything within a block theme is powered by blocks and block patterns.

This block-first approach is what enables the unified editing experience full site editing provides.

2. Require WordPress 5.9+

The changes necessary to support block themes require WordPress 5.9 or higher. This means existing themes not built as block themes won‘t support full site editing features without refactoring.

However, the good news is there are already dozens of block themes available ranging from free to premium options. Popular ones include Twenty Twenty-Two, TT1 Blocks, Kadence, Blocksy and more.

3. Gradual Adoption

It‘s important to understand block themes and full site editing are a long-term vision for WordPress. They are not expected to completely replace traditional themes overnight.

Rather, the goal is a gradual transition allowing the ecosystem to align itself with this new editing paradigm over years.

During this adoption phase, traditional and block themes will co-exist. Full site editing is optional, though over time expected to become the preferred approach, especially for new sites.

Enable Full Site Editing on Your WordPress Site

Now that you understand the basics of full site editing and block themes, let‘s go over how to actually activate full site editing on your site:

1. Update to WordPress 5.9+

First, ensure you are running the latest version of WordPress, 5.9 or higher. Full site editing will NOT work properly in earlier versions.

Log in to your WordPress dashboard and navigate to Updates to run the latest version:

2. Install a Block Theme

Next, install a block-powered theme compatible with full site editing. Popular free options include Twenty Twenty-Two, TT1 Blocks or Kadence (limited customization).

To add a new theme, go to Appearance > Themes > Add New in your dashboard. Search for any of the above themes, install and activate.

Make sure plugins and customizations you currently use are compatible with your new block theme before switching. Test on a staging site if needed.

3. Access the Full Site Editor

Once enabled, navigate to Appearance > Editor to access the full site editing interface. This is where you‘ll find tools to edit global styles, templates, and draft or edit pages.

The full site editor combines customizer-level design options with editing pages, template parts and more in one screen using blocks.

Now that you know how to access it, let‘s explore some of the key features available when using full site editing.

Key Features and Tools in the Full Site Editor

The full site editor introduces new concepts like templates and template parts along with global styles that affect your entire site. Learning these key features is essential to mastering full site editing.

Templates

Templates control the structure and design of individual pages and sections. For example, you can edit the Header template to customize what appears at the top of every page.

Common templates include:

  • Header
  • Footer
  • Sidebar
  • 404 Page
  • Home Page
  • Archive Page
  • Single Post

To edit a template, look for the Template drop down in the top bar of the full site editor. Select which template you want to customize.

Then you can drag-and-drop blocks within that template or adjust styles specifically for that section. The changes will apply wherever that template appears.

Let‘s look at how template parts extend templates further.

Template Parts

Template parts are reusable sections that can be used across templates. For example, you may create an Alert Bar template part displayed both in the Header and Footer.

Some ideas for template parts:

  • Alert Bars
  • Feature Sections
  • Testimonial Sliders
  • Team Member Profiles
  • Contact Forms

Template parts enhance consistency in your design and allow you to build a library of reusable components. Look for the Template Parts panel in the full site editor to create and manage them.

Global Styles

Global styles give you full control to customize colors, typography, spacing and more for your overall site‘s design.

These style options previously lived separately the customizer. Now you can access font selection, sizing, colors palette customization and additional controls from the Styles panel.

Best of all, any changes made here apply automatically everywhere on your site. This makes maintaining brand consistency much easier.

Between templates, template parts and global styles – you have tremendous flexibility to design in the full site editor while maintaining reuse and consistency.

Now let‘s look at additional tools that simplify editing further.

Page Toolbar and List View

When editing individual pages and posts, the full site editor offers a few options to simplify navigation:

1. Page Toolbar

This top toolbar allows quickly jumping between templates and template parts. You can also access global styles, page analysis and design shortcuts.

Use this to easily move around different areas without excessive clicking around the screen.

2. List View

List view toggles a panel showing every block used on that particular page in a vertically stacked list.

This allows efficiently reordering blocks by dragging-and-dropping anywhere on the page. The list view also collapses blocks into a cleaner interface.

Look for the List View icon on edit pages to toggle it on/off.

Between these options, navigating and editing pages using blocks becomes much more efficient.

Comparing Full Site Editing to Popular Page Builders

If you have used visual page builders like Elementor, Beaver Builder or Divi Builder – full site editing will feel both familiar and different.

While both page builders and full site editing provide a visual, drag and drop way to design – there are some important distinctions in how they work under the hood.

Page Builders

Page builder plugins allow designing page layouts and content visually using a custom interface layered on top of themes.

The output still relies on shortcodes and HTML structure defined by the theme. This can sometimes cause conflicts between the builder and underlying theme.

Popular standalone page builders include:

  • Elementor
  • Beaver Builder
  • Brizy
  • Divi Builder
  • Visual Composer

Full Site Editing

In contrast, full site editing is part of core WordPress – not a commercial plugin. The editing interface IS essentially your theme.

Everything from content to design uses blocks instead of shortcodes. And global styles deliver design consistency not easily achieved with page builders.

So while page builders offer more features today, full site editing is the future direction for WordPress itself.

Over time, core improvements aim to close the functionality gap between builders and full site editing. But both remain solid options depending on your needs.

Which Should You Use?

In summary – here are some simple guidelines on deciding which solution to use:

Full Site Editing

  • You want to leverage latest block theme features
  • Don‘t need hundreds of complex design options
  • Prefer consistent global design control
  • Building a new site from scratch

Page Builder Plugin

  • Require very custom page-specific designs
  • Supporting an existing site designed with a page builder
  • Need ecommerce functionality (until resolved in core)
  • Want access to hundreds of templated content blocks

Evaluate your specific situation against these criteria to determine if full site editing or a page builder is the best solution today.

Tips for Using Full Site Editing Effectively as a Beginner

While full site editing opens new creative possibilities, it can be overwhelming initially. Here are some tips to help you be successful as a beginner:

Take It Slow

Jumping straight to global styles and templates across your full site can cause confusion. Instead, start by adding and editing post content using blocks and get comfortable with that process first.

Once you have a good grasp of blocks, begin exploring templates and design customization in small doses. Move at your own pace instead of tackling everything at once.

Leverage Block Patterns

Creating effective page layouts from scratch with blocks takes practice. Fortunately, most block themes provide a library of pre-made block patterns to start with.

Browse these patterns to find pre-made page designs, header variations, testimonial sections and more. Insert these as a starting point for your content instead of a blank canvas.

Over time, customize these base patterns or save your own as you get comfortable creating original designs.

Use Staging Sites to Experiment

Making substantial changes to an existing site can be nerve-racking. Thankfully, leading hosts like Kinsta provide staging sites – essentially a clone of your live site.

Use staging to experiment with full site editing, block themes, layout changes and more without fear. Once you have it looking how you want, push your edits to production.

Staging gives you a worry-free sandbox. Take advantage of it as you learn full site editing.

Read Official Documentation

While this guide covers the fundamentals, there is incredible depth within full site editing. Read through WordPress developer documentation as you gain comfort.

Bookmark helpful resources like editor basics, global styles reference, tutorial on creating block themes and more.

Armed with proper knowledge resources, don‘t hesitate to further unlock full site editing‘s capabilities down the road.

Final Thoughts on Mastering Full Site Editing

Full site editing is an exciting step forward for WordPress. Creative professionals can now customize the entire scope of their site without coding using a unified, visual editing experience.

However, with great power comes a responsibility to use these tools effectively. Especially as a beginner, take it slow and focus on mastering key concepts like templates, styles and blocks patterns.

Hopefully this guide provided you a solid foundation get started with full site editing, understand how it differs from other solutions like page builders and start using it effectively on your own sites.

I will be publishing more in-depth tutorials and case studies as full site editing capabilities expand in future WordPress versions. But don‘t wait – now is a perfect time get hands-on experience with it for yourself.