Customizing A WordPress Theme

Last updated: August 6, 2018 at 15:47 pm


Now that you know how to browse the WordPress repository for themes, how to install a theme and how to activate a theme on your WordPress website, it’s time to learn how to customize the theme.

Customizing a theme is one of the simplest things to do on WordPress. It simple means tweaking the theme a little here and there, adding or removing a column, changing the header image, changing the background color or image, etc.

First, I’ll run through the theme directory and install about 20 to 40 themes that look suitable for my hotel website project. I do this by hovering over the theme and then clicking the “install” button when it appears. But I don’t click “Network Activate,” which is the button that appears there after the I click “Install” and the theme has been installed. This is because if I click “Network Activate,” then I’ll be navigated away from the themes directory and I’ll have to load it over again.

As you can see from the picture above, I’ve installed the Hitchcock theme, but I didn’t Network Enable it. I’ll do that later. For now, I’ll just scroll down and install as many of the themes as seem suitable for this project. Later, I will network install and test them one by one. Then I’ll select the one that I like the best, or is most suitable for the project and “customize” it. Next, I’ll continue building the WordPress website using that theme.

Ok…so I’m still installing…be patient.

Now I’m testing the themes.

Trying to find the perfect theme!

And I did it! I finally the theme that I absolutely love for this project. The name is “Bard.” Or at least, it will work for now. This is sort of what my homepage looks like with the new Bard Theme.

So now that I’ve found the perfect theme for my hotel website, I’m going to customize this theme and I’m going to let you ride with me.

So let’s start all over again. To customize my newly installed WordPress Theme, I hover my mouse button over “My Sites,” then hover it over “The Amazonas Hotel in Lethem,” then click on “Dashboard.”

Now that I’m inside of my main site’s Dashboard, I hover over “Appearance” in the left hand column and then click on “Customize.”

This loads a new page where I can now customize my newly installed theme. Here are the options to customize:

  1. Upgrade (About) – this is the first customization button that appears on this theme and it gives the user the option of paying some money and getting even more features. It’s called “Upgrading to Pro.” But for now, I’ll completely ignore this option.
  2. Colors. I’m given the option changing the text, accent and background colors, etc, as you can see from the screenshot below.

3. General Layouts – This is about how many columns the page will have, etc.

4. Top Bar – This gives you an option of including a top menu bar above the header above image or not.

5. Header Image – This gives you the option of changing or removing the header image.

6. Site Identity – This gives you the option of modifying your Site’s Title and Tagline as well as uploading a logo.

7. Main Navigation – This gives the option of enabling or disabling the main navigation menu.

8. This gives the option of including a Featured Slider on the site just below the header image and just above the content area.

9. Featured Links – This gives the option of including Featured Links on the homepage. And we’ll talk more about this in the future.

10. Blog Page – This gives some customization options for the blog pages, but we’re not going to touch this right now since we’re not building a blog here.

11. Single Post – This gives some option for how the single post blog will look, but once again, it’s not relevant for my purposes.

12. Social Media – This gives the option of including a set of social media icons on the on the top of the page, as well as configuring them to link to your social media pages such as Google +, Twitter and Facebook.

13. Typography – This gives the option of changing your Logo’s and Navigation Menu’s typography.

14. Page – Footer – This gives you the option of including your logo in the Page Footer of the web page, that is, towards the bottom, as well as the social icons.

15. Preloader – This gives the option of enabling or disabling preloader animation on your pages.

16. Menus – Here is where you go to create and configure your website’s menus, such as navigation menus.

17. Widgets – Here is where you go to add or remove remove widgets from the sidebars, but there are better ways to do this which I will discuss later.

18. Homepage settings – This is totally irrelevant as we have already set our homepage and we can always change from our WordPress Dashboard by going to Settings > Reading.

19. Additional CSS – This is for advanced coders, and it’s something I won’t touch on for now.

OK, so that’s all the options that the Bard theme gives for customizing the website. Seeing that this lesson is getting a bit too long, I’ll split into two parts.

So see you in the next lesson: Customizing a WordPress Theme: Part 2.

There, I’ll do some customization to the Bard Theme I have installed and let you follow.

Leave a Reply

Notify of