One of the key selling points of the Genesis Framework for WordPress is the ease with which it can be customised in order to create a personalised design. The fact that there are also plenty of excellent child themes available for the framework also helps explain its popularity.
However, if you are not a developer and don’t have the necessary skills for building your own WordPress child theme, or customising an existing one, no amount of clean code and developer-friendliness is going to help you out. Thankfully a new product has recently been released that aims to make customising the appearance of Genesis-powered websites without the need to edit any code a reality.
That tool is Genesis Palette Pro, a plugin to help you style the appearance of a WordPress site using the Genesis framework and its many child themes. Not only will you not need to edit any CSS, you won’t even see any CSS while making the changes to the appearance of your site.
But what exactly can you customise with this plugin and just how easy it to use? Find out with our in-depth review of Genesis Palette Pro.
Using Genesis Palette Pro
The Genesis Palette Pro (GPP) plugin is installed like any other and once you’ve installed the Genesis Framework and an optional child theme of your choice, you can begin using its code-free editing functionality.
After the installation of GPP, a menu item is added to the exiting Genesis menu on the admin sidebar. From here you can access the interface of the editor, allowing you to visually customise the Genesis child theme currently active on your site.
The interface is very well designed and allows you to preview the appearance of your site, while also having access to the customisation options. The dashboard is very well organised, although those using a larger monitor will appreciate the extra screen real estate, thanks to the side by side layout of the controls and the preview.
One feature of the GPP dashboard that immediately jumps out at you is the support for responsive designs. The preview area includes three buttons for resizing the theme preview window in order to demonstrate how the page will look on a range of screen sizes, such as smartphones and tablets. This is a really handy feature to have as most modern Genesis child themes are responsive so it’s great to be able to see how your designs will look on a smaller screen.
When it comes to which areas GPP can help you customise on your theme, they are broken down as follows:
- General Body
- Header Area
- Content Area
- Content Extras
- Footer Widgets
- Footer Area
As you can see the controls for the editor are nicely divided into the main frontend areas of a WordPress theme.
Under each sub-menu of the editor, you are given access to the controls for making your customisations. As you make your changes, you are given a live preview in the opposing panel. This is great as there is no need to save your changes and refresh the screen to see them take effect.
You really can customise all the visual elements of your theme including:
- Colours (text, background, links)
- Text (fonts, sizes, weighting)
- Padding & margins
- Logos (including retina support)
- Borders (including corner radius)
All the above can be done using dropdown menus, colour pickers, or sliders, where appropriate. There is no need to access or edit any of the underlying CSS or HTML that defines the appearance of your site. If you can change the appearance of a Word document then you can use this Genesis customisation tool.
When it comes to previewing your changes, your modifications are displayed on the same page as the controls. This is a very handy as it allows you to instantly see how your individual design choices work with the overall appearance of the theme. While green link text might sound like a great idea, the live preview can reveal that this doesn’t work quite so well with your yellow post entry background colour.
By default the preview panel shows the homepage of your site, but you can easily click on links on the site preview to see how individual posts, pages and all other areas of your site will look, and then begin editing their appearance. You can also go into the settings section of the editor and enter a specific URL to preview.
Import and Export your Designs
Another valuable feature of GPP is the ability to import and export your designs. Using the data export and import features allows you to create a JSON file for backup purposes or importing into another site using this plugin.
This has many practical applications such as creating your theme modifications on a development site before uploading them to your live site, as well as creating a standard template for use on new websites, or working with client sites.
Saving the Settings
The ‘Save Settings’ button is always visible so you can save your settings as you go. Hitting this button commits your changes and publishes your new design, making it visible to your visitors.
Some of the individual options also have a default button to allow you to individually restore that particular setting to the Genesis Framework default, although not all options have this ability. This is very handy if you need to revert an individual page element to the default value, without overwriting all your changes. If you do need to reset all the options to the default settings there is also a handy ‘Clear Settings’ buttons that deletes all your changes.
While the above does work well and ensures you don’t end up making changes you can’t easily undo, it could be slightly improved. It would be nice if you could save versions or iterations of your design changes as you progress. Being able to go back a few levels deep of your changes, instead of reverting back to the default settings of the framework would be nice. Although, as previously mentioned you can view some of the individual settings and restore the default value, this doesn’t apply to fonts, and the padding and margin settings.
Genesis Palette Pro Extensions
The GPP plugin comes with a number of free and premium extensions for getting even more out of this powerful tool. At the moment the available options include:
- Freeform Style (free): adds an area for adding your own CSS to the editor
- CSS Export (free): adds a button to export a raw CSS style
- Google Webfonts (free): adds nearly 30 of the most popular Google Webfonts to GPP
The above are some handy free extensions for GPP and it’s good to see them being released as optional extras to keep the core version of GPP as lightweight as possible. Hopefully there will be some more free extensions added in the future.
With the Freeform Style plugin, you can easily enter your own custom CSS. The add-on also includes responsive support allowing you to enter CSS that will be applied depending on the resolution of the screen the site is being viewed on.
Child Theme Add-Ons
Two of the best looking and perhaps most popular child themes for the Genesis Framework are Metro Pro and Minimum Pro. Users of those themes should be interested to know that there are two premium add-ons available which increase the compatibility with GPP.
By default GPP preloads with the default values from the Genesis Framework, rather than the child theme that is currently active. But by using the child theme add-on for the theme active on your site, GPP will come pre-loaded with the default settings for that theme. The add-on also includes any sections that are unique to that theme, such as custom post types or homepage layouts. You can read more on this on this page on the GPP website.
There are plans underway to introduce more child-theme specific add-ons.
Support & Documentation
However, the plugin is very easy to use and anyone should be able to go in and start making changes to their website without any trouble.
Getting the best results from this plugin will ultimately come down to your design skills and eye for colour combinations, rather than your understanding of the actual functionality of the plugin.
When it comes to creating a support request, the GPP comes with a support widget located within the plugin dashboard. From here you can enter your details and send your message to the team.
There are two levels of support with access being dependent on your chosen pricing plan.
This is a premium plugin and is available on three different pricing plans:
- Basic: $49 (1 site license)
- Plus: $89 (5 site licenses)
- Deluxe: $199 (50 site licenses)
The Plus and the Deluxe options include priority email support, which the Basic option does not. The Deluxe option also includes access to the Metro Pro and Minimum Pro add-ons.
I was really impressed with this plugin. The layout of the controls used for making the changes to your Genesis child theme is really well thought out and easy to use. Users of any ability should be able to use this plugin to change the appearance of their website.
After installing the Genesis Palette Pro plugin, only one menu item is added to the WordPress admin menu, which is located appropriately under the existing Genesis menu. It’s nice to a see a plugin that doesn’t attempt to take over your admin area with dashboard widgets and top level menu items. It really feels like this plugin is a part of the Genesis Framework core.
The live preview implementation is great too as it allows you to see the changes you make immediately in the preview panel. However, it would also be nice to be able to view the live preview in another browser tab. While having the controls and the preview side by side is great in theory, if you are working on a screen with a modest resolution, you would probably benefit from having a larger preview area. Having an optional separate preview area would also be ideal for those working on a dual monitor setup.
To temper expectations it’s important to briefly cover what the Genesis Palette Pro plugin can’t do. It won’t let you change the layout of your theme and move elements around such as the menus, and widget areas. It’s not a page builder tool. For that kind of functionality you would need the Dynamik Website Builder from CobaltApps. However, if you want to alter the appearance of a site by changing the colours, fonts, and margins and paddings, GPP comes highly recommended.
If you’ve ever wanted to make minor tweaks to a Genesis child theme, from changing the font for a specific area such as a header, or post content, to giving your site a complete visual overhaul, then you can’t go wrong with GPP. Not only is no CSS knowledge required, but you won’t even see any code during the design process. However, the optional free CSS add-ons does give that functionality to those who need it.
If you are using Genesis, or thinking of adopting this framework, then this tool gives you the extra control over its appearance needed to make your WordPress-powered site truly your own.