Click here to download the complete 11-part guide in PDF format. (2.5MB)
To edit a post or page…
1) Navigate to the post or page you want to edit on your website and click “Edit This Entry”.
or
2) Log in to the Admin section, click on Posts (or Pages) and you’ll see a list of all your posts (or pages). Hover over the one you’re looking for and you’ll see additional links appear beneath it. Click on the “edit” link.
To create a new post or page, click the “Log in” link (or the “Site Admin” link if you’re already logged in). From the WordPress Dashboard, click on the “Add New” link under Posts or Pages.
At the top of the new page is the Title box for the title of your post. The title of your post is also used as the Title Meta Tag which shows up at the top of your browser and in search engines results. So you should take these things into consideration when titling your posts and pages.
* If you have a search engine optimization plug-in installed on your website (like All-in-One SEO), you may be able to change the title to be different for search engines.
Right beneath the Title box is another section called Permalink. This is the search-engine-friendly version of your post’s (or page’s) URL. It will usually start with the current year, followed by the current month, followed by the title you created. It will have hyphens in it. If you click the Edit button next to it, you can type in something else. Make sure NOT to use capitals, spaces or special characters (some web servers may not read them properly). Try to keep them somewhat short by deleting small words and use hyphens to separate words.
Adding Content
Next is the Content box which is where you start typing your text or insert images, etc. You have several buttons to help you customize your text like bold, italicize, bulleted lists, more tag, etc. Hold your mouse over each button to see a helpful description pop-up.
The default state of the Content box is the Visual display (shown at the top right of the Content box). This is close to what your text looks like on the web. The HTML tab lets you see the actual HTML code that makes up the content. You don’t always need to go into this view, but sometimes it can be helpful and you only need minimal HTML knowledge.
If you only see one row of buttons, click the last button on the right to reveal a second row of buttons. Depending on how your website was configured you may have more or fewer buttons than what is shown above (If your website has the “TinyMCE Advanced” plug-in installed, you will have more buttons). If you’re looking at your content in HTML mode, you will see a set of labelled buttons rather than the icon buttons shown above.
The most important buttons you’ll probably need to use are: bold, italicise, bulleted lists, link, and the more tag. What’s a more tag? The More Tag is a piece of code that WordPress recognizes as the point to stop displaying content and add the “Read More…” link. This only takes affect on the home, archive, and category pages (the snippet pages). This code is normally ignored on all other pages so that all the content will be visible.
The More Tag appears in the content box like the image above. In HTML view it looks like this: <!–more–>
Some things to keep in mind when copying and pasting text or images into the Content box:
- When pasting text from a program like Microsoft Word, extra code, created by the program, can get added to your content, causing your page to look strange. To avoid this, copy the text from your Word document and paste it into Notepad (TextEdit on MAC). Then copy the text from Notepad and paste it into the Content box. This method strips out the extra code and reduces your text to what is referred to as “plain text”.
- When pasting content from another website, you may inadvertently take that website’s formatting code, causing it to look weird on your website. Again using the method described above using Notepad will strip away the extra code and leave you with the plain text.
Adding Links
Select the text or image that you want to turn into a link and click the Insert/Edit Link button (looks like a chain). A pop-up will appear. Insert the full URL of the link (including the http://) into the Link URL box. Target controls whether or not to have the link open in another browser window. For accessibility reasons you should set this to open in the same window. Title is to tell where the link is pointing (another accessibility function). You can ignore Class.
You can also link to other posts or pages on your website by grabbing that post’s/page’s URL from the browser’s address bar and pasting it into the Link URL box.
Click Insert and your text will be linked. Your image may or may not have a blue border to indicate its linkage.
Adding Images
Above the Content box are the Upload/Insert buttons. Use these to upload images, videos, PDFs, etc. to your website for adding to your posts and pages. A pop-up window will appear with 3 tabs for uploading: from your computer, from an external link (someone else’s website), or your Media Library (files that you’ve already uploaded).
Click Select Files to access your computer’s folders. The Title of the file is inputted for you but you can edit it as you wish. Caption adds a caption beneath your image on your page. Description is for your own reference and will not appear on the website. Link URL allows you to turn the image into a clickable image. Add the full URL address of the link you want (including the http://). File URL will insert the full URL for the full-size version of the image (this is useful if you only use the thumbnail version on your web page and make it clickable to see the full-size version). Post URL inserts the WordPress short form address to the image. None clears the box.
Alignment controls how the text near the image should flow (wrap). Left will place the image on the left margin of the content area while the text flows along the right side of the image. Right will place the image on the right margin while the text flows around the left side of the image. Center will place the image in the middle of the content area while the text is pushed above and below the image. None will not wrap the text around the image at all. Text before and after the image will be spaced away evenly above and below the image, unless you accidentally place it in your text like the example on the previous page.
Size controls the pixel dimensions of the image. WordPress has an automated feature that creates multiple thumbnails for you to use. Here you can choose to insert either of the smaller versions or the full-size image.
When you’re finished with all the settings, click “Insert into Post” and the popup will close and your image will appear where you had left your cursor. If it is in the wrong place, you can click-and-drag the image to your desired location.
You’ll notice when you click on an image, it becomes selected and two icons appear above it. The one that looks like a small photo is the Edit Image button. The other icon is the Delete Image button.
Selecting an External Image by clicking From URL when the pop-up first opens, is the same as above except you have to include the full URL address.
Selecting a file from the Gallery or Media Library. The Gallery contains all of the media files that are connected to the current web page you are editing. It will be empty if you’re working on a new page. The Media Library contains ALL of the media files uploaded to your website. To select a file in either of them, click the “Show” link at the right of it.
Edit Images
To edit an image in your posts or pages, select it and click the photo icon. Alternatively, you can edit media files by going to the Media button on the left hand side of the Dashboard and then click the Edit link for the file you’re looking for (this method has fewer options and doesn’t allow you to change as much).
Assuming you opted for the first method above, a new pop-up window should appear. At the top is a new Size tool. This allows you to slightly adjust the size of your images if they’re not fitting into your content. As you scroll over the percentages on the left, the preview image will change size (keep in mind that this preview IS NOT an accurate representation of your image and text sizes). Click on the percentage of your choice.
Personally I don’t like this feature. I believe in getting the image size correct before uploading it. Using this feature might make your images look distorted.
The rest of the features here are the same as above (see Adding Images). The Advanced Settings has a lot more features. Edit Alternate Text allows you to use/change an alternate tag in your code without having to use a Caption (like in the previous pop-up). Size lets you put in your own pixel dimensions. Original Size will return the dimensions back to the image’s actual size. CSS Class is the WordPress styling code. Styles, not to confuse you, is to add real CSS style code (requires knowledge of Cascading Style Sheets). Image Properties allow you to give your image a Border (in pixels) and add Vertical space and/or Horizontal space (adds spacing, in pixels, to the left and right of the image and/or above and below the image).
Alternate Tag: this is the text that shows up when the image is missing. It is also displayed in special browsers/devises that can’t show images. Voice-enabled software (like those used by the blind) read this text. Lastly, search engines use this text.
Under Advanced Link Settings you have similar options as above. The only difference is these effect the “link” properties of the image. Title is necessary for screen-reading software (like those used by the blind). It tells the visitor where the link will take them. Target determines whether the link will open in a new window or not.
Writing/Editing a Post continued…
At the bottom of the editing page is a section called Discussion. Here you can control whether or not to allow visitors to leave comments per post. By default this will be set to “allow” unless you’ve disallowed them throughout your website (this can be changed in the Discussion settings). This is convenient if there are certain posts or pages that you don’t want comments left on but you DO want them on the rest of your posts (and visa versa).
There’s another section down here called Post Revisions that allows you to revert to an older version of your post.
The Excerpt box is where you can write a short summary of your post. If your website’s theme (design code) is setup to use excerpts, then you can use this instead of the More Tag.
You may or may not see other boxes in this area of the page. It depends mostly on which plug-ins have been added to your website.
Find out more here: http://codex.wordpress.org/Posts_Edit_SubPanel
Find out more here: http://codex.wordpress.org/Posts_Add_New_SubPanel
Publishing Content
To the right of the browser, is the Publish section, you can save a Draft of your work without publishing it to the website, Preview your work before publishing it, or Publish your post so it is live on the website for everyone to see.
After updating or publishing a post or page, you will see new text at the top of the page alerting you to the fact that the page has been either updated or published. This is followed by a link to view your changes live.
The Tags section is a place where you can add tags to your posts. Tags allow posts from different categories to be associated and linked with one another.
Ex: let’s say you have a post under a category named “Social Skills” that talks about eating disorders and you have another post under a category named “How to be a Grown Up” that talks about eating disorders. By adding the tag “eating disorders” to both posts, that tag will appear at the bottom of each post and visitors can click on the tag to see ALL posts related to eating disorders displayed together on what’s called a Tags Archive page. This is similar to a Month’s Archive page.
Tags shown at the bottom of a post.
You can add as many tags to a post as you want, but don’t go overboard. The ultimate idea behind tags, categories, and search boxes is to make it easier for visitors to find what they’re looking for.
Find out more here: http://codex.wordpress.org/Posts_Tags_SubPanel
The Categories section is to select which category to assign a post to. If you forget this part, your post will go under Uncategorized. You can always go back in and re-assign it by un-checking Uncategorized and checking the category (or categories) that you do want.
Find out more here: http://codex.wordpress.org/Posts_Categories_SubPanel
Best practices to not confuse your visitors:
- Don’t add too many tags to a post (try to keep it under 6)
- Don’t assign a post to multiple categories (try not to go over 2)
- Don’t use too many categories (try to have generic categories and maybe sub-categories if necessary)
Tags: linkedin
[...] it can be displayed on the blog post list page on your website, but most bloggers are using the “more” tag. If you want that only a portion of your article to appear on posts list, separate the main content [...]