From Spaces to WordPress step by step. A Theme with a Menu.
October 6, 2010 2 Comments
6. Choosing a Theme with a Menu.
1. In this post, we’ll change our theme again to another one, this time stipulating different features namely the inclusion of a Tabbed Menu for our readers to be able to access across the top of our Header. Firstly we’ll be uploading our own header into our theme and changing the background with our own. choice. So we need a theme that contains, Custom Menus, Header and Background. These are the features by which to conduct our theme search. From your WordPress Navibar, click on My Blogs, then select Dashboard as before and then Appearance, Themes.
2. This time we are going to search using different criteria, so click on Feature Filters and then from that window of choice of Filters tick the Custom Menu. Custom Background and also Custom Header and then click on Apply Filters.
3. There are actually a total of fifteen different themes that fulfil our chosen features, including the default theme Twenty Ten and my current Photo Theme Modularity Lite as well. However, for the purposes of these how-to’s and because it is the default theme that you will all have been given when porting over here from Spaces, I’ll show you have to customise Twenty Ten.
Choosing your own Header.
4. To choose your own personal header, click on Appearance from the Menu sidebar in your Dashboard, and then click on Header from the drop down under Appearance. In Twenty Ten there are quite a few attractive headers already offered to you, but as we want our blog to look pretty unique, let’s upload our own picture.
5. Click on Choose File from the Custom Header page. TIP! If you have any Panoramic shots that you have made with Windows Live Photo Gallery, these are ideal to use as headers! A window will open allowing you to choose an appropriate picture from your files to use as a header.
6. When you have chosen your photo or picture, click on Upload.
7. Next, you will be asked to crop the chosen picture to a set size. The size of the header area will depend on which theme you have chosen to use. Because my how-to demo theme is called Spaced Out, I have chosen an outer space header. When you have completed your crop, click on Crop and Publish.
Choosing your own background.
8. Next, let’s choose our own background in order to make our Twenty Ten theme look really unique. TIP! I have found by trial and error, that unfussy backgrounds tend to work best, as then they don’t detract your readers eyes away from the blogs contents. If you need some backgrounds, do a Google or Bing search for Backgrounds. Another tip that I have also found is the larger the background you choose in pixel size, the better, then their is no need to tile it as it should fill the width of the whole screen.
9 From the Appearance list in your Menu Sidebar, click on Background.
10. As with your header, click on Choose File from the Custom Background page.
11. Again, a window will open showing all the files on your computer so that you can choose a suitable picture for your background. When you have chosen a picture file, click on Upload.
12. Once your picture file you intend to use as your background has been upload you are then offered some Display Options. If your chosen picture file is only small in size, then you may have to choose to Repeat it in order to fully cover the screen area. You can choose its position either Left, Right or Centre and also choose whether or not it scrolls down or is Fixed.
13. If your background does not fully stretch to the sides of the screen, then you can also choose a complimentary colour for the sides if you wish by clicking on Select a Colour.
14. Click on Save Changes when you are happy with your background choice, and then click on Visit your Site from the yellow bar at the top of this page to see how it all looks. Don’t forget to scroll down to check that your background fills the entire blog area. If it cuts off short, change the scroll choice to Fixed.
15. f you can’t find a suitable background image to use, you can simply change the background colour instead. To do this, from the Display Options, click on Select a Colour, choose a colour for your background from the colour wheel, and the chosen colour will show in the Preview area above. I usually try and choose a colour that is featured inside my chosen header so that everything matches up and looks attractive. Click on Save Changes and then Visit your Site to see how it all looks.
In the next posts, we will compose a page (using Live Writer no less!) , and also construct our Menu tabs along the top of our Blog’s header.