How To Customize Genesis Child Theme Without Touching Code?
If you are regular here at BloggerTipsTricks, I have always been talking for themes by Studiopress. The reason why I love Studiopress themes is they are search engine optimized, very clean coded and still have lots of space for customizations and branding. You can use genesis themes out of the box. They are
But, in case you want to add your own look and branding to your child theme you have to get your hands dirty with coding. If you are a non-coder or have zero knowledge of coding things can go worse. A simple task like editing the color of your header to having custom text present in the footer seems impossible for us.
Of course, there are tons of tutorials online to custom design your genesis child theme. However, it is risky and investing time in something you are not familiar with can leave your site broken.
The second option is to hire a professional designer to code your site according to your branding. This is still a recommended solution, but you have to invest a lot of money. Some designers charge as much as $1000 for one child theme.
Stressful! Right? I know.
I too have been there. I paid a good amount to get my genesis theme custom designed.
Having said that, things are not that difficult now. There is now a plugin that takes your entire headache and gives you the power to edit your Studiopress theme as per your needs.
You can change anything like the background color, edit the font, decrease the size of menu bars and put your logo to a little left.
All, without touching a single line of code.
Enter Genesis palette pro
Genesis palette pro is a WordPress plugin that enables you to edit your genesis child theme’s look and feel as per your branding. The best thing is you don’t need to touch any line of code or CSS. In fact, the editor itself is a visual editor that visually shows you the customizations instead of changes in the CSS.
Customize your genesis child theme with palette pro
Genesis design palette pro helps you design your genesis child theme that matches your blog branding. It’s just click and point. The interface of the plugin is very sleek and gives you the whole view of your theme along with zoom in and zoom out features. This helps you to edit the minute details.
It also has the option to check how your site looks on mobile and tablet screens. This is handy as sites need to be mobile responsive these days.
Genesis Design Palette Pro Dashboard
How to customize the general display settings?
The first option is where you can change the general display of your genesis child theme. You can customize the background color (different for mobile and desktop view), change the font and the size of the font.
In case you want a different color for your link, you can change your link color in this section.
Colors and font settings
Adding a custom favicon:
A custom favicon enhances your site branding and helps it to stand out. But, all genesis themes have a default favicon that cannot be changed without altering the coding. Here Genesis palette pro comes handy by giving you the option to upload a favicon directly from your media gallery.
Change favicon from here
Customizing the header:
In the second option, you can change the header color, padding (gap between two elements), and your widget position (if your theme supports an ad widget in the header like magazine pro theme).
Header Area Settings
Customizing the navigation menu:
Touch this option and you will feel you are a professional designer. Here you get all the control over little tweaks that you had buried deep in the heart because you did not know coding.
Navigation menu option allows you to,
Change the menu bar color, customize the dropdown of menu bars, and give them a different color on hover and a lot more.
Palette pro gives you the option to add or customize the border of dropdown menu items.
Customize the “read more” link, author bio, and breadcrumbs:
To give your own desired look and feel to your child theme, you need to customize the original standard genesis template as per your own color scale. If you want to edit the author bio and read more links, the genesis design palette pro comes handy.
Just go to the “Content Extras” tab of the plugin interface and the first option is to edit how
Additional content styles
Similarly, you can edit the breadcrumb and author bio settings from palette pro without even touching the code.
Change the footer widget display:
With genesis design palette pro, you can change the color of the footer widget, the padding and the text color.
Click the footer widget option from the plugin interface. The next row will help you to customize the footer widget color, widget content, title color and much more.
Footer widgets settings
Here is the final version of the site I designed using “no codes”.
Design palette pro result
Over to you
So, this is how you can customize your genesis child themes without having any knowledge of coding and in fact without writing or manipulating a single line of code. Genesis design palette pro gives non-coders the power to use their imagination and create an eye-catchy genesis child theme of their choice.
You can also save a good amount that would have gone for hiring a professional designer.
What do you feel about GDPP? Leave a comment below!