Style Your WordPress Blog

Once you’ve set up your WordPress blog it’s time to get it looking just the way you want it.
The first step in doing this is selecting a "theme" and then customising it. In this tutorial I’ll walk you through the steps I took but if you want fuller information, then take a look at WordPress’s own theme support page or you can take a look at their video

The Dashboard

the_dashboard5.png

This is the "behind the scenes" bit of your blog and you’ll probably spend a bit of time here over the next few years! Only you can see this (but bear in mind you can give other people permission to contribute to your blog, which is useful for setting up group blogs for team-based projects)

I won’t go in to too much detail on the dashboard here – WordPress has lots of online help available to find out how to moderate comments, add polls and so on.

You will see that you already have one post and one comment on your blog and that your blog has a "theme" (Twenty Ten)

A post is an article that you write and add to your blog. A comment is something that someone writes on a post. You can disable comments, or "moderate" them, which is a way of approving them before they appear. You can also delete comments later. This might become important if your blog gets lots of followers or spam. For now, though, you can probably leave comment settings as they are.

Another tutorial will show you how to create posts (but it’s actually really easy and you can probably work it out for yourself). For now we’re going to edit the look of your blog so click on your blog’s title at the top of the dashboard.

Your blog – boring, isn't it?

your_blog_-_boring__isn_t_it5.png

This is the default blog. It’s pretty dull. Fortunately you can change things either by applying a new "theme" or creating your own.
Let’s take a look at the main elements of the page so you can get a hang of some of the terminology we’ll be using later.

1. Mini dashboard. So long as you’re logged in to WordPress you’ll see this at the top of your blog. You can quickly access the full dashboard from here, or edit the existing page or create a new post. A page can contain more than one post.

2. Blog title. This is what you chose in one of the earlier steps. You can change this via the dashboard, or replace it with a graphic (which is slightly advanced so I won’t show you how).

3. Banner. This appears at the top of every page. There are ways to change this so it looks different on different sections

