Page 1 of 11 Wordpress Sites How-to Guide. Introduction to Blogging -

Transcription

1 Page 1 of 11 Wordpress Sites How-to Guide General Information: Version 5 Updated 1/04/10 Introduction to Blogging - Tutorials from Absolute - How to Use Wordpress: Short (1-5 min long) Online Tutorial Videos - *please note - some features shown in the videos may be slightly different or unavailable in your particular configuration, but watching the videos is an easy way to get a jumpstart on how to effectively use your blog. Writing and Publishing a Post - Saving and returning to draft posts & pages - Publishing your post at a later date - Adding categories and tags to your posts - Adding an About Me (or any other static) page - Using Quick Edit and Bulk Edit to manage your posts in half the time - using-quick-edit-and-bulk-edit-to-manage-your-posts-in-half-the-time/ Embedding photos, video & audio into your posts - Creating an image gallery - many more are available at

2 How to Upload Media Page 2 of 11 NOTE: These directions are specific to a Wordpress setup with the following plugins installed - Cleaner Gallery and WP Audio Player. Your mileage may vary, according to the system you are using and plugins you have installed. There are 3 ways to upload media: 1. If you are uploading VIDEO - please upload it to YouTube and embed the code on your blog (see directions below). 2. If you are uploading an AUDIO file (MP3), IMAGE file (JPG, PNG or GIF) or a DOCUMENT file (PDF or DOC) - Either - a. Go to Media-->Add New and follow the directions (NOTE: If you are intending to create a Gallery of images, please do not use this method to upload multiple images - see the directions on how to add a Gallery below) b. Upload from within the Edit or Add Posts/Pages area (see directions below). Recommended File Types: MP3, JPG, PNG, GIF, PDF, DOC Note: File types other than those listed and recommended above may or may not perform as expected. Upload at your own risk. How to Upload an Image from within the Add or Edit Posts/Pages area: NOTE: These directions are for SINGLE image posts only. If you intend to upload multiple images and create a gallery, please follow the directions in the next section: How to Create a Gallery. NOTE: Image files can be no larger than 8MB each and 400px wide, and must be in either JPG, PNG or GIF format. If you get an HTTP error, it is probably because you are attempting to upload a file that is too large, it is named the exact same as another file already uploaded to the media library, or is the wrong file type. 1. Go to the login area of your blog and sign in using your username and password. 2. If you are adding the image to a New Post, go to Posts-->Add New and give the post a Title. If you are adding the image to an existing Post, go to Posts-->Edit. (To add the image to a Page - go to either Pages-- >Add New or Pages-->Edit) 3. Above the text box on the left side, there are four icons next to "Add Media". Click on the first icon, "Add an image".

3 Page 3 of The page will darken and a lightbox will appear as above. (If it doesn't look like the above, click on the tab at the top "From Computer") 5. Click the "Select Files" button (Note: If this is not working well for you, you may want to try the Browser uploader instead (the second red circled text link). 6. Select the image file on your computer - (screenshot below is from a Mac, yours may look different)

4 Page 4 of Once the file uploads, you'll see the above box where you can change details such as the Title, add a Caption, add a Description, change the alignment and size, etc. (Note: The caption will show up under the image in your post/on your page. The description won't display on the public side of the site, and is for your own reference.) When you're finished, click the "Insert into Post" button. 8. If you'd like to add/format text to the Post/Page, click on the "Visual" tab (next to the HTML tab) at the upper right, and type/format your text. You can also change elements of the post (such as categories). 9. When you're finished, click the blue "Publish" (or "Update", if you're editing) button on the right side of the page.

