Once you understand the basic principles of the design and layout tools available in WordPress tools, you should be able to create a website you are proud of. I am sharing two videos aimed at helping you understand those principles, including how to switch between design themes:
- A prepared demo where I walk you step-by-step through the process — including a part where I had to retrace my steps afterward to figure out why a design change didn’t work the first time. You’ll do best if you adopt of spirit of exploration and experimentation, so I want you to see how I explore the system.
- A real-life case study of assisting a webmaster with the redesign of her site to use a WordPress block theme rather than Elementor (a plugin that I think adds unnecessary complexity). I show a technique for redesigning a website without letting the world see a half-finished version while you’re working on changes.
Theme Change Demo: Switching from a “Classic” Theme to a Block Theme
This tutorial shows how to switch between the design themes offered by the Toastmost service for Toastmasters (although the principles are the same for any WordPress site).
In particular, if your site is using one of the older “classic” WordPress themes, the demo shows how and why to switch to a more customizable “block” theme. I show several examples of customizing design elements such as the page header and navigation menu.
At one point, I outfox myself and can’t change the design the way I want to — because of an issue I only figured out later. I left that part in, with the solution at the very end, to demonstrate how you go about solving mysteries with the software. I’m not immune from being confused by the complexities!
Case Study: Converting an Elementor Site to a Block Theme
The video below is from a Zoom session in which I assisted Nancy Cook of Speakeasy Toastmasters with switching her design theme and making changes to adapt site content to the new design.
Her case was complicated by the fact that she had inherited a website design built using Elementor, a WordPress “page builder” plugin. Elementor is one of several page builders that became popular before the development of the “block theme” design tools now available in WordPress. Some people love it, but I believe it’s time has passed — and for my purposes, it adds unnecessary complexity. Rather than supporting Elementor and its competitors, I teach the core WordPress system.
Nancy took my advice to redo the site without Elementor, but in the process we had to fix elements of the layout that appeared “broken” when we made the change to a block theme. To prevent anyone who visited from seeing a broken site while we were working on it, we used my Quick Playground plugin to make the changes, initially, to a copy of the website running in a virtual environment.
Commercial websites handle this by setting up a “staging site” where a new design can be tested before it is implemented on the live website. Rather than setting up a whole separate website, we used Quick Playground to create an instant staging site. Quick Playground works with WordPress Playground, a service that allows you to create a virtual website for experiments. Quick Playground allows you to make a copy of your live site that includes a different design theme and different plugins.
Once we were reasonably happy with the results, we copied our changes (including the new theme) back to the live website. This is an unedited recording, so forgive my ums and ahs — we were figuring things out together as we went along.