Qards Review: An Attractive New WordPress Page Builder Plugin from Designmodo
- 38 Comments
Qards is a page builder plugin for WordPress that enables users to create unique layouts and designs without the need for any design or development knowledge.
Built by Designmodo, the Qards plugin includes an extensive library of stunning building blocks (or cards) that can be customized using an extremely intuitive front-end inline editor, and assembled to help you build the perfect layout for each page on your website.
Because Qards works independently from your WordPress theme, as well as allowing you to build an entire website page-by-page (as you’d expect from a WordPress page builder), it can also be used to create standalone full-width landing pages that have their own styling and formatting.
What Can You Do With Qards?
The pages you create with Qards don’t take on any of the styling or layout options of your theme — rather, they’re blank canvases that can be populated with a range of prefabricated content blocks that come with the plugin.
They’re all full-width and full-screen, and don’t include any of the popular WordPress theme elements such as headers, footers, or sidebars — allowing you to build totally custom designs and layouts, free from the constraints of your theme or WordPress itself.
Whether you use Qards to build standalone landing pages to promote products or services, or build your entire website, it’s a flexible tool that could suit many different types of project.
Qards comes with a good selection of beautifully designed content blocks split over eight categories, each of which can be used in any combination on your pages. Each block can be easily customized by, for example, changing the background image or the text and its appearance — thereby giving you a custom look without having to edit any code.
Qards also claims to work with any WordPress theme — so, as long as the template you’re using on your website has been coded to WordPress standards, the plugin will work fine. If not (because of incompatibilities between Qards and your other plugins, for example), Designmodo offers a pretty generous 20-day money-back guarantee.
Getting Started with Qards
Once the plugin has been installed and activated on your WordPress website, you can get started building your custom page designs via a new item that’s been automatically added to the WordPress admin sidebar menu entitled ‘Qards’.
From the Qards screen, you can create a new page and then launch the visual editor to start work on your custom design.
Once the editor has loaded, you’ll have a blank canvas to work on; there are no sidebars, headers, footers, or any of the other elements that may be part of your current theme.
The available content blocks that are used to build your page layout are sorted by category, and, thanks to a quick preview panel, you can see what each element looks like before adding it to your layout.
The categories used to organize the content blocks include:
Each category contains multiple content blocks, giving you plenty of options for how your final page will be constructed. And, because you can easily customize any of the blocks you add to your layout, the chances of any two pages built with Qards looking the same are extremely slim.
To create your layout with Qards, you simply select multiple blocks, one after the other (once in place, the blocks can be easily moved or deleted as required).
This again gives you lots of flexibility for how your final layout will be structured, and, because this is done through an intuitive drag-and-drop interface, it really shouldn’t pose any problems for regular computer users — whether they’re familiar with WordPress and web design or not.
What’s more, because the content blocks have each been designed to work well together in any combination, it’s not difficult to put together an attractive, cohesive design for each page you create — even if you don’t generally have much of an eye for graphic/web design.
After you’ve added one or more content blocks and moved them into place, you can then begin personalizing your design.
Customizing the Qards Content Blocks
Customizing the Qards content blocks is done through a user-friendly interface in which icons are activated by hovering over them with your mouse or clicking on the individual elements. Changing an image, for example, is as easy as selecting a different item from the file explorer window, which is conveniently displayed when the edit icon is clicked.
In a recent update to Qards, version 1.4 lets you select images directly from your website’s WordPress Media Library. This is great news for those who want to use any images they’ve previously uploaded to their website in their new designs.
This process can then be repeated for each of the blocks you’ve added to your layout until you’ve replaced all the stock images with your own content as required.
All other content, such as text, links, and other items, can be edited just as easily as the images, thanks to the context-sensitive menus that are displayed when the mouse cursor hovers over them.
Extra options for customizing the buttons you’ve added to your designs were also added in version 1.4.
Through the new button configurator, you can easily change the shape, size, and color of any button you add to your pages. This new level of control allows you to choose the best design combinations for the highest possible conversion rates.
One of the highlights of Qards, and a feature that separates it from other WordPress page builder tools, is the ability to edit content inline — meaning you can simply click on a heading or other piece of text and start typing.
This gives you a live preview of how your content will appear, eliminating the need to switch between windows and make guesses as to how your work will look to the end user.
Although some of the newer page builder tools for WordPress are starting to include inline editing, it’s rarely implemented as well as it is with Qards. If you want to remove the disconnect between the back-end editors of WordPress and the front-end view of your content, Qards is a great option.
When entering the text inline, rather than getting access to a full-blown set of editor controls for customizing the content as you enter it, you just have a small set of controls to make use of. At first glance, this may seem a bit restrictive compared with the standard or upgraded TinyMCE editor of WordPress. However, once you start using what’s on offer, you should find it’s more than capable of allowing you to do what you need to do.
The inline editing controls even allow you to change the font and color of your text for a particular section — something that isn’t available on a default WordPress installation when creating content. And if you’re wondering what happened to the text tab that allows you to edit the underlying HTML of your posts (found on the default WordPress editor), you can still access that code with Qards. What’s more, you can now easily edit the CSS of any element too.
To do so, it’s simply a case of activating the settings menu and then selecting the ‘edit HTML/CSS’ option to launch the appropriate editor.
Although you don’t get a live preview to see the effects of your edits, the editor does use color-coded syntax to make it easier to add your customizations.
As well as editing the HTML and CSS of the individual elements on your pages, you can also customize the global CSS of your layout — which is achieved by entering the relevant CSS on the Qards Settings page (found under ‘appearance’ in your admin dashboard).
Although you’ll get a pretty good idea of how your end product will look as you build your layout, you can also preview the design at any time by clicking on the relevant button. This gives you an accurate view of how your website will look to visitors.
If you want to see how responsive your newly created custom layout is, you can experiment by resizing your browser window and watching the layout respond to the changes of the size of the viewport.
During the design process, you can reorder the blocks at any point by clicking on the appropriate button and dragging and dropping the elements into their new locations. This lets you quickly experiment with your layouts to find the perfect arrangement without much extra effort.
As the pages you build with Qards have full-width layouts, they don’t include any of the characteristics or elements of your website or its theme, which means your website’s regular header, sidebar, footer and any of the WordPress menu items you may be using aren’t displayed on the pages you create with Qards.
If you’re looking for a tool to design beautiful standalone landing pages that are entirely separate from the rest of your website, then Qards is an excellent choice.
Additionally, because you can easily set a page created with Qards as the homepage of your website — in the same way you can with a regular WordPress page — you could actually build your entire site using pages created with Qards. That said, if you were to do this, it would be debatable whether it would be worth using WordPress, as many of its features and benefits would be unavailable to you and your visitors.
The Qards plugin from Designmodo is available on two pricing plans:
- Single site license: $99
- Agency 5 site license: $199
You can view the pricing options on this page of the official Qards website. Plus, there’s a 20-day money-back guarantee, which gives you enough time to try out the product and see whether or not it meets your needs.
I had mixed feelings when installing this plugin — mainly because I already knew Designmodo had previously released an impressive standalone WordPress theme (update: 1 September 2015; now discontinued) that, at first glance, appeared to have a similar look and feel to Qards.
I wasn’t entirely skeptical, of course, but I also wasn’t sure Qards could offer anything to separate it from this earlier product and other established WordPress page-builder plugins.
Thankfully, having now taken it for a spin, I can confirm that Qards does indeed have a few features that justify its existence and elevate it above the competition. These include the ability to create new pages that are entirely outside of your current theme, and the combination of fantastic-looking content blocks, used as the foundation of your page layouts, which can be edited with the same easy-to-use inline content editor that made its previous product such a success. Admittedly, some other WordPress page builders have managed to get one of these last two features on a par with Qards, but very few offer both together — and especially not in such an intuitive and professional-looking package!
However, there are still a couple of lingering doubts: firstly, it seems like there’s quite a lot of overlap between some of the functionality commonly found in a regular WordPress theme and what’s included in Qards. Secondly, because some of the core WordPress functionality (such as posts, the media library, and widgets) aren’t easily accessible to pages built with Qards, you need to ask yourself whether Qards is the right platform for your project — especially when Designmodo’s similar standalone WordPress theme (update: 1 September 2015; now discontinued) is also available at a similar price.
It’s worth pointing out, however, that Qards is a newly released product that’s still being actively improved and upgraded — so keep an eye on the comments on the official Qards product page for insights from the developers and a glimpse of what’s in store for future releases.
The changelog is a good place to see what bugs have been fixed and which new features have been added. As mentioned, additional features that have been recently added include improved support for accessing files in your WordPress Media Library and better controls for customizing the buttons you’ve added to your page designs.
With additions and improvements being made on a fairly regular basis, such as support for MailChimp integration and the use of Google Fonts, it looks like the developers of Qards are responding to user feedback and requests.
If you want to build high-quality landing pages with ease, which sit outside the design and styling of your WordPress theme, then Qards makes for an ideal solution. Alternatively, if you don’t mind eschewing a number of the core WordPress features, such as blog posts, widgets, and the WordPress menu-builder, you could even build your entire website with this plugin. That said, if you’re looking for a theme-based approach to customizing your entire website while still having access to some of the same great features as Qards (such as great-looking content blocks and the intuitive user interface) then Designmodo’s earlier standalone WordPress theme is probably still the better option.
In short, it boils down to which is the best tool for your project: the Qards plugin or Designmodo’s more specific previously released standalone WordPress theme (update: 1 September 2015; now discontinued).
(Update: Designmodo now has a very nice video showing how to integrate Qards with the WooCommerce eCommerce plugin — https://www.youtube.com/watch?v=PLSMkvSKsFk)
And finally, lest we forget to mention: WinningWP fans can get a handsome 15% discount on any Designmodo product (including Qards) with our handy Designmodo Coupon. Enjoy!
Built anything with Qards yet? Feel free to leave a link in the comments to anything you’d like to showcase.