Moving Away from Page Builders to the Block Editor
WordPress Hartford CT Meetup
October 17, 2023
October 17, 2023
[ Make Current ]
Watch Recording
Click below to watch our October 2023 meetup on YouTube, or visit https://www.youtube.com/watch?v=WTOWudYYOL0.
[ Make Current ]
Agenda
- Speaker Introductions
- Life Before Gutenberg – Why Page Builders Were Popular
- Why Use The Block Editor?
- What Advantages Do Page Builders Still Have?
- The “Hybrid” Approach (Peter)
- Rebuilding From A Page Builder (Ray)
- Wrap-Up
[ Make Current ]
Ray Michno
- Hartford WordPress Co-Organizer
- 25+ years in IT
- Developer/Software Architect
- Pratt & Whitney, Aetna, UnitedHealthGroup
- 7+ years using WordPress
- Self-employed – CTWebGeek
- Married, No Kids, Lives in Newington, CT
- Geek
[ Make Current ]
Peter Ingersoll
- Hartford WordPress Co-Organizer
- 25+ working on the Web
- Marketing, communications, design, tech guy
- Hartford Courant, logistics, agency
- 10 years using WordPress
- Self-employed – Ingersoll Interactive
- Married, two adult kids, lives in South Windsor, CT
- WordPress Admin & DIY Advocate – IngersollWP.com
[ Make Current ]
Life Before Gutenberg
- Classic Editor and Custom Fields were used to build content for pages and posts
- Coding was required to create custom PHP templates to lay out content
- Difficult for non-developers to modify
- Early Page Builders like WPBakery/Visual Composer were often bundled with paid WP Themes – they allowed users the ability to customize some layout but could be frustrating to work with
Why Use the Block Editor?
- Compatibility
- Block Editor is part of WP core, ensuring compatibility across different themes and plugins
- Cost
- Block Editor is FREE with WP – no annual licenses
- Simplicity
- Many pages can be built entirely with the core WP blocks (ex. rows, text, images)
- Flexibility
- Mix and match core and pre-made blocks together to create a specific design
- Performance
- Generally, core blocks more lightweight than page builder modules
- Ongoing Enhancements
- WordPress is continuously adding and improving blocks and the Block Editor
What Advantages Do Page Builders Still Have?
- Advanced Features
- More styling properties (ex. CSS animations), built-in A/B testing, etc.
- Improved Site Editing *
- More mature site-editing capabilities than current WP Full-Site-Editing (* more of a theme feature vs. stand-alone page builder)
- Better E-commerce Support
- Some include specialized components/modules for WooCommerce (ex. shopping carts, product modules)
- Pre-Built Designs
- Some offer a wide variety of pre-built templates to build individual pages or an entire website
- Troubleshooting Support
- Paid subscriptions often come with help desk support to answer questions
- Community Support
- Some popular Page Builders have large community support groups (ex. podcasts, forums, FB pages, YouTube tutorials, etc.)
Build Concepts are Similar
- Blocks = Modules = Elements = Widgets
- Many are very similar, with options being a big difference
- Layouts are defined by containers, rows, sections, columns, etc.
- Things go into things
- More advanced module / blocks are similarly made up of smaller elements
- Block patterns are just bigger groups of “connected” blocks
- Third-party developers make page builder and block addons
- Some offer advanced functionality, many just different design capabilities
The Content Area
- Page and post content is in the “content area”
- Separate from header, footer, sidebars, and hooked elements
- More mature site-editing capabilities than current WP Full-Site-Editing (* more of a theme feature vs. stand-alone page builder)
- Themes generally control headers, footers, etc.
- Depends on the theme and theme type
- Advanced & premium classic themes add more control in the customizer, or add custom elements to the layout
- Block themes offer full site editing, which includes
- Premium page builder plugins can be used to design site layouts
- e.g. Beaver Themer and Elementor Layout Elements
Header / Navigation
Content Area
Sidebar
Footer
Turning Off Page Builder Plugins
- Your content will look different
- Content will lose layout design and styles
- Some page builders will leave relatively clean content
- Some page builders will leave code that will require cleanup (which is why recreating is often the better way to go)
- Functionality will be lost if from a module or widget
- A replacement block will be needed
- If the page builder is tied to the site layout (headers & footers), site design work will be required
Page Builders & the Core Editor Work Together
- Page builders are generally used for pages
- Home, about, contact, landing pages, etc.
- The core editor is generally used for posts
- This is recommended as to not “over engineer” (blog) posts
So creating new pages – or converting existing – using the block editor is possible even if a page builder is active and used on other pages.
Live Demo – Hybrid Approach
It’s Demo Time!
Live Demo – Rebuild Approach
It’s Demo Time!
Wrap Up & Q&A
[ Make Current ]
Resources & Links
- Bing Images Creator AI
- Vectorizer convert raster images to vector
- Vectorpea online vector editor
- Photopea online image editor
- Kadence Amplify event
- WordPress 6.4 Source of Truth
- Jamie Marsland’s YouTube channel
- Find My Blocks plugin to see what blocks are in use
- Ollie block theme
- Local to work on WP sites on your PC without hosting
- InstaWP, TasteWP, and WordPress Playground for free temporary WP sites
- WordPress Help Desk Support Eagle’s website with links to other meetups and resources