4. Navigation bar (or navbar). Your blog can have different sections (see Johanna Basford’s blog for example – one page can be a blog, another page could be a portfolio of your work, and so on. For now you automatically have an "about" page". If you want to expand your blog, it’s a good idea to draw a diagram of what you will have.

5. Page/post title. This is the title you give your page or blog post.

6. Post. This is the text of your blog entry.

7. The edit link only appears while you are logged in to your blog. Clicking this allows you to edit your post.

8. Comments section. This is where readers can add their comments.

9. Your blog description or "tag line". All WordPress blogs have the same description by defaul. I’ll show you how to change that later.

10. Sidebar. You can edit what appears here but by default you have an archive of previous posts and a list of categories. I’ll explain how to use categories and tags in another tutorial. The "Meta" menu allows you to log in to the site etc. You may want to hide this later when you know how. You can add other sidebars and widgets when you get a bit more confident with WordPress.

Changing your "About" page

changing_your_about_page5.png

We’re now going to change the two main features of your blog. First, let’s look at the "About" info.
Return to your dashboard and click on the "Pages" button on the right hand sidebar.
Pages are the sections of your site. You can add and remove them here. At the moment there should be just one. Edit it so that it gives a bit of information about you.
You can upload images here, or movies, and you can format your text using bold, italic, bullet points and so on.
Don’t go overboard here – keep it simple. If you understand HTML you can click on the HTML button to get into the code but if you’re not sure what you’re doing, or you want an easy life, stay on the "Visual" page!

It’s a good idea to turn comments off for this page, after all you’re just telling people stuff about yourself, not trying to get their opinion.

Don’t forget to change the title of your page as well. "About William Hogarth" or "More about me" or something.

When you’re happy you can clcik the blue "Update" button, or use the "Preview Changes" button to take a look before committing yourself. But note that no one will see any changes until you press the blue button.

Changing the theme

changing_the_theme5.png

Time to make your blog look a little nicer. Designing WordPress themes is pretty complex so my advice is not to bother until you’ve got a spare month or so. Your best bet is to use one of the many free templates which range from excellent all the way down to "you’re kidding me, you really thought this looked good?" There are also some companies that sell themes and some of them are very good indeed – well worth a look if you want to establish a professional-looking web site, but for now that’s something you can think about later.

In the dashboard click on "Appearance" in the sidebar and then "Themes". You’ll be presented with list of free themes that WordPress is hosting for you.

Preview a theme

preview_a_theme5.png

Click on a theme to see a preview of your blog using that theme. Because you’ve only just started, there won’t actually be a lot to see so it’s not easy to get an idea of how the theme will work. Remember you can always change your mind later so don’t worry too much. The theme in the picture looked okay but now I see it "in the flesh" I’m not so sure.
When you’ve selected a theme you like, click the "Activate" link in the top right hand corner

Making your mind up

making_your_mind_up5.png

I went with the Modularity Lite theme for now.

Creating a custom header

creating_a_custom_header4.png

You can upload your own image to use as your page header in most themes. The "Custom header" page will tell you the size of the optimal header in pixels and this measurement is what you should use if you’re creating something in Photoshop or Illustrator. Alternatively you can upload a photo and WordPress will let you crop it to the right size. It could be a photo of you, or of one of your designs, for example. Be arty! Make it say something about you or your work or interests. (i.e. don’t show a picture of you and your boyfriend, or your pet hamster, unless you’re making an ironic statement).
You don’t need to add text and, as always, you can change it later.

Adding new sections

adding_new_sections5.png

I mentioned earlier that "pages" were sections of your blog. This can get a bit confusing so let me try to explain it a bit more clearly.
Your blog on WordPress is a web site. The "blog" part of it is the main bit and currently it sits under the "Home" button. If you look at your blog now you’ll see "Home" and "About" or whatever you changed its name to.
Your blog can have as many sections (or "pages") as you want. For example let’s say you are a textile designer who likes taking photographs and travelling the world. After sitting down with a bit of paper you’ve decided you want your blog to have separate sections for your textile work, your photography, and your travel journal. Add your actual "blog" (think of it as your news or thoughts page) and your "about me" page and you’ve got five sections. You add those to your blog using the "Pages" button on the dashboard.

In the image above you can see I’ve got just one page, the "About Design Studies" page I edited earlier. To add a new page, just click "Add New".
I’m going to add a new page called "My portfolio".

Editing your new page

editing_your_new_page5.png

This next screen is basically the same as the "about" page we edited earlier. Unlike your blog, you don’t add posts. This is a "static" web page that you build up as if you were designing it in InDesign or Word. I won’t go in to too much detail here because one of the powerful things about WordPress is you can use "widgets" to add things like slideshows or "lightboxes" to display photos or scans of your work. This tutorial is about creating the blog so I’ll leave that for now, but feel free to look at the widgets and experiment. If you do something wrong, you’re not stuck with it and you can always delete a page and start again!

Editing posts

editing_posts5.png

There’s a separate tutorial on creating posts elsewhere but for now let’s just change the default blog post that WordPress created for you when you set your blog up.
Click on "Posts" in the dashboard and then on "Hello world!" to edit the post that’s already there.

media_12799054100635.png

There’s lots to take in here and most of it will be covered in a separate tutorial. For now, all you need to know is 1, 2, 3.

1. This is the title of your post. Take special note of what I’m about to say. Never, ever, write a blog post without a title! For some reason, most students in previous years decided to write post after post with no title. That’s like reading a newspaper where the articles have no titles. Always give it a title, otherwise it will either appear as "untitled" or have the first line of your post as the title. Most unsatisfactory.
For now, change the title from "Hello World" to something else, more appropriate. This is your first blog post so make it interesting but short and sweet. You can always delete it later when you’ve got something interesting to say.

2. This is the post itself. Write some quick introductory text here about what you hope to use the blog for. Top tips:
never say "we’ve been told to start a blog". This may be read by people in industry. and no one likes a whinger.
Remember your audience. Who are they? Not just your tutors and friends, but people all over the world. Write with them in mind.
Check your spelling – if spelling and grammar aren’t your strong points, write your post in Word and run the spelling and grammar check.
See the button with the green tick and "ABC" on it? That’s WordPress’s built-in spell checker. Use it!
If you want to, upload a video entry rather than text – if you’re happy to explore the functions, then do. It’s your blog!

3. Decide if your post is going to have comments or not. Usually this should be checked by default, but there may be reasons why you don’t want comments sometimes.

When you’ve made your changes, click the blue "Update" button.

Changing the tagline

changing_the_tagline5.png

Remember earlier when I pointed out that your blog’s tagline is "Just another WordPress.com site"? We’re going to change that now.
Go to "Settings" in your Dashboard and then "General". Change the tagline to something interesting, short and sweet. It could be "Contemporary jewellery from Scotland" for example. Be quirky if you want, if that’s part of your personal "brand", but don’t be silly. Your blog is an important tool for networking and getting work, particularly as you approach graduation, so start as you mean to go on.

While you’re in the settings you can change things like your timezone, how the date is formatted and so on. Bear in mind if you’re from the US or China, you may want to change the date settings here to reflect how these things are done in your country – or change them when you return. You can change the default langauge here if you didn’t do it earlier.

Changing your blog icon (advanced)

changing_your_blog_icon__advanced_5.png

You don’t have to do this, but you can add a blog icon on the settings page. The icon is a square image that will appear in the browser bar. It’s a nice touch that can add to your brand image. Choose something interesting or create a special icon. You can crop it down when you upload the image. It will take a while for it to appear across your blog and you can of course change it later.

And that's it!

and_that_s_it__15.png

You’ve now set up your WordPress blog! There’s not much there now of course but over time it will build up.

As you get used to the idea of posting you can come back and make changes to the template, add a different banner or even get more advanced and use different templates for different pages.
Draw a diagram of your blog showing the different sections (pages) you want to add and make a plan to add the. Visit other WordPress blogs to get ideas for things like slideshows and lightboxes, and look at different widgets that are available for things like "blogrolls" and Twitter feeds.
We want you to take ownership of your blog. Let it be not just a record of your university studies but of other things too – your photos, drawings, projects, journeys. By the time you graduate it should not just be a repository of your best design work but a scrapbook of your time at DJCAD – a useful tool for you and for people who may want to commission you or employ you.

In other tutorials I’ll show you how to add links to posts, embed Youtube videos and so on, but why not see if you can figure these things out for yourself? Work with someone else if you want and don’t be afraid to ask someone who knows what they’re doing for help and advice. And if you are the person who knows what they’re doing, offer to help others!

Watch a video on choosing a theme

This video from WordPress shows you more about choosing a theme.

About these ads

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s