1

Community Group Blogs

Supporting Documentation

2

Contents

Creating an email account/address .................................................................................................... 3

The difference between wordpress.com and wordpress.org – in a nutshell ..................................... 5

Wordpress.com ............................................................................................................................... 5

Wordpress.org ................................................................................................................................ 5

Signing up to Wordpress.com ............................................................................................................. 6

Creating your blog ............................................................................................................................... 8

The Dashboard ................................................................................................................................ 8

Themes ............................................................................................................................................ 9

Widgets ......................................................................................................................................... 11

Creating posts ............................................................................................................................... 12

Creating pages............................................................................................................................... 13

The difference between posts and pages ......................................................................................... 14

Posts .............................................................................................................................................. 14

Pages ............................................................................................................................................. 14

Blog structure .................................................................................................................................... 15

Changing the homepage ............................................................................................................... 15

Ordering of pages .......................................................................................................................... 16

Displaying posts on other pages ................................................................................................... 18

Extra Features ................................................................................................................................... 22

Google Calendar ............................................................................................................................ 22

Google Calendar as a widget ......................................................................................................... 24

Flickr .............................................................................................................................................. 25

Useful links ........................................................................................................................................ 28

Next steps – maintaining and developing your site .......................................................................... 29

Who will visit your site? ................................................................................................................ 29

What will your site contain? ......................................................................................................... 29

The golden rule ............................................................................................................................. 29

3

