Join Joseph Lowery for an in-depth discussion in this video Activating a theme, part of Dreamweaver CC and WordPress 3.8: Core Concepts.
In this lesson, I'll show you how to work with different themes in WordPress, completely altering the look and feel of your blog with just a quick click. A WordPress theme controls the layout as well as the styling of a WordPress site. There are a great many WordPress themes available and customizing one is a terrific way to learn how WordPress works, as well as developing your own custom site. But before you can gain access to the theme, you'll need to activate it. Let me show you how that's done. We're going to start in the WordPress dashboard and we'll expand the appearance category over on the left hand side.
There you'll see the first item, Themes. Let's click on that. Here you see the themes ship by default with WordPress. 2012, 2013, and the currently activated theme, 2014. These themes are said to be installed because their files are located in a specific location among the other WordPress files. Now for a quick demo of how themes change everything, let's look at the previous default theme, 2013.
I'll hover over its thumbnail, and then just click Activate. This makes it the current theme and the previously current theme, 2014, now becomes, just available, but not activated. So, let me show you what this new theme looks like, by going to visit the site. Well as you can see it's a completely different color scheme with a different organization as well. This theme also shows you how headings are handled quite differently as well as the text and even all the way down to the side bar which is not on the side but at the bottom of the page.
And below that where it says, proudly powered by WordPress, is the footer. Now, let's take a look at our existing content for the Roux Academy site in the theme. I'm going to scroll back up, and there you can see a little bit of it. I want to go up to our Conference Schedule At A Glance page. And then, scroll back down a little bit. And well, you know, I think it looks pretty good sitting there, especially with that big comment box and the sidebar down below. As you can see it's really a different style from top to bottom. Now there are a tremendous number of WordPress themes available, it's actually become a cottage industry for many developers.
To get a sense of this wide world of themes available let's go back to themes in the dashboard, and we can get there pretty quickly by going up to Roux Academy>Themes. To generally search for a new theme click Add New. This opens up the Install Themes page. Now we can search by keyword, or any of the other filters that you see here. Let's go ahead and check out Featured. As you can see, there's a nice range of different looks and feels. And it includes a couple of the default themes, as well.
Let's check out 16. When you click on the thumbnail of an uninstalled theme, it shows you a preview of it. The preview doesn't use our content But its own content. To see your own content, you would need to install the theme. So, let's try that. I'll click Install. Now once it's been installed, I can either go ahead and activate it or just check it out in preview. Let's click the live preview. And let's look at Conference Schedule at a Glance. Well, it's very stylish, but it's not exactly what we're looking for.
So, I'm going to go ahead and click Cancel. Now I want to show you another way to bring a them in, and along the way, introduce you to the simple theme that we're going to be customizing to create our site specific blog. So I'm going to return to the theme installer and then from there click Upload. This section will allow you to install, preview, and activate any theme that you may have saved locally. Themes are stored as ZIP files so were going to begin by browsing for our zipped theme by clicking Choose File.
And we're going to navigate to my exercise files that are on the desktop, open up chapter 4 0402 and there you'll find custom.zip. I'll select that file click Open and then back in WordPress click Install Now. Once it's installed I'm going to go ahead and activate it. But you can tell by the thumb nail, this is a very stripped down theme, that was created from scratch. If you're interested in seeing how that was done, check out my previous course on lynda.com, Dreamweaver and WordPress, Creating Themes.
Let's take a quick look at the site, with this theme applied. As you can see, it's very bare bones. Which makes it ideal for applying your own custom look and feel. Now, you may be wondering how themes fit into the overall site structure. Let's head back over to Dreamweaver so you can see exactly how it works. In Dreamweaver, I'm going to expand my Files panel here. Let's really expand it. Now I have the blog folder already opened up, which you'll recall of course is our WordPress folder, and inside of the blog folder is another folder called wp content and then within that is yet another folder called themes.
When you expand that one, you'll see it includes an index.php file and a number of subfolders, each of which contains a single theme. There are the three default themes as well as the two themes we brought in, 16 and custom. When you're first working with WordPress, you'll probably download and try out a bunch of themes just to see what's available. That's fine. However, there will come a time when you want to remove any unused themes, especially when you're turning over a custom site to a client.
You can, via the themes area in WordPress, delete any unwanted themes. Let me show you how that's done. So let's go back to our themes in the dashboard. So if I click on a theme thumbnail, over in the lower right hand corner, I'll see a delete option. So you can always delete a theme from within WordPress. But sometimes when you're working, especially with DreamWeaver, and you've amassed a great number of these, it's better to do it directly from DreamWeaver. So let's go back to Dreamweaver with our files panel and the way you get rid of it from here is simply to select the folder of the theme that you don't want and press Delete.
Now when I go back to WordPress after I click refresh, the theme 16 vanishes. So that's basic theme management. And now that you have that under your belt, you're ready for the next step. Child Themes.
- Setting up WordPress locally
- Establishing your Dreamweaver CC site
- Adding and editing posts and pages
- Customizing WordPress themes
- Building responsive layouts
- Extending WordPress editable pages
- Using and styling WordPress plugins
- Integrating jQuery functionality
- Publishing your WordPress site with Dreamweaver
- Personalizing and enhancing WordPress
Skill Level Intermediate
Author update on April 4, 2014:
WordPress 3.8.2 is now available from wordpress.org. The update focuses on security issues and should not impact this course in any way. A much bigger release, 3.9, is currently a release candidate and will likely go live later in April. I'm currently evaluating what impact v3.9 will have on this course.