Getting Started with WordPress

 

1. To open your WordPress Dashboard, open a new browser window and type in the URL to your new WordPress installation. If you're doing a new site and you installed WordPress in the root directory, then just type in your domain. If you installed it in a subdirectory, type in the URL, then a slash "/" then the subdirectory where you installed WordPress. For my test installation, I installed WordPress on my www.kwwtest.com site (which I use as a staging server and test site, in a subdirectory called "WPTest" so the URL I'm going to type in is http://www.kwwtest.com/WPTest

And it brings up this:

Or your screen may look more like this, if you have an older version of Wordpress:

2. That's your basic WordPress look. Actually pretty cool, but it's going to be a lot cooler by the time we're finished. Note: the screens may look a bit different depending on which version of Wordpress you're running. Now it's time to log in and get to work.

Look in that column on the right, under "Meta" for a link that says, "Log in" and click it. You should get the WordPress log in page:

3. Enter the User name and password you created when you set up Wordpress.

4. TA-DA!! It's your WordPress Dashboard. This is a snapshot of what's going on in your WordPress right now.

Now we start the fun stuff!

USEFUL HINT FOR YOU: Whenever you log into your WordPress dashboard to make changes to your site, open a second tab in your browser window, and go to your base WordPress installation in the new browser tab.. If you do that right now, the screen in your second tab should look like it does in Step 1. You'll have two tabs open in this window. One will show your WordPress dashboard and the other will show the site itself. The reason for this is every time you make a change in your site in the Dashboard, you can switch to the other tab, press the "Refresh" button and you'll immediately get to see the results of the changes you made. In the example above, I have an arrow showing where the "New Tab" option is for Internet Explorer 9 and the "Refresh" button is circled.

5. The main menu for WordPress is in that column on the left and pretty much everything you do will involve one of these options. Here's a close up of it:

6. One of the fun features of Wordpress is that you can change the look of your site easily without affecting your posts and pages, and there are hundreds of themes out there you can use. But we're going to install one that lets you customize your look so that you can create a site that is uniquely your own. To do this, click on the link that says, "Appearance." A submenu slides down from it.

7. It defaults to being on the Themes page, which is where we want to be. Click on the "Install Themes" tab at the top,

8. Where it says "Term" with the "Search" box at the end, type in "Weaver" and click "Search".

9. You'll get two versions. On the one on the left (it should say just "Weaver"), Click on the "Install" link. You'll get a screen that looks like this:

10. Click "Install Now." A few lines will roll down the screen and it should finish looking like this:

11. Click on the "Activate" link and your screen will look like this:

12. If you click on the other tab in your browser, then click the "refresh" button, you'll see that the look of your page has changed:

Now flip back to the Wordpress dashboard page.

Side note: As you might have guessed from all the options available on that Themes Search page, there are hundreds, if not thousands of Wordpress themes available. This is a good time to play around with some of them, if you're so inclined. If you want to try a few out, skip down to the section on trying out themes. If you happen to find an absolutely perfect theme and want to stick with it, that's perfectly fine. If not, once you're finished messing around, find the Weaver theme on the bottom part of the manage themes page and re-activate it, and then come back here to follow along at Step 13.

13. Let's see what we can do with the Weaver theme. Under the "Appearance" tab on the left, click on "Weaver Admin."

14. There are a lot more options here. First of all, the Weaver theme has a number of built-in subthemes, you can use. Again feel free to try these out. Scroll down the page to see the options available. See one you like? Note the name, then go to the box near the to where it says "Select a theme." Click on the down arrow beside where it says "Wheat" to see a list of the others. Find the name of the one you like and select it, then click "Set to Selected Sub-Theme." I chose "Reds."

Change to the other tab, click "Refresh" and... Whoa!

15. Weaver can do a lot of other tricks as well. In fact, you can control, just about every facet of that design by clicking on the "Main Options" tab:

Look at all those options on the page. You can also go to "Header Options," "Content Area" etc, for more options. We'll talk about these at more length later in the class, but this is a good time to play around with them right now. Try changing a couple of things, then switching to the other tab and hitting "refresh" to see what kind of effect it had.

