WordPress is a very user-friendly platform and a great option for creating websites. It has loads of features and is easy to customize. One of the best ways to create a beautiful and professional-looking website is to use one of the thousands of WordPress themes available in the dashboard.
WordPress Theme frameworks are a foundation for several themes, which are built on a framework – as opposed to some which are built from scratch. Theme frameworks fall into two categories – one, developed by an organization for their specific theme shop, and two, those that are free to be used by anyone for their projects. Consider the WordPress core as the foundation of a home and the theme the add-ons that add aesthetics. In this article, we’re going to look at how we can customize a WordPress Theme.
Choose your theme
Needless to say, the first thing you need to do is find the right theme for your specific needs – it should have the functionality required for your project. Check the options offered by the theme before creating a child theme. Does it offer the basic appearance and sense of what you need? For example, if it’s an ecommerce site you’re building, check for ecommerce functionality; if you want to include testimonials, make sure that functionality is already integrated. This is especially important if you’re a newbie. Finding a theme that already comes with the features you need will save a ton of time.
Customize
There are several ways in which you can customize a theme in WordPress. Here we will examine the popular and easiest ways you can do this:
Using the WordPress Customizer
It is possible to customize any WP theme using the inbuilt customizer. So you need to understand this tool first. You access the customizer which is in the admin section. Go to Appearance>Themes>Customize. This allows you to modify your selected theme in real time. However, do bear in mind that how much you can do with this tool depends greatly on how much effort the theme developers have put into its utilization. Here you can easily make changes to the color theme by clicking on ‘Colors’. You can also change the site icon or logo, in the ‘Site Identity’ tab. You can configure the appearance of your site here, as well as modify background images and manage menus on your site. It even lets you preview your website in different modes like desktop, tablet, or mobile.
Using custom CSS
If you’re a beginner, you can try using the Customizer’s inbuilt CSS editor, or the Custom CSS provided with the Jetpack Plugin. You can access this in Appearance> Edit CSS. There are actually loads of plugins that will help you write customized style sheets. If you’re already a bit familiar with CSS you can also try the Advanced CSS editor; this allows you to implement if across devices, desktop and mobile.
Using Plugins
Often, we can make the changes we need with the help of plugins. They allow us both the style and the functionality we require but we’re unable to create as newbies to WordPress. Several plugins are available for free; the developers often create these wonderful add-ons that let you dramatically change the look or functionality of your style. Sometimes they give you some basic features for free, and charge a small amount for the more exciting features. Plugins allow you to:
- Alter visual elements even if you have no knowledge of CSS or cascading style sheets; e.g. Site Origin CSS
- Include or delete blocks from pages even as you’re looking at the site’s front end; e.g Galau UI Visual Editor
- Drag and drop page builders like Elementor and Beaver
- If you have some familiarity with CSS you can use a plugin like Visual Composer to make a whole lot of changes. As it’s included in several popular themes, it’s a very handy tool.
Creating a Child Theme
While you can make changes with the CSS, it does have its limitations – it’s mainly used for aesthetic effect rather than alter functionality. However, if you want to enhance the structural elements of your site, you need to customize the theme by creating a child theme.
You should never make alterations in the theme’s original files – this is because when the theme is updated, whatever changes you had made will be lost.
A child theme is a separate set of files that stays on the top of the original theme files; the site will use the versions of the files in the child theme that are present. For example, let’s say your child theme has the index.php file but no page.php file. Your site will take the index.php file from your child theme but page.php file from the parent theme. This way, you can alter the existing theme without fear of losing your changes if the theme gets updated.
The theme files determine the appearance and sense of sites; you can use the Theme Editor to edit the theme, or through FTP connection, by using an FTP client. The second method is much safer, as in the first, there’s a danger of locking yourself out.
Make a folder called ‘parentthemename-child-’ (use an actual name instead of themename). The new child theme primarily requires the style.css file. Specify your domain name, enter a description, specify your name or brand and add your URL. The last line will look something like this:
@import url(“../parentthemename/style.css”);
Note: Instead of parentthemename, use the actual theme you’re altering, and give a name of the child theme too. Save all the changes you have made to the style.css file, and turn on your child theme in the WP dashboard in Appearance> Themes.
To bypass the parent theme, copy the parent’s template files into your child theme, and then make alterations in its code or structure. After activation of the child theme, your site will use the .php file in your child theme and not the parent theme. Perform a test to see if what you’ve done actually works. You can try something very simple like adding a paragraph to a template.
If you see the edits on your site after saving in your child theme template, you know you’ve succeeded!
There are several other ways of making modifications in the theme, but you should try that only once you’ve become proficient in WordPress. WP sites can be a bit dicey due to this reason – but they are also more scalable and efficient.
Rajeesh PK
Rajeesh is a Director and Creative Head at Acodez. He helps the company to meet its clients’ needs to craft a compelling online presence. His 10+ years experience and expertise in UX, UI, Information Architecture and Wireframing help the company to develop user-friendly, pleasing and aesthetically appealing websites. He regularly researches and writes about the latest trends in web designing and development.
The post A Guide to Customizing WordPress Themes appeared first on Torque.