Creating an email account/address There are many options when creating a free email account, two of the most popular are Hotmail (https://www.hotmail.com) and Gmail (provided by Google). Because of the other features available as additions to the blogs we will be creating, Gmail is probably the most convenient option. Below are some basic instructions for creating a Google account (this will give you access to all of Google’s other features, which will be discussed later in the Extra Features section). Navigate to https://www.gmail.com/ in your internet browser, such as Internet Explorer or Firefox (or click on this link to open the address directly), and you will see the page pictured below.

Click the ‘Create an account’ button, and you will then see the form below.

4

If you are creating a group email address for the blog, you may enter the group name as your first / last name in these fields. The Desired Login Name will become your email address, when coupled with “@gmail.com”. It is best to choose something unique to you, or alternatively the group name if you are creating an email address specifically for correspondence related to the group/blog. Please make a note of this as you will need to remember it. It is important to have a narrow security question if the address will be known to the public, as someone may be able to gain access to the account if they know the answer to this question (try not to make it too well-known, or closely related to the community group). You should only fill in the Recovery email field if you already have another email address, as it will be used to send a new password for this account if you forget it. Please read the Terms of Service carefully before submitting the form.

5

The difference between wordpress.com and wordpress.org – in a nutshell

Wordpress.com Wordpress.com is a free service which can be created by anyone with an email address, and is used entirely within your web browser (e.g. Internet Explorer or Firefox). The content that you upload and post is saved by Wordpress itself, and so is unlikely to become unavailable due to high demand, and is backed up automatically so will not be lost. Your site is kept secure and up to date with current software upgrades, and spam is filtered out automatically (this can be customised easily at any time). Wordpress provides more than 100 themes for use within its free blogs, and they each have customisations available to them, but it is not as flexible in terms of design as a wordpress.org blog. You are also unable to use plugins with wordpress.com blogs. Plugins are additional extras which add functionality and sometimes link to social networking sites such as Facebook. Things such as linking to social networking sites are still possible on these blogs, and instructions for doing so can be found in the ‘Extra Features’ section of this document.

Wordpress.org Wordpress.org is used by those experienced with website hosting and maintenance, and requires the purchasing of a web hosting package from a provider, usually at a cost of around £5-£10 per month, and install Wordpress yourself onto this. Your content will not be backed up unless you arrange for this to happen, and if there is a rise in visitors to your site then it is likely to become unavailable if the hosting package you have purchased cannot meet this demand. This is the option for those who wish, and have the technical ability, to make greater customisations to the site, and completely change its layout and functionality. This must be done with the above points in mind, as it is the complete responsibility of the owner to ensure the site is secure and the software is upgraded each time Wordpress release a new version.

6

Signing up to Wordpress.com Navigate to http://www.wordpress.com/ in your internet browser, such as Internet Explorer or Firefox (or click on this link to open the address directly) and you will see something similar to the page shown below. Click on the “sign up now” button to begin.

You will then see the following signup screen.

The blog address should be your village, parish or group name, so that it is memorable and easy to understand. Your username can be anything you choose, for example, your name, the group name or “*groupname+Administrator” (e.g. RothersthorpeAdministrator) are all acceptable. This email address will be used for all correspondence with Wordpress, so should be one which you have regular access to, or one which you have set up specifically for the administration of this blog using the instructions within the first section of this document.

7

Wordpress will then send a confirmation email to the address you supplied and, in order to verify your account, you will need to click on the link in the email. An example of this email can be seen below. Note: If you do not receive the email, check in the spam folders as sometimes emails can be wrongly filtered out as junk. If you still cannot find it, you will need to contact Wordpress directly. Please see http://en.support.wordpress.com/contact for details of how to do this.

Once you have completed this step, you will see this message:

You are now ready to begin creating your blog!

8

Creating your blog

The Dashboard In the top left-hand corner of the Wordpress.com homepage, as shown below, you will find a toolbar with links to your blogs and other options. Note: You will need to be signed in to see this feature and to begin creating or editing your blog. Clicking Dashboard will take you to the ‘behind-the-scenes’ area of your blog, from here you can updates and modifications. If you have more than one blog, there will be a separate Dashboard for each.

The Dashboard is a console for you to make changes to your blog, and it is not how readers of your blog will see it. Changes that you make in this ‘behind-the-scenes’ area will be reflected in what is called the ‘front end’ (i.e. what the reader sees). In order to view the front end of your blog, click on the blog’s name in the toolbar illustrated above (here, it would be My Blog or Read Blog).

Once you are on the dashboard, there will be a menu on the left which allows you to access the settings for almost all aspects of your blog. An example of this menu is shown below. Note: Each section of the menu can be expanded by hovering over its title and then clicking the arrow which appears next to it. Within Settings, there is a section labelled General, this is a good place to start. Here you can enter the site title, tagline and set other things such as the time zone and language.

9

Themes The next step is to select the Theme you would like to use throughout your blog. The Theme is the general appearance of the blog, and is a template into which all of your content will fit. The theme is a very important part of your blog as it can enhance or detract from a user’s experience. Wordpress provides many themes for users to choose from, but we recommend two for the blogs being created here. The recommended two themes are easy for users to navigate, and provide many customisable features, which will be discussed below. Within the menu, expand the Appearance section and click Themes, as illustrated in the image above. From the Themes page, you can then browse or search through all of the themes on offer and choose one for your blog. Below are the details of the two recommended themes, which you can search for by typing the title of the theme into the search box on the right-hand side of the page. Theme 1: Twenty Ten

Theme 2: Coraline

10

Both of the recommended themes have a customisable header image and sidebars, and also support additional menu items. To change any of the settings of your chosen theme, navigate back to the Themes page (Appearance>Themes, as described above). Your chosen theme will be presented at the top of the page, with several links to change options. Note: These are the same links as accessible by expanding the Appearance section of the menu, as shown below.

Clicking the Widgets link allows you to customise the content of the side column, and other set areas. Widgets will be looked at in the next section of this document. The Menus link allows you access to create new custom menus for your blog, including features which are not possible within the normal structure. Note: At this stage, it is not necessary to create a custom menu however, later on in the blog’s lifetime, it may become useful. Documentation on how to create this can be found on the Wordpress site at http://en.support.wordpress.com/menus/ The Extras link takes you to a page which contains any extra settings related to your current theme. The iPad link allows you to access extra options for those readers viewing your blog on an iPad. The Background link will allow you to upload an image to occupy the background of the entire blog, this means everything outside of the main content. You also have the option to choose a background colour instead of an image. Clicking the Header link will take you to a page where you can either upload your own image, or choose from a few pre-made images. The image you upload does not need to be the exact size of the header, as you will have the option to crop it after uploading. The Typekit Fonts link is only available to those who subscribe to http://www.typekit.com/ (there is also a link on this page to allow you to sign up for a free account) and allows you to choose from hundreds of fonts to use on your blog. It is worth noting at this point that any customisations you make to the blog should maintain its usability, and your choice of font should not make it too difficult for users to read or navigate your blog.

11

Widgets Widgets are mini applications which allow you to add special features or extra content to your blog. They are widely used on Wordpress blogs, and enhance the interaction with readers. The Widgets page can be seen below.

In the centre of the page, there is a display of all of the available widgets, and a brief description of each one, in alphabetical order. Some are static, such as the Image widget, and some are dynamic, such as the Twitter widget. Dynamic widgets are updated as you add new content to the service they reflect. The most common of these are Twitter and Flickr. If you have a Twitter account, you could now use that to add a new twitter widget. On the right, there is a list of the possible areas on your blog which can contain widgets. To place a widget in one of these areas, drag and drop the title of the widget into the desired area. If there is enough room for it to be placed there, a dashed outline of the widget bar will appear and you can then place it. After placing the widget, there will be several fields you need to complete in order to begin using it. Once you have entered the required information, click Save and your widget will be ready to use. You may now want to view your blog as a reader would, to make sure that your widget is working correctly.

12

Creating posts In the menu on the left-hand side of the page, expand Posts to reveal several options. Clicking Add New will allow you to create a new post, and you will see the page below. The text-editor allows you to format your posts by adding paragraphs, bold text and images, as well as entering your own html code. Once you have entered the title and content of your post, you can click the Preview button to see how it will look to readers of your blog (the preview includes the whole of your blog, so you can also see how any changes you have made to your theme will look when displaying your new post).

If you would like to save your post in order to come back to it later, but you are not ready to publish it, click the Save Draft button. Once you are ready to publish your post click Publish, and it will be posted to your blog, complete with a time/date stamp. There are also additional options on this page relating to whether you would like to allow readers to comment on your posts and the ability to add categories to posts, which can be used to create custom pages (see Displaying posts on other pages below). After publishing, pages can be edited by clicking the Posts header on the Dashboard, as shown below. Clicking on the post title will open it for editing, and changes can be made in the same way as the page was created. However, when hovering over a post title in the Posts view, options will appear including Quick Edit. Click Quick Edit and a smaller editing menu will appear under the title of the selected post, as shown below.

13

There is a field in this Quick Edit menu labelled Make this post sticky, selecting this option will mean that the post sticks to the top of the posts feed page regardless of whether more recent posts have been published (the feed will continue, newest first, below this post). This is often used to keep readers aware of one particular news story or point of interest, instead of it being moved further down the page to make way for newer content.

Creating pages The process for creating a page is almost identical to that of creating a post. The link to create new pages can be found in the menu under Pages and then Add New. When creating pages, they can also be previewed and saved as drafts. The layout of the page creator is also very similar to that of the post creator.

There is also the option to allow readers to leave comments on your pages. This can be allowed or disallowed for each page individually by clicking on the tick box below the Discussion header, when creating or editing the page. In the same way as creating a post, once you have finished adding your content, click the Publish button to create your page. Note: You can always come back and edit pages and posts later if you need to add or change something.

14

The difference between posts and pages Within a Wordpress blog, content is divided between pages and posts. There is no limit to the number of posts or pages you may have on your site.

Posts Posts can contain the same information/images/videos as pages, but are given a time and date stamp and a summary of each post appears in reverse chronological order (i.e. most recent first) on one page of the blog (usually the homepage). Posts can be used for any content which does not require its own static page within your website, or which will change frequently. One of the main uses for posts is a news feed, giving the readers up-to-date information, as the most recent information will be displayed at the top of the homepage (by default).

Pages Pages are static areas of information (they can include text, images and videos) which can be edited by users who have the permissions to do so (we will look at user permissions later in this document). Their content remains the same until it is edited again, and they are not listed by date. Comments can also be turned on and off for pages. An example of the use of a page could be an “About Us” section about the group itself, or a “Contact Us” page containing useful email addresses and contact details for those involved. Pages are not given tags or categories as they can be categorised using the menu bar, this will be discussed later. The URL for a page will look like this: http://blogname.wordpress.com/page-title/

15

Blog structure

Changing the homepage By default, a feed of the posts you create will appear on the homepage of your blog (the first page readers see) in reverse chronological order, i.e. newest first. The reason for this is that the posts are

intended to be the main focus of a blog, as they will be the constantly changing content. Pages will usually contain static information, which is unlikely to change frequently, therefore the reader does not necessarily need to check this each time they visit the site. However, it is possible to set a page as the homepage instead of the posts feed. In the Dashboard, expand the Settings tab, and click Reading, as shown below. This page allows you to customise several aspects related to users reading your blog. The first option allows you to set a static page as your front page, and assign another to display the posts feed which you have now removed from the

front page. Note: Before replacing your front page with a static one, you will need to create a page specifically to contain your posts feed.

16

Ordering of pages When you add a page to your blog, a link to this page will be placed in the menu automatically, so that the reader can navigate to the page, as shown below.

In this example, 4 pages have been added to the blog titled ‘About’, ‘Contact Us’, ‘Events’ and ‘past Events’. Links have been added to the menu to allow readers to see what is available on the blog, and how to get to each page. Usually, the ‘About Us’ page will be the first link in the menu (after ‘Home’), and ‘Contact Us’ will be the last. To change the order of pages in the menu, navigate to the Pages section of the Dashboard., this will display a list of every page on the blog. Note: The ‘Home’ link in the menu is added automatically and takes users back to the front page of your blog; it will not appear in the list of pages. Clicking on the page title will take you to the editing screen for that page. In order to quickly edit the properties of a page, but not its content, hover over the page title and click Quick Edit. This will open a smaller editing window within the page you are on, as shown on the next page.

17

The Order field relates to the order in which the pages are displayed in the menu. The page order can be changed by typing a number into this field, the pages will then display from right to left in ascending order based on this figure. In the above example, the Contact Us page should be moved to the left, and placed last in the menu. Because all of the other pages’ Order field will be 0, as this is the default, we can enter anything above this to cause the Contact Us page to display last in the list. As we want the Contact Us page to be the final link in the menu, no matter how many pages we have before it, it is a good idea to enter a higher number in this field (such as 100) so that it will not need moving again at a later date. The Parent field, as indicated above, allows you to group pages under others, and also have them display in this way in the menu. Assigning parent pages is a good way to keep the menu tidy whilst making it easier for readers to navigate. In the above example, it seems logical to give the Past Events page a parent page of Events; we could also create another page titled Future Events and give it the same parent page. The changes this has made to the menu can be seen below.

Instead of all of the pages being listed in the main menu bar, some are now grouped under a parent page. The pages under the parent can be seen by hovering over the parent page title, as shown above. The Contact Us page has now moved the end of the list.

18

Displaying posts on other pages http://en.support.wordpress.com/menus/ By default, Wordpress blogs show the feed of posts on the main page (homepage), because they are the part of the blog which changes most frequently. Sometimes, however, a blog will contain a wide variety of material and there is the need to create a divide between categories of posts, and split them to make it easier for the readers to find what they are looking for. This means creating multiple feeds of posts, based on subject matter which will then have their own link in the menu. In order to distinguish between the content of different posts, we must sort them into categories. When creating posts, there is also the option to add Tags and Categories. A category can be added when creating a post, or later by going back later when editing.

When adding a category for the first time, click Add New Category and type the title of the category you would like to add. Categories can be given parents in the same way as pages, but it is not necessary to do so at this stage. Once categories have been added to the list, they will then be available to assign to posts and pages. To put a post into one or more categories, tick the boxes next to each. Note: Listing categories in this way means that it is easy to keep track of how many there are and make sure they are kept consistent.

19

Once categories have been added to the posts, a menu must be created containing a link to each category. This can be created by clicking on the Menu link on the Dashboard, under Appearance. You will then see the page shown below.

Enter the name of the menu you wish to create into the Menu Name field and click Create Menu. If this is the only menu you intend to use on the blog (this is true in the majority of cases as it can be edited at any time) then a good name may simply be ‘Custom Menu’.

20

Once it has been created, the remaining sections will be unlocked to enable you to begin building the menu (notice the yellow banner at the top of the screen which gives confirmation of this). The first step is to set the menu you have just created as the one you would like to use on your blog. This is done by selecting it from the dropdown list within the Theme Locations section, and clicking the Save button. Note: There will be no confirmation when clicking Save, but the changes will have taken effect. Because this new menu is currently empty, there will be no links to pages automatically generated. Each page which is required in the menu must be added on this screen by selecting it and then clicking Add to Menu. A quick way of restoring links to all of the pages on the blog is to click Select All and then Add to Menu. Categories can be added to the menu using the same actions, but within the Categories section. Once these links have been added, it should look something like the image below. Notice that each link in the menu has a label identifying the type of link it is (in this case Page or Category).

Each link can be expanded for editing by clicking the arrow next to its title. Here the label of the link (the user will see this is in the menu) and the title attribute (this is the text which appears when a user hovers over that link in the menu) can be edited. Any ordering or assigning of parent pages in the Pages section are removed in a custom menu, as you must start from scratch.

21

The links which have been added to the menu will display in the order in which they appear on this editing screen. To change the order, simply drag and drop an item to the position you would like it to be in. To add assign parent pages, simply drag and drop the link to site, indented, underneath the link you would like to be its parent. This is shown in the image below. Note: The items display here in a vertical list, but look as the menu did previously when you view your blog (horizontally across the top of the page).

Once you have finished editing and arranging the menu, click the Save Menu button and a confirmation will appear at the top of the screen as shown above. By clicking Read Blog, in the header of the Dashboard, the blog can be viewed as a reader would see it. Here it is easy to see if the menu has been laid out correctly, If changes need to be made, they can be entered by returned to the Appearance > Menus section of the Dashboard.

22

Extra Features Extra features can be added to make your group blog more interactive and encourage users to contribute content, or simply get in touch.

Google Calendar Google Calendars provide an easy way to share events and important dates with the other members of your group, or readers of your blog. If a reader also has a Google account, they can add the events you have created to their own calendar or, depending on the level of security you have set on your calendar, add their own events to yours. If you have already signed up for a Gmail account, you can use the same email address and password to log in to Google Calendar, as Google shares these user details across all of its services. If you do not have a Google account, you can create one on the calendar homepage by clicking the Create an account button. Note: Creating a Google account is covered at the beginning of this document, however creating an account through Google Calendar will not give you a Gmail email address. Please create an account at http://www.google.com/gmail/ to do so. Please see http://www.google.com/support/calendar/ for help and support when creating calendars and adding events.

Once you have a Google calendar which is ready to embed in your blog (it is worth noting at this point that the calendar will continue to update with any changes you make to it, without the need to add it to the blog again), click on the settings link in the menu on the left of the page. Click the Share this Calendar link next to the calendar you would like to place on your blog. The next step is to make the calendar public, by selecting this option, as shown below. Then click Save to save your changes. Now click on the Calendar Details tab, as illustrated below.

23

Note: The Google calendar needs to be embedded in a post or page, so now may be a good time to create the post or page you would like to embed the calendar into. As the calendar is probably intended to be viewed often, and contain up-to-date information, it is usually placed on a page so that readers always know where to find it. On the My Calendar Details page, as shown below, copy the text within the Embed This Calendar section.

You will now need to paste this code into the page or post you have created to hold the calendar, within your Wordpress Dashboard; this should look something like the image below. Note: Again, remember to ensure that the editor is set to html instead of visual, when you paste the text.

When you have pasted the code into the page, click on the Preview button to view your calendar within the page. Once you are happy that it is working correctly, Publish the page and readers will be able to view and browse the calendar.

24

Google Calendar as a widget Google calendars can also be placed into widgets for use in the side columns or footers of your blog. The advantage of this is that the calendar would be visible on every page (including the homepage). However, a disadvantage is that the calendar is much smaller here than when given its own page or post, this may mean that some events are not visible. In order to make a Google calendar widget, the same steps as above apply, up to the point of copying out the embed text. The copied text must then be placed into a text widget instead of a page or post. To do this, navigate to the Appearance section of the Dashboard, and click Widgets. Drag a new Text Widget into the desired area (e.g. the sidebar). The copied text can then be pasted into the Text Widget. This should now resemble the image below.

Click the Save button and the widget will be added to the sidebar, complete with the calendar. If you now proceed to view the blog as a reader, the widget should appear as below.

25

Flickr Flickr is a photo sharing website, on which you can create and organise multiple photo (and video) albums, and share them with others. As already discussed, Wordpress has a built-in Flickr Widget which can display your latest Flickr uploads to the users of your blog, and allow them to click through to Flickr to view your whole collection (apart from those albums or photos which have been marked marked as private). Navigate to http://www.flickr.com/ in your browser, and you will see the flickr homepage, as shown below.

If you already have a Flickr , Yahoo or Google account, you can Sign In using the link at the top of the page. If you do not have any of these, click on the Sign Up link to create one. Note: You can also use your Facebook account to log in, but this is not recommended if you are creating a group Flickr account for use solely on the blog as you may need to share the password with other members of your group. As already discussed, a Google account can be used for many services and this includes Flickr. As we have used this account for many services already, and especially if it has been created as a group account, it is easier to log in with this when possible. When you use your Google account to log in to Flickr for the first time, you will be prompted to create a Flickr screen name, under which all of your photos and videos will be displayed. This is shown in the image below. It is best to use something related to the group your blog is for at this stage.

26

Once you have filled in this basic information, you will be signed in to Flickr, and can begin to add photos. Flickr will guide you through this process, and you will see useful links on the main page, as shown in the image below. Note: Your images will need to be public and not private to show in your Wordpress widget. There will be an option to set this when uploading the images (the default is public).

Once you have uploaded some photos, you are ready to create a Flickr Widget on your Wordpress blog. The first step is to click on the link to your Flickr Photostream (as shown in the image below)

When on the Your Photostream page, scroll down to the bottom of the page, to the RSS and Latest links.

27

Right-click on the Latest link, or on the RSS icon (the orange square) and select Copy Shortcut (or Copy Link Location) Now, in the Dashboard of your blog, navigate to the Appearance section and click on Widgets. Drag and drop the Flickr Widget into the desired location (e.g. the main sidebar). The copied link can now be pasted into the Flickr RSS URL field, as indicated below.

Once you have customised the widget by setting the number and size of photos you wish to display, it can be saved by clicking the Save button. Again, navigate to the view of the blog the reader sees to check the display of your widget.

28

Useful links Wordpress – Support and Forums

http://www.wordpress.com http://en.support.wordpress.com http://en.support.wordpress.com/google-calendar/ http://en.forums.wordpress.com

Google – Gmail and Google Calendar

https://www.google.com/gmail http://www.google.com/calendar/ http://www.google.com/picasa http://www.google.com/support/calendar/

Hotmail

https://www.hotmail.com Flickr

http://www.flickr.com

29

Next steps – maintaining and developing your site You can become a Wordpress expert very quickly, but there are also lots of important, non-technical things to think about when developing your site.

Who will visit your site? Some of the visitors to your site will live in the same town or village and some may be from outside of the county entirely. It is possible to cater for very different audiences on the same site if you think about the information each group will want to find. Always start every page or post with the website visitor in mind.

What will your site contain? Decide whether your site will be geared more towards creating engagement and provoking debate or instead more of an information-based site without much interaction. For sites aimed at engaging residents:

think about the issues that affect your area

make sure you check regularly for comments For sites aimed at giving information:

what information would you expect to find about your area if you searched on Google?

think about how you could provide this information in an easy and sustainable way

The golden rule Above all, keep it simple to start with. A concise, well-maintained website is much better than an overambitious, out-of-control and out-of-date website. Once you have an idea of how much time you have to maintain the site, the easier it is to expand.