WHAT THIS POST IS ABOUT. Jumping into WordPress themes and page builders isn’t as easy as developers make it seem. In using Astra Pro and Elementor, the thought popped into mind: Why not create “schematics” to show people what’s under the hood rather than just telling them?
It All Started With Hailey
I decided to scrap an old portfolio/blog site, preferring a fresh design and focus on newer content. I was using Astra Pro and decided to upgrade to its paid “agency” bundle for access to a range of more advanced “starter sites” to speed things along.
My expectation was to hop in, make a few quick changes to “customize” the theme to my needs and off I’d go. (Honest disclosure: I’m not a newbie to WordPress, themes, page builders, or blogs, but I’m not a developer, either. I know enough to know what I want, but never quite sure how to get there.)
No sooner had I loaded the Astra Pro blog-focused theme I was confronted with a picture of a smiling blogger, Hailey. I look nothing like Hailey. So first thing: Change the home page picture (and pictures on other pages) from Hailey to me. But where is she?
Is Hailey a part of the Astra theme . . . but where is she? Or is she a part of Elementor, the page builder . . . but where is she? What parts of this theme were built by Astra and how much by Elementor? How do these two work together . . . and where?
Help! I’m Lost.
I’m relatively new to the power of Astra Pro, more advanced theme design, and the page builder associated with it — Elementor. To be fair, both the developers of Astra and Elementor provide helpful support articles and/or videos for their products. And, because these two are proven and popular, many bloggers and v-bloggers (WPCrafter is excellent) produce How-To content to assist people just like me.
But, to be fair to folks like me, theme and page builders produce help for their products in general, not in specific, and there is so much information out there we are drowning in tutorials, blog posts, and videos.
We essentially need a sherpa — and I don’t mean the ethnic group native to the most mountainous regions of Nepal. As I dove in trying to find Hailey, the thought occurred: Why don’t developers provide actual “schematics” of how specific themes are built? Why not show me, not just tell me? Tenzing Norgay to my Edmund Hillary on Everest.
Help me up the mountain: Hailey’s picture used on the home page can be found in a custom header, which is located here and can be changed by doing this. Additionally, the home page is built using a blog archive page and its design is this . . .
I’ve run into these frustrations using other themes and page builders (like Beaver Builder or Divi) because all developers do their thing a little bit differently . . . how they approach design, what their methodologies are in building themes, what nomenclatures are used, and how they communicate to end users.
Why not create a “schematic” for how a theme is built?
A theme “schematic” is not unlike a product schematic or set of instructions. Think of IKEA instructions on how to assemble a piece of furniture — only a million times better. IKEA instructions suck . . . but are essential.
Astra does provide a visual “schematic” via its Astra Hooks, but it lacks context, connection, and it’s more wireframe than roadmap.
But . . .
Theme developers code and develop themes. Their job isn’t to write documentation, per se, or “draw” schematics to tell us how to change a header image.
But it can be done. Most theme developers produce only a few types of themes (blog style, portfolio/gallery focused, traditional static home pages for small businesses and special interests, or media-focused). With each of these there may be several sub-offerings (restaurants, health and fitness, insurance), but they’re all built on the same chassis.
Just bundle like-minded themes together and provide a bird’s-eye roadmap or schematic of how they’re built . . . what goes where, how to find the high-level, most-likely-to-change assets, and so on.
After poking around the Astra Pro (mini-agency) theme and Elementor, I finally found Hailey and uploaded a different picture. She was hiding in a custom header (created with Elementor) and in a tab that didn’t seem an obvious first choice.
The problem now is I want to make changes to the header. Where’s my schematic?