16. One more thing to show you with Weaver, then we're going to create a couple of very simple test pages, just to have a couple there. We'll talk more about pages and posts later in the class.

For now, though, Weaver also provides lots of Header options. Click on the "Header" link under "Appearances":

Scroll down and you'll see other banner options. I think the mountain scene goes better with the red theme, so I'm going to click in the button beside that header bar, scroll down and press "Save changes." Change to the other tab, click "refresh" and voila! (Note that the header page also has a place where you can upload your own header. We'll talk more about that later.)

Now is a great time to play around with this as much as you want. And if you happen to come up a set up that's perfect for you, wonderful! If not, we'll do more exploring in later lessons.

17. Now, let's add a couple of pages to your WordPress site so that menu bar doesn't look quite so empty, maybe a page called "About Me" and one called "Books". If you click on the "Pages" link on the left side, you'll see the column slide down, a new option for "Add Page" appear and the screen will show you the pages that already exist. Note that there is only one page right now called "Sample Page."

18. Let's leave the sample page alone and click on "Add New" on the lefthand side:

19. In the "Add New Page" page, you'll see a line at the top for the Title and then a bigger box below for text. For now we're just creating a couple of sample pages, so we're not going to do a lot of text. Later in the class we'll come back and talk about the content of your site and I'll talk about editing the pages and adding real content. For now though, I've typed "About Me" in the title box and then in the content box, I typed in "This is the page where I'll put my bio information and maybe a picture later."

20. To make the page live, I'll click the blue "Publish" Button. The page that comes up after you press the "Publish" button will look similar, but at the top it will say "Edit Page" instead of "Add New Page." We've added the page called "About Me." Now go and click "Add New" again and create a page called "Books" with some kind of dummy, placeholder text. I'll wait. Once you've got both pages set up, click on the "Pages" box. You should see this:

21. You should have three pages showing now. If you switch tabs to look at the site itself, and click "Refresh" you'll see there are now four options showing on the menu bar. Click on one of them and you should see the dummy text you typed in.

That's been a big chunk of material for this lesson, but I hope you'll have fun with it!

 

Trying Other themes

It's easy to install new and different themes in WordPress, and it's really easy to change them out, try another, etc. To start, cilck on the "Appearance" button on the side menu.

Wordpress gives you several ways to search for new themes. Let's try searching on a color. I like blue, so I've checked in and pressed the button down at the bottom that says, "Find themes".

Wow, pages and pages of neat looking themes. Pick one. I scrolled down a bit to find this one on the first page and clicked on the "Preview button"

Not too exciting, but I kind of like it, so I clicked the little "X" in the upper left hand corner, then clicked on the "Install" button below below the small picture for this theme. When you do that, you get another popup, but this time it will have a box that says "Install now" on the popup. Click on it. Once it's installed you should get this familiar looking page:

Note: Installing is not the same as activating a theme. Installing it just makes the theme available for you. We'll get to activating it in a moment.

First, though, I'm going to go looking for another theme, so I click the link that says "Return to theme installer" I checked "Purple" this time and found another interesting them and installed it. Now when I go to the "Manage" themes tab, it still shows me the default theme is installed, but it also shows those other two themes are available below.

Scroll down a bit to see the "Preview" and "Activate" links under each theme.

When you click "Preview" it will show you what your site would look like with this theme in a popup like the ones that showed you the preview of theme before you chose it. You should see those new pages you created earlier somewhere in the preview. Pick one of them now and click on the "Activate" link to make it your theme.

21. When it's done, you'll see that the theme you just activated is now the current theme and it's moved the default theme down under "Available themes"

Now, click on that other tab you have open with the site itself and click the "Refresh" button. Viola! There's your site with the new theme.

Not as great as you'd hoped? Try another one. Install a few more themes and activate them. Have fun! It's play time. Feel free to add more pages and watch what happens. Try out different themes. Add more. Delete any that you don't like. Since this class is going to concentrate on using the Weaver them to create a more personalized site, I recommend that you re-activate the Weaver theme now and click here to go back up to Step 13.