01Mar Web Design on AutoPilot
Lesson #9: Web Design on AutoPilot
We have completed the most important step – getting our website actually installed. So your site is setup and ready to go, but letʼs be honest, itʼs kind of ugly. Our goal with Lesson 9 is to solve this problem. We will now review the process of how to install a new design. By the time we are finished, you should have a much sexier website than you do right now.
How to Install Themes
WordPress makes it super easy to install new designs. Once you have logged in to your admin panel, click on the Appearance tab on the left. From there, you will see all of the themes you have installed right now (should just be two). At any time, you can switch between any of the themes that show up on this page by clicking the activate button.
Now, click on the Appearance > Install Themes tab at the top to see options for adding new designs.
Here, I want to direct your attention to the top of the page. There are links for Search, Upload, Etc. The first option (search) allows you to automatically install themes that you find while searching through the directory. You are welcome to find your theme this way. Next, if you click on the Upload link, you can install a theme that you have downloaded to your computer from another site (which is most likely). For now I just want you to be aware of these two options. Search for a theme and install automatically, or download a theme from another site and come back here to upload it into WordPress as a zip file. Got it? Good.
If you would like extra credit, use the search option now to find any random theme and click install. Once you see the confirmation that it is installed, go to yoursite.com and view the new theme. You can always switch back later so donʼt worry what the site looks like now. Just try practicing how you can switch back and forth between different designs.
Option #1: Free Themes
First, it would be totally acceptable for you to use the default WordPress theme (the first one you saw with the blue header right after you set everything up). Just make sure that the header area has the right text, you can even change the color of the blue part under the appearance menu. This is a legitimate option and I have seen it work very well with some sites. If you do not feel like tinkering with other themes and designs, just use the default and call it a day. That will work for the type of site we are building, I promise. If you want to do that, you can skip all the way to the bottom of this lesson to the section on headers and logos.
But if that default design just does not work for you, if you are looking for something even more in-depth, and if you are feeling brave…
There are thousands of free wordpress themes as you can see by searching through the database. And in many cases, one of these will fit your site just fine. If you would like to use one of the themes that you found by searching, just follow the instructions above about installing a theme and you are essentially done. Remember what was said in Lesson 7 about keeping it simple, though. Donʼt get carried away with fancy themes, choose something fairly plain and easy to read. If you want to spice it up, consider using a simple theme but ordering a custom logo or header (see below).
On the other hand, there are thousands of other free themes that are not available in the search area. You can download these themes to your computer and re-upload them into WordPress. Simply doing a google search for “Free WordPress Themes” or something similar will give you thousands of great resources. Remember, if you download one of these, you will need to save it to your computer (must be a zip file). Then, login to WordPress, go to Appearance > Install Themes and click on the upload link at the top. Your new theme will be installed.
Option #2: Using a Paid Theme
All of the options above work well, and I have used them myself on many occasions. But there is one paid theme that will make your life 1000x easier. Itʼs a theme that gives you tremendous flexibility to essentially design your own site. You install the basic template, and it adds a whole new design section to WordPress with options to easily change every element of the page. You can alter the layout, change the colors, swap font types/sizes, upload logos or headers, and more. All with the click of a button.
This theme is called Canvas and it is clearly the most powerful and easy way to create something custom on your own.
Plus, once you purchase this theme you are free to use it again and again on any other sites you make in the future. I use this theme for every site that I build now.
Canvas comes from a site called WooThemes, which also has 50+ other premium themes that you may also want to consider for your site as well. But again, donʼt get too fancy with these, something simple and elegant like Canvas is probably your best option.
If you would like to read more info on Canvas and see a few demos of what can be done with this theme, check that out here: http://tinyurl.com/zzz-canvas
Purchasing and Installing Graphics
For many of the themes you may use, they include a text-based logo that will automatically update to match your siteʼs name. You can see this on the Canvas demo above, where it says Canvas at the top, you can edit that to match your siteʼs title. In many cases this works fine. But if you want your site to have some personality and some flare, I definitely recommend purchasing a logo or a full graphical header. I also believe that a nice header will improve the revenue you can generate from your site, because visitors tend to “stick” on these sites more often (as opposed to leaving immediately before reading anything).
I typically purchase logos from LogoNerds. They cost just $27 for a complete logo (with several custom-drawn design options) and full graphical headers are only $17. If you can afford $17-27 I would definitely recommend purchasing a logo or header.
Click here to see LogoNerds: http://tinyurl.com/zzz-logos
Most themes (like Canvas) offer the option of automatically loading and installing a logo/header from the WP admin area. Make sure your theme supports this before you purchase a logo or it might be difficult to get it installed right. If you do run into any problems, feel free to shoot me an email and I’ll try to point you in the right direction.
Our next lesson will cover a few final things you need to do with your site before you can say you are “done” but here we need to discuss a few more design elements within WordPress. Specifically, widgets.
You may have noticed on the left menu under Appearance that there is a widget page. Letʼs take a look at that now. Widgets are different things that will appear on the sidebar of your site.
The cool thing about WordPress is that you can add, delete, and re-arrange these however you want just by dragging them from the middle to the right. Try this out to see what I mean. Notice how whatever is showing under the widgets area on the right will mirror the sidebar of your actual site.
Here is a listing of what I recommend you add in your widget sidebar:
• Recent Posts (set the number to 10 or more)
• Text (customize this with a short “About this site” blurb)
• Text (place your advertising code here – more on this in later lessons)
That is just my list – not the law. Feel free to play around with this and see how everything looks on your particular site.
Previous Lesson: One-Click Web Development
Next Lesson: Polishing Off Your Awesome Site