8 Things I Learned Building a WordPress Site without Code
Tools to build complex full-stack products without code are reaching an inflection point this year. They’ll quickly transform how products get built and who gets to build them – and open the gates to a new, more diverse wave of product creators on the web.
The whole topic, and especially the phrase “No-Code” itself, got me really excited, and it made me want to build a WordPress site with absolutely no code and see how it went. So that’s what I did. This article presents my eight main lessons and takeaways from the process.
Notes on the Project
Here are the details of what I actually did for the no-code project I chose, how long it took, and what the result was. Feel free to skip straight to the eight takeaways if you’d like.
What “WordPress Without Code” Means
What does it mean to no-code a WordPress site? (Anything can be a verb if you wish hard enough.) It certainly doesn’t mean that the WordPress site itself doesn’t have code: WordPress is made of code, and especially of PHP, like a car is made of parts.
This is also an informal launch for WP No Code itself, since I enjoyed the experience and I’d like continue to build both my own knowledge and my ability to teach good no-code practices for WordPress assemblers.
The Site I Built: WP No Code
I wanted to build a site that could be there in case I got excited about learning—and, especially, teaching—a no-code approach to WordPress assembly. Nicely, the domain wpnocode.com was available, so we picked it up, and that’s the site I built. Check it out! And here’s a screenshot of the homepage if you’re not feeling clicky:
Do you want to know how I did it? I recorded the whole process. Literally the whole process, in this YouTube playlist of 12 videos spanning about 8 hours of development:
I can pretty confidently recommend this playlist if you want to understand the nitty-gritty of codeless WordPress assembly, and I can very confidently recommend it if you want to watch eight hours of me being mildly confused. (I have a lot of tighter no-code video series planned for the future, so stay tuned.)
The Tools I Used
I’m planning a lot of detailed build videos that describe the tools to use in-depth, but for the time being here are the choices I made, all of which I was happy with. (Some links are affiliate links.)
- SiteGround for hosting. We used our existing GoGeek account that also hosts WPShout.
- Astra theme (the Pro version). I’m suspicious of all commercial themes, but I tried Astra last month and found it wonderfully free of cruft and bad decisions. I’ve also used and liked the Beaver Builder Theme, but Astra’s “starter sites” feature (discussed below) won me over, and I think I made the right choice.
- Beaver Builder as a page builder (the pro version). The hands-down best page builder in WordPress, because it’s not buggy. (Elementor’s pretty good too, but it gives me headaches often enough that I avoid it unless a site’s already on it.)
- Beaver Themer for custom templating. Learning what Beaver Themer does was incredibly cool—easily the highlight of the project. I discuss it in depth in takeaway #7 below.
- WP Forms Lite for the contact form. I was going to use Gravity Forms, my favorite form plugin, but it’s expensive enough for a single site that I decided to give WP Forms Lite a chance, and it works just fine.
- Pods and Advanced Custom Fields (the free version of both) to register new custom post types, custom taxonomies, and custom fields. Pods can do custom fields too, but I’m used to and trust ACF, and Beaver Themer works with ACF out of the box whereas it needs another extension to work with Pods.
- All-in-One WP Migration for site migration (the free version, plus the URL extension). This ran into server upload limits—it’s literally always something with WordPress site migrations—but I knew how to get around them, and it was still much easier and more reliable than any other migration approach I could’ve tried.
And now, onto my takeaways from the project:
1. No-Code Tools for WordPress Have Improved a Lot Very Recently
A few years ago, “build a WordPress site without code” was a lie theme makers told you, knowing that the broken result would become some developer’s problem.
I’ve been in WordPress professionally for about eight years. When I started out, and even as recently as two or three years ago, “build a WordPress site without code” was a lie that theme companies (or page builder retailers) told you: they knew that that was what you wanted, and that you wouldn’t understand the nightmarish tradeoffs until they became some developer’s problem a few months of frustration down the road.
This was the context when, in mid-2017, when I tried Squarespace. It was a revelation. How can website creation be this easy and intuitive? The feeling was very much, “It’s such a shame that WordPress doesn’t have a website creation experience this user-friendly, without huge side effects that totally ruin WordPress as a technical system.”
Since then, a lot has changed. I recently remade my Squarespace site entirely with Beaver Builder and the Beaver Builder Theme, and it was an almost totally painless process, just like the Squarespace original had been. I also only used code for a few very difficult things, like some custom CSS to control changing header colors—and in my original Squarespace experience I’d relied on that same CSS knowledge, as well.
In this project, I dropped even the CSS, and I’m very happy with the result. The technology I could only dream about less than three years ago is very much here, right now, and I thoroughly enjoyed using it.
2. To Build WordPress Sites Without Code, You Really Need to Know What You’re Doing
Over and over again on this project, I was grateful that I’ve been building WordPress sites for more than a decade. I wouldn’t want to try any piece of this project for the first time, especially if I had a deadline or (heavens forbid) a paying client breathing down my neck.
I was grateful, first and foremost, for an abundance of knowledge in making the right technology choices:
- Why SiteGround is the best choice to host a just-starting-out WordPress site, and how to use its admin area to quickly create a WordPress instance, put the site under SSL, and so on.
- What makes Astra a better choice in starter theme than the thousands of flashy ThemeForest or Elegant Themes themes I could’ve chosen.
- Why Beaver Builder is the best choice in page builder, and why not to use Gutenberg for serious layout creation.
- How to find good license-free stock images (Unsplash), where to go to quickly design visual assets (Canva) or to do Photoshop-style image editing (GIMP), how to check if DNS changes are propagating (What’s My DNS), and so on.
- How to migrate WordPress sites with All-in-One WP Migration (even once you hit annoying server-imposed upload size limits).
And lots of other examples. But so much of it also came down to understanding WordPress itself—not the code, but the fundamentals of what things are.
- Why About is a Page and blog articles are Posts.
- What a WordPress custom post type is, and why I’d want one for the site’s Demos instead of making them into Pages or (shudder) Posts.
- What custom fields and custom taxonomies are and why they’re useful for building the Demos into something full-featured.
- Why the blog homepage looks one way in the theme demo, and how to change it back to the site’s default display for the blog index.
- What Beaver Themer actually does in terms of mapping custom fields and other site data to posts of arbitrary post types, and why that’s relevant to my needs.
- Why my first step on seeing 404s after migration is to “Save Changes” (after making no changes) in Permalinks, instead of panicking.
And lots of other examples throughout the entire project. In short, I feel that no-coding a WordPress website would have gone sideways in a hurry if I wasn’t already an experienced WordPress professional.
3. “WordPress Expert Who Doesn’t Know How to Code” is Getting Close to Being a Real Thing
This project initially felt like a Catch-22: where was I supposed to have gotten all this hard-won knowledge, while not learning how to code?
Since I was so happy to have my existing knowledge on this project, no-coding WordPress initially felt like a bit of a Catch-22: where was I supposed to have gotten all this hard-won knowledge, all while somehow not learning how to code?
But thinking more about it, I believe that if I was starting out now, there’s a good chance I could make a good career out of “knowing lots of things in WordPress, but not how to code.” That feels like the proper job description of a WordPress assembler, and if that person gets started out on the right foot, she can be learning on-the-job, on real client projects, just as I did. We’re just learning a different set of things, using different technologies.It's more feasible than ever to make a good career out of “knowing lots of things in #WordPress, but not how to code.” Click To Tweet
Honestly, it’s a lot like how I never had to learn “close-to-the-metal” languages like C to call myself a web programmer, and how some experienced programmers think that’s crazy. Today’s mandatory tools are tomorrow’s underlying architecture that you don’t always need to know for most common jobs, and so it may eventually become with PHP and CSS in WordPress. Certainly there’s a lot of market demand for that outcome, and that’s why things have Beaver Builder and Astra have gotten so much better so quickly.Today's mandatory tools are tomorrow's underlying architecture, and that should gradually happen with #PHP and #CSS in #WordPress. Click To Tweet
Of course, you’ll always need lots of people who understand those languages, just as you’ll always need lots of people who understand C. Creating new things—actually making new themes rather than customizing existing ones, or anything resembling developing new functionality through plugin creation—will require coding knowledge for the foreseeable future, as will the more intricate and interesting work even in website builds.As a way to help small businesses with their most common needs, no-code #WordPress site creation is already a reality. Click To Tweet
But to help small businesses with their most common needs (great-looking homepage, clear calls to action, a few inner pages, contact form, blog section, please make it look good on a phone…), codeless WordPress is pretty much already a reality.
4. Codeless WordPress Assembly Has the Same Work Rhythm as Normal WordPress Development
I call the usual rhythm of web development “80% done, just 80% to go.” You think you’re almost done pretty early on in the project—because you’ve done all the easy, good-looking stuff, and you’re not yet aware of the two or three half-hidden problems that will keep you up late in frustration. Then at some point those problems reveal themselves, you do a crazy amount of grinding, and turn in a project that’s 60% over budget. Sound familiar?
This is not just my (or your) foolishness, it happens on airports and stuff too—it is a very hard problem to get rid of. (Some great advice for dealing with it, on projects with real paying clients, is to take what you think is your most conservative estimate, double it, and quote that.)
As on a normal project, I ran into a few hidden challenges that took a ton of work to fix.
Anyway, the point is that this rhythm still holds up in codeless WordPress website creation, just like it does in code-based WordPress development. I hit a giant layout thing I didn’t understand at almost the end of the project, and I wrestled for what felt like forever with it—just like I would’ve hit some wacky PHP versioning error on a normal project—and I obsessed over small details in Beaver Builder just like I would’ve obsessed over small details in Sublime Text.
One difference on this project, though, was that the time flew by. As I discuss in takeaway #8, I think I enjoyed the front-endiness of it all.
5. Giving Up Control is Good
Building the site this way was very much an exercise in trust, and—again, because I felt like I’d chosen good tools—I almost always felt like that trust paid off. In some cases, I felt like the final product was better, and easier to create, than if I’d been taking a code-capable approach to the project.
I saw this mostly on the design side. I think the WP No Code site looks pretty good (and would/will look better with more fleshed-out content on it), and I wouldn’t have been able to get it there relying only on my own design abilities. Astra has a really-cool-if-you-trust-it “starter sites” feature that drops in an entirely configured website, with its layouts pre-built in your choice of good page builder (which narrows your choices to Beaver Builder and Elementor). I saw one I liked, and I went with it. I didn’t even really change the colors or typography—I liked those, which is why I chose the demo in the first place. I feel like this exercise in trust really paid off, with one exception I’m getting to later.
I spent a lot of time hoping that my theme and plugins would do exactly what they were supposed to—because I wasn’t going to be able to fix them if not.
More generally, I spent a lot of my time hoping that the theme, page builder, and other plugins would do exactly what they were supposed to do, down to the checkbox and pixel—because I wasn’t going to be able to fix them if not. Again, because I know what to choose, my trust was almost always rewarded, and that was a great feeling.
6. Giving Up Control is Bad
About 80% into the project, I got stuck on a baffling layout decision that whoever built the starter site made. Rewatching the videos, I actually see that I noticed the error all the way back in the first hour, but then got distracted, and it really reared its head in hour seven or so.
I had two small hints of a “Why did they do it like that?!” feeling familiar from placing too much trust in previous software systems.
This “Why did they do it like that?!” feeling was familiar from trusting previous software projects that weren’t worthy of that trust. I had a similar experience with a dumb decision, also by the starter site creator, to make almost everything a Beaver Builder Header module (a useful module for a narrow range of things, but not a flexible one), as well as to create little “tags” above
<h2> elements (which I liked) that were marked up as
<h6> elements (which I didn’t like). I was going to live with this, but it’s both Bad for SEO and Bad for Accessibility, and I eventually spent twenty minutes fixing it across the entire site. I didn’t enjoy that.
This feeling is what kept me off page builders for years, until they got good enough (well: one of them got good enough) that I could use it without constantly having my autonomy stripped from me. The feeling only showed up once or twice in a project that, overall, flowed very smoothly and happily.
But it’s certainly still there as a possibility—and, once again, I think moderate irritation would have felt more like mild panic if I actually didn’t know how to code in WordPress, or if the project were on behalf of an actual client. Add bad tools into the mix—themes, plugins, hosting, etc., that are likely rather than unlikely to violate the user’s autonomy and trust (which is still kind of the rule rather than the exception)—and the panic would be severe and immediate.
7. Beaver Themer is Amazing
I’m a Beaver Builder affiliate (if you click a link in this article and buy something from them, I earn a commission), and I don’t want you to get the misimpression that I’m faking enthusiasm for this product, so let me start with the negatives.
- Beaver Themer is crazy expensive. I paid $147 out-of-pocket for it, and it wants to renew for the same amount next year. Paying $147 yearly for a plugin physically hurts.
- The name is horrible. To this day, I get massively confused between Beaver Themer and the Beaver Builder Theme (do you blame me?), to the extent that I wrote the first 2,000 words of my Beaver Builder Theme review calling it “Beaver Themer.” Horrible name for a plugin that is neither a theme, nor something that creates a theme.
- What it actually does is confusing. More specifically: You have to understand how WordPress themes work to fully grasp why what it does is so amazing, and once you understand how themes work, your need to pay $147 a year for Beaver Themer goes down significantly.
Okay, with those things out of the way: Beaver Themer is the most amazing piece of WordPress software I’ve seen in recent memory.Beaver Themer by @BeaverBuilder is the most amazing piece of #WordPress software in recent memory. Click To Tweet
What it does, basically, is give you an alternative to the WordPress template hierarchy that actually works. Without Beaver Themer, if you want to add a custom field value to every post of post type Example, then you need to create
single-example.php in your theme and get deep into PHP. With Beaver Themer, you can do the same thing, using: the standard drag-and-drop Beaver Builder interface.
Beaver Themer lets you put any piece of site data anywhere on any part of your site, in a way that can be automatically templated.
More generally, with Beaver Themer you can put any piece of site data anywhere on any part of your site, in a way that can be automatically templated.
I needed this, because otherwise posts of the custom post type I created, Demos, were going to look like stripped-down blog posts. I had no way to customize their appearance, or—more importantly—to add various kinds of metadata to them. There’s no way to get around this without code, I thought, and Googling to make sure is what led me to realize that, actually, that’s exactly what Beaver Themer does.
Beaver Themer marks the second product from the Beaver Builder team that has absolutely blown my mind harder than almost any other WordPress product (the only other one that springs to mind is the All-in-One WP Migration plugin). And it’s so easy to miss that they’re doing this, because their marketing is so… unobtrusive. If Beaver Builder’s marketing were as exceptional as its products, you’d have a human-sized Beaver Builder cardboard cutout in your house right now.
With all that said, take a look at Beaver Themer. If you want to create WordPress sites without code, it’s an official must-have.
8. No-Coding Websites is Fun! and the Websites Can Come Out Good!
I haven’t had this much fun making a website since my first experience with Squarespace.
To be honest, I haven’t had this much fun making a website since my first experience with Squarespace.
I think part of it was the added challenge: You can do this, but can you do it pretending like you don’t know what CSS is? Or how to modify a theme’s actual files?
But probably most of it was: It was almost all on the front end. With some exceptions (some of them, like migration, still fairly painful), the workflow was: I look at my website, I make a change in a visual interface, and my website changes. It’s pure creation, and in my experience it works very well for the human nervous system and reward centers. In fact, I found myself getting sucked in, which is how what I thought would be a one-hour proof-of-concept ballooned into an eight-hour passion project.It's always been possible to build a #WordPress site entirely without code. The difference is that now the site can be good. Click To Tweet
At the end of that hours, I’m proud of and excited by the result. I’m excited for you to look at the WP No Code site, and I’m excited to add to it and build it out. I’m not nervous that you’ll look at it on your phone, or that you’ll notice that the footer is jamming into the content so that you lose the last 40 words of what I was trying to say. The site works, and I think it looks great—quite a bit better than if I had done the whole thing myself. It’s always been possible to build a WordPress site entirely without code. The difference is that now the site can be good.
This is what people have wanted creating websites to be like for about 25 years. Squarespace did it in a very contrained, closed-source environment a few years ago, and now WordPress has done it. It wasn’t easy, and it took forever—about 15 years, counting from the start of WordPress as a software project. To get here, the web itself had to get better, first of all. (Hi IE, just calling to say I never think about you.)
After that, we needed a massive team effort of free and open-source software, free and open-source extensions for that software, and, crucially, paid extensions that have finally succeeded in combining “responding to the needs of the market” with “writing things that actually work.” That is the part that’s new, and—if you know what tools to use, as well as the fundamentals of what WordPress is—it finally makes actually-good codeless WordPress site creation a reality.
How to Start Your Own No-Code WordPress Journey
Learning this approach to WordPress website creation was fun, and I’d enjoy teaching it. So this article is a soft-launch of WP No Code itself as a teaching resource, with shorter, more focused tutorials to follow. Just stay tuned on WPShout, as I’ll share everything I create here first.
If you can’t wait to get started—or if you already have—then I highly encourage you to check your own toolkit against the list of suggested products I shared above. I’ve seen most things on the market, and I genuinely believe those are the best tools available for WordPress assemblers right now.
Lastly, you can always ask for help or share ideas in our Facebook group. No-coders welcome! 🙂