I am a photographer, a videographer, a designer, a writer, a marketer. I am not a developer… and I’m freaking out because I just finished building a WordPress theme from scratch – without writing a single line of code – with Upfront Builder.
Most people I know have no clue what it is that I actually do. They know it has something to do with websites, so I get asked to “develop” websites for family, friends, small businesses and nonprofit organizations all the time.
So it goes without saying that I’ve used just about every WordPress page builder and WordPress theme framework out there to create websites for needy entrepreneurs and great organizations looking to spread a message about a worthy cause. For my latest creation, I found myself diving head-first into Upfront with Builder and I can honestly say Upfront Builder needs a whole new WordPress theme category of its own.
Upfront Builder Is One-Of-A-Kind
I know what you’re thinking: every time a WordPress page builder or WordPress theme framework gets an update it’s “revolutionary,” “a game changer” and “WordPress will never be the same again!” In great anticipation, we install whatever new earth shattering innovation we’ve stumbled upon and to our dismay we discover it’s just another take on front-end drag-and-drop customization for WordPress themes. Maybe a pretty new UI. Maybe a more intuitive user experience. But almost every WordPress theme framework lets you do some form of front-end customization now.
We could get into a spitting match over who did it first and best, but WYSIWYG customization is already here to stay and the competitive space is just making visual WordPress theme customizers faster, better and easier to use.
As for Upfront, we are thankful for the role it has played in driving WordPress front-end theming forward, but the truth is Upfront was never meant to be a WordPress theme customizer – it was built to be something completely different.
Front-End Customizers Vs. The Upfront Builder
So what’s the difference? Upfront Builder not only lets you design, style and customize your WordPress theme from the Upfront drag-and-drop live preview visual editor, but when you’re finished you can bundle, export, and share (or even sell!) your Upfront theme – styles, formatting, embeds, images, copy, menus, layouts – the whole shebang.
Start from scratch, package and sell a final product without writing a line of code. Simple.
How I Built My First WordPress Theme Without Writing a Line of Code
Let me paint a picture for you. To start my new WordPress theme I gave it a title and clicked “Start Building.” That’s it!
Upfront generated everything I needed to get started and took me to the editor so I could start creating using all the Upfront elements available in the visual editor. (Developers, think boilerplate – this is not just individual pages in a page builder.)
I then set my default color palette, fonts, and font sizes. It really helped speed up development when moving between page layouts.
I customized the pages I needed and created my own page templates – still no code. As I was laying out my home page template I found that I could make any region a global region that would populate across my entire site. This was another real time saver for things like headers, footers, and menus that needed to remain consistent across the entire site.
Tip: Keeping your regions organized can really speed up development and make later customizations easy.
I had my site pretty well mapped out, so for each new page I created a new layout. All the global elements would populate and then it was just an issue of dragging, positioning and scaling new elements for each page.
When my site was styled I activated the responsive checker and made little adjustments as needed so my site would look its best on any screen size.
I can honestly say the most time-consuming part of building my first site was gathering the content. No way around it. Taking and editing pictures, writing copy, talking with the client and getting a clearer picture of what they wanted was time-consuming.
But with Upfront, I was able to complete a first draft of my entire website in less than a day of development.
And suffice it to say, my client was impressed with the turnaround.
That’s amazing, but here’s the magic that really puts Upfront in a new category: when all my pages were formatted, all the images were embedded, and all the colors, and fonts, and forms were in place, I clicked “Download” and the theme package downloaded to my computer ready to share live on my client’s site.
I installed the zip file on a new Upfront enabled WordPress installation through the appearance tab (just like any other WordPress theme), clicked activate, and all my links, custom pages, menus, and styles populated perfectly.