The Brass Tacks of Creating a WordPress Page
Once you’ve got your blog up and structured the way you want it, you’ll need to understand how to create a post or a page. Your work area is called the “Dashboard.” You’ve been here before as you’ve gone through the WordPress tutorial.
To begin, decide whether you want to create a post or a page. If your blog consists of updates (diary or journal style), your entries can be posts. Pages are more permanent, and are often used to create articles and introductions. Let’s begin by creating a page.
At the left side of the dashboard, you’ll see a menu. Scroll over the word “Pages,” and a pale grey down-arrow will appear. Click on the arrow. Now you have a choice to edit a page or to add a new one. Click on “Add New.” WordPress will bring up a new dashboard window that says “Add New Page” at the top.
Look to the right of the page where it says “Attributes.” You’ll see a box that says “Main Page — No Parent.” If you leave that selection alone, the title of this page will become a tab on your home page. To see what tabs look like, go to any of our WordPress sites, say, http://www.mormonfamily.net. To create articles under each tab, select the tab name as the parent page for your new article. To do this, click on the arrow next to the Attributes Parent box. A menu will open, listing all the articles you’ve created. Choose one as a parent, and your article title will become a subtitle under the article you’ve chosen. Further, you can designate the order in which your subtitles will appear. If you don’t make a choice, your articles will order themselves alphbetically.
Once you’ve chosen a parent page and article order, type the title of your article in the empty space at the top of the page. Notice that a URL called a permalink or “slug” appears underneath your title. You will use the slug when linking to other articles and posts within your own blog. We’ll come back to this in a minute, but notice that you can edit the slug by pressing the edit button next to it and then saving your changes. If you’re going to link from one page to another within your site, it can be more convenient to have a short slug line.
Now we’re ready to add text to the page by typing in the edit box. But first, we’ll learn about your editing options, accessible from the tool bar above the edit box. Above the edit box, you’ll see two rows of buttons. If you don’t see two rows, click on the button at the far right that looks like three horizontal rows of colored dots. This button is called “kitchen sink.” When you press it, the lower row of buttons will be revealed.
Let’s identify the functions of these buttons. Beginning at the top left — Bold; Italics; Cross-out text; Insert Bullet Points; Insert Numbered List; Create Block Quote; Left Align Text; Center Align Text; Right Align Text. Notice that the next two buttons are non-functioning. The one on the left is to add a link, and the one on the right is to delete a link. These two buttons become functional when you highlight a word or phrase in the text you’ve written in the edit box. Once you’ve highlighted a word or phrase, you can link it to an external website or to another article within your own site. We’ll practice that in a minute.
The next button is the “Read More” option. It is useful to split an article that is too long. The next button is the Spell-Checker; then Full-Screen Mode; then the Kitchen Sink. On the bottom row, click on the down arrow next to the word “Paragraph.” Here you can choose heading and sub-heading font sizes; “paragraph” is normal text. Next, Underline; Justifying text (especially useful when you’ve inserted an image with text to the right or left of it); Font color; Paste plain text; Paste text from Word; Remove Formatting; Insert embedded media (especially useful for YouTube videos you might want in the page); Insert Special Characters (like em-dashes and foreign accented letters); Out-dent; Indent; Undo; Redo; and Help.
Now look above the rows of buttons. You’ll see the words “Upload/Insert” and then four symbols for inserting media. These symbols are for adding media that’s already saved on your computer. The one most commonly used is the one on the far left for adding images. We’ll try that in a minute. Also notice two tabs above the two rows of buttons. In “visual” mode, you’ll see your normal text. In HTML mode, you’ll see the HTML commands that cause your text to look like it does — including font style, spacing, indents, and placing of media and images. Sometimes when you import text from another place, even by copying and pasting, you bring various commands along with it. Even if you know nothing about HTML codes, you can often see a garble of commands in HTML mode and intuitively sense that they are confusing everything. Some are commands for structuring tables, and deleting them will destroy a table format. Others are font styles, etc. You can try deleting them. If you don’t like the result, you can replace them again.
Working in the Edit Box
In the illustration above, we’re blogging about upcoming trip around the world (if only!). We’ve highlighted the word “Australia” (our first imaginary destination) in order to link it externally to a Wikipedia article about Australia. Once the word “Australia” is highlighted, the link button in the toolbar (it looks like the link of a chain) will become active. Click on the link button. The following window will appear:
Your internet browser probably has tabs that allow you to open more than one site at a time. Open a new tab and go to the website you want to link to. Highlight the URL (the website address). On your keyboard, press Control and the letter C. This will copy the URL. Now go back to your blog. Put your cursor in the “Link URL” box. On your keyboard, press Control plus the letter V. This will paste the URL into the box. Decide what you want to happen if a reader clicks on the highlighted word in the text. Do you want the new website to appear in a separate window? Or in the same window? You can make that decision by clicking on the down arrow next to the word “Target.”
Now click the “Insert” button, and the link is created. To delete the link, simply highlight the word in the text and click on the broken link button in the toolbar. To edit the link, highlight the word or phrase, click on the link button, and make any changes necessary. Then click on the “Update” button in the link window.
To create a link to another article or post within your blog, just add the slug line in the URL box of the link window. You do not need the entire URL. A link to our page about our round-the-world trip would look like this:
Now I’d like to add a map of Australia to my blog page. First, it’s important to put the cursor where the image should be in the final text. To insert a picture within a paragraph, either to the right or left of the text, place the cursor to the left of the first word of the paragraph. If you want the image to stand alone, place the cursor in an open space between paragraphs. This can be at the far left. You can tell the image control to place the image in the center of the open space. If the image is to be to the left or right of some text, it’s best if it’s no wider than 250 pixels or thereabouts. When a picture is centered on the open page, it can be 500 pixels wide. WP provides some editing choices and can crop or scale an image. Or you can choose to do that yourself in a photo editor before loading the image into your article. The image I’ve chosen has no copyright, so I am free to use it. Don’t break copyright laws when you choose your images.
Above the double row of buttons, where it says Upload/Insert, click on the first button (”Add an Image”). The following window will appear:
Click the browse button, find the image file on your computer, open it, and then click the Upload button. (Sometimes the button will say “Select File.”) The image will appear in the WP image upload window:
Notice that there is an edit button to the right of the image. Clicking on the Edit button opens a window with simple editing options, like flipping or rotating the image, cropping or changing the scale of the image. Remember to save your changes. After you have made any necessary changes, notice the options at the bottom half of the window:
If you want a caption to appear under the framed image, enter it into the caption box. At the bottom of the window, select the location and size of the image you like to insert. We’re going to add a caption that says, “From Wikipedia.” We want the image to appear in the left side of our text, and we want it to be a medium size. Our selections will look like this:
Click the button that says “Insert into Post.” The image will be inserted into your edit box:
How to add a video from YouTube
Click on the toolbar button that looks like a vertical row of green film. A box will appear that asks for the URL of your selected YouTube video. To select your video, go to www.YouTube.com and search for the video you want. Copy the URL of the video, just as you did for a standard external link. Paste it into the URL box of the Add a Video window. That’s all you have to do, unless you want to prescribe the width and height (in pixels) that the video should be. This usually is not necessary. We’ve chosen a YouTube video:
Then just click the Insert button.
When you’ve finished your article, click the Publish button to the right of the edit box. If you make any changes, you can click on the Update button to save the changes. After your article is published on your blog, you can view the finished page, or go back to the homepage of your site by clicking the appropriate buttons above the editing area (View Page or Visit Site).
Screencasts to Help You
The following links are to instructional videos that will teach you more about working with WordPress.
