With such a huge user base, WordPress is the world’s most popular CMS.
It is also the easiest to use, so it follows that there are many people using it who have little idea of coding and are more business or design oriented.
The challenge is thus to create functionality for this non-technical user base that will enable them to create a theme/design/template based on their ideas, without touching any code.
Now that’s really tough, especially when you consider that these users might be using WordPress to create any kind of website, for example:
- Brochure sites
- News magazine style sites
- E-commerce sites
- Corporate sites
The list goes on, but you get the idea.
Drag and Drop Theme Building
This great challenge has not deterred a number of developers to attempt to bring to market the perfect theme builder that could help users create their own WordPress theme with no coding skills. Since no coding should be required, the simplest interface is the drag and drop interface, coupled with a number of options to user can select to achieve the end result.
So lets examine some of the most successful drag and drop theme builders out there.
The Startup Framework by Designmodo is a theme unlike any other. It utilises a drag and drop style builder for every part of your site. Just select the blocks you want from the over 100 on offer and move them around on your canvas until you like what you see. No coding skills required, yet the result will look as professional as can be.
It works a bit differently to other themes in that, once activated, all the components of your WordPress site (header, sidebars, widget areas) become a blank canvas. On this canvas you can drag and drop any of the 100 full-width blocks to create any design you want.
These hundred blocks are split into 7 categories including header, contents, projects and more. Each one can be placed accordingly to create the different pages, customising and editing each image and text to your needs.
Editing can either be done using the inline editor or by switching to the HTML and CSS code view. It all depends on the changes you want to make and how deep you want to delve into the details of the theme’s looks.
The pricing plans on offer are three; a one website license costing $149, a three website license costing $249 and a five website license costing $349. All options include one year of updates and email support.
Request a Demo to get a better feel for what you’ll be getting before you commit to purchasing.
Headway probably has the easiest user interface of all the drag and drop builders we’ve looked at.
With Headway, you start out with the grid, and you start drawing on it. You simply draw out the blocks and then select which one to display.
Headway Blocks remove the limitations of traditional web site design and layout even more. With 8 standard Block types to pick from and a slew of 3rd party Blocks, Headway gives you the tools you need to build your site to meet your’s and your audiences’ needs. From header, navigation, content to a footer. With the exclusive Block System, just draw in your Blocks where you want.
You also have a layout selector within Headway. With the Headway Layout Selector, you can create unique, specific page layouts for each and every class of pages or even for individual pages. Headway lifts the barriers you have with other themes and frameworks and gives you the ability to have the site you want, right down to the individual pages or posts.
Want a different layout for your home page, about page or any other page? You can do that with the Layout Selector. Want the main blog page to be different than the single post page, no problem with the Headway Layout Selector.
In a nutshell, you can edit all single item pages or you can edit a specific page or even a specific blog post.
Once you’ve got your Blocks laid out, you can use the Headway design editor to set the visual appearance of your blocks and other elements. The totally redesigned Visual Editor makes it possible to drill down to any element on the page to style it a number of ways:
- Text, border and background colors
- Rounded corners
- Border styles
- Background images
- Line height and letter spacing
- Text and box shadows
- Styles for various states of hyperlinks (hover, clicked on, etc.)
The pricing for Headway theme builder is $87 for the base option and $174 for the developer option.
With the developer option you get the ability to use the builder on your client sites, and also get support for your client sites. With the base option, you are restricted in usage and support to the websites you or your business own.
The developer option also includes 4 Headway extend credits ($116 value) to be redeemed on official themes and blocks from Headway Themes.
Both the base and developer options give you one year access to support, updates and documentation. The developer option of the Headway drag and drop theme builder gives you early access to beta versions.
Pagelines is also very popular among developers as it is very well-built at a code level and can easily be extended. The latest version, PageLines DMS, is quite revolutionary.
PageLines has introduced the first-ever extension marketplace for websites. This means you’ll be able to buy and sell almost any functionality you need for your site packaged as an extension from PageLines directly.
Pricing for PageLines is $8/mo for the Personal edition, $16/mo for the Business edition, and $24/mo for the Developer edition.
We have a full PageLines DMS review if you’d like to learn more about how this product works.
iThemes has been around since 2008 and we’ll be here to innovate and grow with your business. The latest version of iThemes’ flagship product Builder, version 4, has recently been released.
Builder 4.0 uses responsive design, so your site will respond to different screen sizes like phones and tablets. Our newly-updated Foundation Series themes are now fully-responsive, and pave the way for future mobile responsive theme designs.
iThemes builder functionality revolves around the layout editor, child themes, the style manager and blocks.
The power of Builder starts in the layout editor. Choose from the building blocks of a great web site by inserting modules: header, images, navigation, content area (with or without sidebars), widget bars, HTML areas, and a footer. Complete flexibility without code.
Child themes provide structure, typography, and a range of color palettes to get you started. You’re sure to find an option for every project. Or create your own. And they’re all included when you buy the Builder Developer Pack.
Not a coder? WebDesign.com can help with that. But if you want to change the background, try a different font, or match the theme to the colors of your brand, Builder’s Style Manager plugin can help you do it fast and without touching the code.
Blocks are special functionality add-ons for specific content types. Restaurant Block lets you make a menu of food items and add locations and directions to your site. Events Block lets you create events and calendars. And there are more blocks coming soon!
Pricing for iThemes Builder is three-tired. The Foundation Pack is available for $80 and gives you the bare necessities, including 5 Foundation themes, which are all mobile responsive.
The developer pack is probably the best deal, you get the core theme with 1 year of support and updates. You also get the useful LoopBuddy plugin and all the 60 Builder child themes. All this for $197.
If you go for the All Access Pass you get access to the 80 iThemes classic themes.
Elegant Themes is one of the most popular theme shops around. However what most people don’t know is that Elegant Themes also offers a number of premium WordPress plugins for sale.
The Elegant Themes Builder is a plugin that provides some incredible tools for structuring the content on your page. The plugin creates a visual drag-and-drop canvas where you can add, arrange and re-size advanced elements on your page. This builder appears below the normal text editor when you create a post or page, creating a unique canvas for each. The builder allows to you quickly create columns, sliders, tabs, buttons, toggles, boxes and so much more.
The Elegant Themes Builder plugin has its origins in the Landing Page Builder that is found in the ElegantThemes Convertible theme. Since the Convertible theme is limited to landing page themes, they implemented the builder as a separate plugin, which allows us to use it with any theme.
To check out how things work with the Elegant Themes builder, there is an excellent demonstration video available on the ElegantThemes’ website. It previews a great deal of the possibilities of the Elegant Page Builder.
Since Elegant Themes operates a theme club, they offer memberships to the club rather than the ability to purchase individual themes or plugins. However, for just $89 you get access to all themes, plugins and PSD files, which is a steal if you ask me.
The one thing I really like about the Elegant Themes Builder is that I can install it on any theme I wish, and thus I’m not locked in to any one provider.
The Themify drag & drop Builder for WordPress helps you build any page layouts with a live, frontend preview. Layouts are completely responsive, and what you see is what you get. It works on desktop, tablet, and mobile. Themify Builder comes with any Themify theme, or purchase the plugin to use it with any WordPress theme!
This is another plugin (not a theme) that allows you to create complex layouts within minutes. It’s a really excellent solution and costs only $25 from CodeCanyon. Theme developers can also bundle it with their own themes, giving them an edge over competition. It’s been downloaded close to 7000 times making it one of the most popular plugins on CodeCanyon.
With its intuitive frontend and backend options it is very easy to create a unique web page. The drag & drop system make this plugin an easy-to-use solution for all users regardless of their skill level as designers or developers. On the other hand developers will find this plugin useful because they can assign this plugin to their templates with their own shortcodes and enable their potential users to design their own web pages using template’s elements.
This is another builder which is however focused more on internet marketers, and as such packs in some specific features targeted to this audience. You will therefore find in-built split testing capabilities, ready-made templates (for squeeze pages, landing pages) etc. Definitely go and check this one out.
Ether Content Builder WordPress Plugin is a powerful tool for building custom content pages aided with an innovative visual composer. It comes equipped with many commonly used widgets that can be laid out via interactive drag&drop interface. Ether Builder can use 3rd party widgets as well as custom crafted ones. Ether Builder is actively developed by Por Design and gets regular updates and bug fixes. No coding knowledge is required and it’s a must have brag for any serious content publisher that works with WordPress.
Have you used any drag and drop theme builders? What is your opinion about them? Would you rather use a bare-bones theme and code the rest yourself than use the drag and drop approach?
Lets not forget that apart from these drag and drop WordPress website builders, we have other packages that offer point and click options, which you might prefer. For example, the Dynamik Website Builder is an excellent accompaniment to Genesis, while Toolset is probably the best tool to build complex websites without coding.
As you can see, there are lots of options to choose from, and sometimes it might be downright difficult to make a choice. Remember that buying one of these builders is a long term investment, so think well before committing yourself, and if necessary buy 2 or 3 of them and test them out before deciding. A small upfront investment will be worthwhile in the long run, and is much better than having regrets 1 or 2 years down the line because you hadn’t tried out another builder before making your final decision.
If you enjoyed this post, make sure to subscribe to WP Mayor’s RSS feed.