5 How to Create a Gallery from within the Add or Edit Posts/Pages area: Page 5 of 11 NOTE: Image files can be no larger than 8MB each and 400px wide, and must be in either JPG, PNG or GIF format. If you get an HTTP error, it is probably because you are attempting to upload a file that is too large, it is named the exact same as another file already uploaded to the media library, or is the wrong file type. NOTE: You must upload the images to the post/page directly from your computer to create a gallery. Unfortunately, you cannot add images to a gallery in a post/page from existing files in the Media Library, unless those files were specifically uploaded to the post/ page you are adding a gallery to. For the easiest way to avoid this confusion, just follow the directions below exactly. 1. Go to the login area of your blog and sign in using your username and password. 2. If you are adding the image to a New Post, go to Posts-->Add New and give the post a Title. If you are adding the image to an existing Post, go to Posts-->Edit. (To add the image to a Page - go to either Pages- ->Add New or Pages-->Edit) 3. Above the text box on the left side, there are four icons next to "Add Media". Click on the first icon, "Add an image". 4. The page will darken and a lightbox will appear as above. (If it doesn't look like the above, click on the tab at the top From Computer ) 5. Click the Select Files button (Note: If this is not working well for you, you may want to try the Browser uploader instead {the second red circled text link}). 6. Select multiple image files on your computer - (screenshot to the right is from a Mac, yours may look different) Tip: You can select many in a row by holding down the Shift key, or hold down the Control key (PC) or Open Apple (Mac) key while you click on the file names of the files you want to upload.

6 8. Once the files all upload (crunching, and then show) - Click the "Save all changes" button at the bottom > Page 6 of 11 The screen will refresh, and will add the Gallery Settings to the bottom of the box like the following 9. Adjust the Gallery Settings as you wish, Click on the Show link next to the images to change their Title, Caption, Description, etc. and when you're done, click the "Insert gallery" button. 10. If you would like to add/format text to the Post/Page, click on the "Visual" tab (next to the HTML tab) at the upper right, and type/format your text. You can also change elements of the post (such as categories) as normal. 11. When you're finished, click the blue "Publish" (or "Update", if you're editing) button on the right side of the page. *NOTES: For the Gallery Settings, you probably want to adjust them to the following to keep consistency across the site and make sure they display nicely in the layout - Link thumbnails to: Image File Order images by: Menu order Order: Ascending Gallery columns: 3

7 How to Embed a Video Page 7 of 11 NOTE: We suggest that you first upload your video to YouTube, and then embed it into your blog post or page. This way, instead of the viewer having to download the file onto a computer, a small video player box will display directly on the blog. Follow this step-by-step process: Part 1 - YouTube Skip to #3 if you're embedding a video that's already on YouTube. 1. Go to youtube.com, and if you don t already have a YouTube account, sign up for one by following their signup instructions. 2. Sign into your YouTube account and follow their instructions to upload a video file. 3. View the video on YouTube s website. 4. Copy the URL at the top of the browser. Part 2 - Your Blog 1. Go to the login area of your blog. 2. Sign in using your username and password. 3. If you are adding the video to a New Post, go to Posts-->Add New and give the post a Title. If you are adding the video to an existing Post, go to Posts-->Edit. (To add the video to a Page - go to either Pages-- >Add New or Pages-->Edit) 4. Paste the URL of the video that you previously copied directly into the text box. 5. If you would like to add/format text to the Post/Page, click on the "Visual" tab (next to the HTML tab) at the upper right, and type/format your text. You can also change elements of the post (such as categories) as normal. 7. When you're finished, click the blue "Publish" (or "Update", if you're editing) button on the right side of the page.

8 How to Embed an Audio File from within the Add or Edit Posts/Pages area: Page 8 of 11 NOTE: Audio files can be no larger than 1500kb (1.5MB) each and must be in MP3 format. If you get an HTTP error, it is probably because you are attempting to upload a file that is too large, it is named the exact same as another file already uploaded to the media library, or is the wrong file type. Warning: make sure you are using Firefox, Opera or Safari when using this method. Not sure why, but the Link URL buttons don t work in IE and this is still not fixed in the latest WordPress version. 1. Go to the login area of your blog. 2. Sign in using your username and password. 3. If you are adding the audio to a New Post, go to Posts-->Add New and give the post a Title. If you are adding the audio to an existing Post, go to Posts-->Edit. (To add the audio to a Page - go to either Pages-- >Add New or Pages-->Edit) 4. There are 2 ways to reference an audio file in your Post or Page - 1. Basic usage (if you already have an audio file uploaded to your website) The default mechanism for inserting a player in a post is to use the [audio] syntax: [audio: This will insert a player and load your_mp3_file.mp3 into it. 2. Using the WordPress Media Library (upload and reference your audio file in one step) This is by far the simplest way of using Audio Player. If you are using WP 2.5 or higher, you can use the Add Audio button: 5. The page will darken and a lightbox will appear (see image on the next page). (If it doesn't look like that, click on the tab at the top "From Computer") 6. Click the "Select Files" button (Note: If this is not working well for you, you may want to try the Browser uploader instead (the second red circled text link).

9 Page 9 of Select the audio file on your computer --> 8. On the details page that appears after the upload is successful, if the URL does NOT automatically appear (as shown in the box circled on the image below), click on the File URL button (a) below the Link URL box to make the URL appear. 9. Click on the Audio Player button (marked 'a' on the image at the bottom of the page) which will add [audio: to the beginning of the URL, and end it with ] 10. Copy the URL link (b) and exit the lightbox screen by clicking the x in the top right corner. 9. Paste the URL link you copied previously into the text box. Your text box should look similar to the image at the bottom right of this page (with a different URL, of course). 10. If you would like to add/format text, you can do so now and also change elements of the post (such as categories) as normal. 11. When you're finished, click the blue "Publish" (or "Update", if you're editing) button on the right side of the page.

10 How to add a Document for visitors to download from within the Add or Edit Posts/Pages area: Page 10 of 11 NOTE: Document files can be no larger than 8MB each and must be in PDF or DOC format. If you get an HTTP error, it is probably because you are attempting to upload a file that is too large, it is named the exact same as another file already uploaded to the media library, or is the wrong file type. 1. Go to the login area of your blog. 2. Sign in using your username and password. 3. If you are adding the document to a New Post, go to Posts-->Add New and give the post a Title. If you are adding the document to an existing Post, go to Posts-->Edit. (To add the audio to a Page - go to either Pages-->Add New or Pages-->Edit) 4. Above the text box on the left side, there are four icons next to "Add Media". Click on the fourth icon, "Add media". 5. The page will darken and a lightbox will appear as shown. (If it doesn't look like the image to the right, click on the tab at the top "From Computer") 6. Click the "Select Files" button (Note: If this is not working well for you, you may want to try the Browser uploader instead (the second red circled text link). 7. Select the document file on your computer. 8. On the details page that appears after the upload is successful, click on the "File URL" button below the Link URL box to make the URL appear. 9. Click the "Insert into Post" button. 10. If you would like to add/format text to the Post/Page, click on the "Visual" tab (next to the HTML tab) at the upper right, and type/format your text. You can also change elements of the post (such as categories) as normal. 11. When you're finished, click the blue "Publish" (or "Update", if you're editing) button on the right side of the page.

11 Advanced Formatting of Posts and Pages Page 11 of 11 Adding Categories and Tags to your Posts Categories Note - when creating a Post, the author should choose at least ONE category to categorize their post under. You may choose as many categories as you like (they are checkboxes), and you do NOT have to choose the parent category of a child (for instance, you can choose "Dogs", but you do NOT have to choose it's parent category "Animals"). Default Category The default category is "Uncategorized". If you do not classify your post under any other category, it will be classified under the default. Tags What words or phrases should people use to find your Post? These are your Tags, and they can be anything. It's a good idea to tag each post with at least five to ten tags to help people find your post easily. Shorttags Some advanced functions make use of what are called Shorttags within the Text formatting area. You can recognize a shorttag by the [] brackets around the keyword text, for example [audio: is a shorttag. See specific plugin/feature instructions on what shorttags you can use Advanced HTML formatting of content within the body area You can use many HTML tags in the body text area (using the HTML tab at the top of the formatting area) including - <b> = Bold <i> = Italics <br> = Line Break <div> = Divider or div <img> = image <a href> = link <ul> = unordered list <ol> = ordered list There may be other HTML tags you can use as well - experiment and test!