WordPress Themes

by Drew Conroy

Posted on February 6, 2019

Shows a paint brush rolling out paint

Note: This post is from our video tutorial on WordPress Themes

Open your WordPress Dashboard, then go to “Appearance” on the left side panel and then “Themes”. Every Wordpress installation comes with some themes already installed and one activated.

If you want to activate any of the other theme’s currently installed, just click the activate button. The “Activate” button along with the “Live Preview” shows up when you hover your cursor over a theme.

If you want to search or upload a new theme, click the “New” button at the top. You can search by “Featured”, “Popular”, “Latest”, “Favorites” and “Feature Filter”.  Then enter your search in the search box to the right.

Once you find a theme you like, click the “Install Button”. Then click “Activate” to activate the theme. That’s all there is to it.

You can also upload a theme from your computer by using the “Upload Theme” tab at the top left.   

The theme you are using will determine the look and feel of your website.

That, consisting of the layout, colors, styling and more. We are currently using the 2017 theme that is up to date with a header video and featured rich images. The target with this theme is on “business”.

The theme’s panel can be accessed by hovering you cursor over “Appearance” in the left sidebar, then selecting themes from the flyout.  You can edit, customize, activate, remove and install themes from this panel.

The theme that is currently activated will have the text “Active” in the lower left hand corner. If you click on a theme it will bring up more details about that theme. Such as the title, author, description and tags. It also gives you the option to make changes to your theme with links to the “Customizer”, “Widgets”, “Menus” and “Header”.

The arrows on the top, let you go through the current themes you have installed. Buttons labeled “Activate” and “Live Preview” are along the bottom. If you click on the “Live Preview” button it will bring up the “Customizer” with a ‘live Preview’.

The Live Preview lets you view the current theme you are on and make edits as you view them in real time. After you have made the changes you want, you will need to click the change button to switch your current theme to this one, and to make the edits stick.

However, we are not going to that. We are going to stay with the current theme.

The customizer on the left gives you options edit the site identity, colors, header image, background image, menus, widgets, homepage settings, and CSS. You can also make edits by clicking on any one of the pencil icons on the page. We will go over those a later on.

One thing to keep in mind is these are the options for this theme.  They may vary from theme to theme. Starting with the active theme, there is a button with “change” next to it, to change the theme. If we click it, we can then activate another theme or search the WordPress Repository for another theme to install.

When we click on “Color”, we get the choice of color schemes which are light and that’s the default, dark and custom. With custom, I am able to change the font color.  The “Header Text Color” can be changed separately.

The “Header Media” feature lets you up upload or embed a video. You can upload an image as well. You could upload multiple images for the header. Then use the “Randomize Suggest Headers” feature to have them randomly rotate.

We can add a new image or hide the current one by clicking the “Hide Image” button. As you can see, the image is now gone. Notice there it is still a copy listed under “Suggested”. If you decide you want it back, just double the image under “Suggested” and that will bring it back.

Next on the list is “Menus” and this should look familiar. We went over “Menus” in video #13. Here you can create, edit or delete anything on your website that has to do with the “Menus”.

Just like with the Menus, we recently went over “Widgets” in the last video, video #14. However, we mostly worked with the “Widgets” from the “Widget Panel” not the customizer.  We did not use this theme in the “Widgets” video, we used the 2016 theme. We are using the 2017 theme in this video.

There are some differences, for instance: “Blog Sidebar” was just called “Sidebar” in the 2016 theme. It’s still the same location, showing the widgets on the right side of the page.  In this theme we have “Footer 1” and “Footer 2” with the widget area along the bottom of the page. In the 2016 theme they are called “Content Bottom 1” and “Content Bottom 2”.

The biggest change though, is the widgets will show up on the pages and posts in the 2016 theme.

In this theme, 2017, they only appear on posts. However, if you want them on your pages there is plugin called “Page Sidebar for Twenty Seventeen” that will take care of that for you.

To use the customizer for “Widgets”, it’s actually pretty easy. Select “Widgets” from the Customizer panel. Then select the location you want to add a “Widget”. Either, “Blog Sidebar” or “Footer 1” or “Footer 2”.

Let’s start with “Blog Sidebar”. You can see the Calendar Widget has already been added. When clicking the down arrow on the right we get the options to add a Title, and then click the “Done” link when your finished. We can also delete this widget and reorder, if we had more listed. When you click the “Add a Widget” you see a list of several Widgets to choose from.

Let’s add the “Recent Posts” Widget.  To add it, simply click on it. From there, you can add a Title,  select the number of posts you want to show, and check off the box if you want the date for each post to show up. Then click “Done” when you are finished and the “Publish” button at the top of the page.

Shows a WordPress theme with text writing

To view this page from the front end, click the X in the left upper corner.  Hover your cursor over the little house and right click to Open a Link in New Tab.  Then select blog. Remember, the Widgets will only show on the Blog Page until we install the  “Page Sidebar for Twenty Seventeen” Plugin.

To get back to the Customizer, just click the “Customize” tab from the Admin Bar on top.

Your “Homepage Settings” will most likely not be set since we have not went over Permalinks yet. Under “Your Homepage Displays” make sure “A Static Page” has been ticked. Under “Homepage” there is a small arrow to the right. When you click that it will open up a drop-down menu, then Select “Home”. If you do not have a Homepage created yet, not a problem.

Click the text link “Add New Page” to add a page.  Enter in “Home” then click the “Add” button. Next, under “Posts Page”, if you do not see a page named “Blog” in the drop-down menu, repeat the above.

The “Theme Options” give you the choice of 1 or 2 columns. When the two-column layout is assigned, the page title is in one column and the content is in the other. Verses one column that has everything all together.

You can select pages to feature in each area from the dropdowns. An image can be added to a section by setting a featured image in the page editor. If you leave a page section empty, it will not be displayed.

For instance, if you want to add a new page, just click the “Add New Page” text link and then name it. I will enter in Holidays for a name. Then click the “Add” button. You will have to go back into the editor to add content to the page. But if you scroll down you can see the heading was added for the page.

Lets select the “About” page for the “Second Section” and then set a “Featured Image”. We need to go to the Editor to add a “Featured Image.  I will click the back button then “All Pages” and the “About” page.

Down to the right click the “Set Featured Image” text link. Select an image, and click the “Set Featured Image” button. Then “Update”.

If we take a look at the website from the front end you can see the “Featured Image” is in place. Let’s go back into the “Customizer” by clicking the “Customize” button at the top of the page.

We are going to jump back up to “Site Identity” because for some reason I overlooked it. You can upload a logo and add your site name and tagline. Make sure you check off the box for “Display Site Title” and “Tagline” so they show up on the page. You can upload a Favicon which is what you see in browser tabs, bookmark bars, and within the WordPress mobile apps.

Next on the list we have CSS which is short for cascading style sheets.  If you know CSS this would the place to add it. Otherwise, if you do not know CSS then just ignore it.

Finally, the “Pencil Icons” give you another way to edit the “Site Identity” where you can edit the “Title”, “Slogan”, “Logo” and “Favicon”. You can also edit the site “Navigation Menus”.

Note: This post is from our video tutorial on WordPress Themes

Make sure to check out our WordPress Beginner Tutorials Series on our YouTube Channel.

Have a Great Day!