Using WordPress to create a website (rather than a blog)

1. Using WordPress to create a website (rather than a blog)

2. Use pages not posts • Blogging software is set up using the model of “posts” – these usually appear in reverse chronological order and show dates, comments etc, with the most recent on the “home page” • To create a website, you will not be using posts – instead you will use PAGES • In this way, you can create a static home page for your organization (scroll down for video)

3. Starting from the beginning • You should already have signed up for WordPress (see instructions for Week 7) and have been exploring and trying a few things out • Once you have completed your wireframes and your plan you will create a new blog – this is the one you will use for your project • You can create as many blogs as you like from your account • Go to Dashboard > Manage My Blogs at the bottom right of the page you will see a button Register Another Blog

4. Preparing your WordPress site • Go to the Dashboard for your new blog • Select Appearance > Themes. Install the Theme that you selected in Week 7 • Select Posts. Delete the post called “Hello World” by clicking the checkbox and selecting Trash • Select Pages. Delete the “About” page (or any other page you find there) by clicking the checkbox and selecting Trash • NOW USE YOUR PLAN TO CREATE YOUR SITE

5. These elements make your website look like a blog and need to be removed – the next few slides show you how Remove Comments Box Remove Sidebar contents

6. Adding your home page plus your other 5 pages • Go to Dashboard >Pages > Add New • In the Title box, add the name of your first page • In my example Garden Sense (yours will be the name of the home page from your plan) • Under Page Attributes > Template (on the RH side of the page) select the layout that you want for the page (sidebars etc) • Scroll down and remove the checkmarks from the Discussion area to prevent comments (if you don’t have this box on your Theme, see the next slide) • Publish your page by clicking the Publish button Add your other 5 pages in the same way (following Steps 1-5 above), giving each the relevant title from your plan (you can, if you wish, have a different layout for your home page and your secondary pages) Don’t add any content to your pages at this point – just concentrate on establishing the skeleton for your site

7. Removing the comments box from your pages (if you haven’t already done so) • Go to Pages > All Pages • Select your home page again and go to Quick Edit. • Remove the check mark from the Allow Comments box • Click Update • Repeat for each of your Pages

8. Customize your settings • From the LH sidebar menu of the Dashboard go to Settings > Reading Settings and click on Front Page Displays >Static Page then select the name of your home page (Garden Sense in my example) • Go to Settings > General and change the Site Title to the name of your organization. Either delete the Tagline, or add one that is appropriate for your site • You can also change the header image, but we will get to that later • View your pages by clicking on the name of your site at the top of the screen

9. Removing unwanted widgets from the page sidebar • From the LH sidebar menu of the Dashboard go to Appearance > Widgets • Remove all the widgets from the right-hand sidebar by dragging and dropping them to the left into the main area of the page • You may want to add Widgets later, but for now your objective is a blank canvas! • View your page to make sure the sidebars are empty • Sometimes widgets show up on your page that aren’t listed under the sidebar on the Appearance -> Widgets screen • If you can still see content in the sidebar when you view your page try dragging a blank Text Widget into the right-hand sidebar • For more help on this look at http://en.forums.wordpress.com/topic/remove-meta-from-sidebar

10. Adding “child” pages (if applicable) • On my site map, I have shown that the page Woods We Use is accessible only from the Garden Furniture page • In WordPress we can create this page in the same way as the Garden Furniture page, but with one additional step • In the Page Attributes, select the “parent” page • Click Update • Your page navigation will now show the child page in drop-down menu (your theme may differ slightly)

11. Navigation bar and “Menus” • View your site (using the link in the top menu bar) • Your navigation bar items (the same as the titles you entered earlier) will appear in alphabetical order, rather than the order that you showed in your plan • From the LH sidebar menu of the Dashboard go to Appearance > Menus and use the tool there to create a custom menu with the items in the order that you wish (this will also get rid of the additional Home link that sometimes appears in the navigation bar)

12. Step 1: Name your menu Step 2: Select it here Step 4: Rearrange your navigation bar elements here by dragging them into place Step 3: Select the pages for your navigation menu and click Add to Menu Step 5: Click Save Menu

13. If you have an extra Home page in your navigation bar do this in the Edit Menu screen: Click the down arrow next to the page you want to remove from your menu - this will open up more choices. Click Remove

14. Adding a header image • Most themes allow only one header image – so it will be the same on all your pages • From the LH sidebar menu of the Dashboard go to Appearance > Header • Upload the image you have prepared (you will need to check the size for your particular theme) • You can crop the image to fit using WordPress, but it is better if you have prepared it earlier, along with your other images • You can also add/remove Header Text to/from the image if you wish

15. Checkpoint: before you add any content make sure your site has: • 6 pages including your homepage (no content at this point) • A custom navigation bar showing the navigation links in the same order as on your plan • A blank sidebar (no comments, meta, etc) • A custom header image • A custom tag line (or none at all)

16. Adding content to each page • To add content, you just Edit the page • Click on Pages and you will see a list of all the pages in your site • Select the page you want and click Edit • You can edit a page as many times as you want to, so there is no need to worry about getting it perfect on the first try • You can edit using either / both the Visual and Text toolbars (see next slide for illustration)

18. Adding images to your pages First resize your images (use a tool like pixlr.com or the image editor of your choice), then in WordPress: • Open the page you want to Edit • Click on the Add Media button (camera icon) • Upload the image • Add the Alternate Text (from your plan) • Use the align controls to position the image on the page • In the Size options select Full Size • Click Insert into Post See illustration on next slide

20. Adding content • Add all of your content – remember you can edit your pages at any time • Use the Text Widget to add text or images to the sidebar (you can use html to add these) • If you want to remove the Like and Share buttons from your pages scroll down in edit mode and uncheck the relevant boxes • See the Tips and Trick slide deck (Week 9) for information on making text into clickable links, adding a YouTube video, and embedding a Google Docs form