Keeping Media Files Organized

If you’ve been running your blog for any length of time, you can easily forget
what files you’ve uploaded by using the WordPress uploader. Lisa used to
have to log in to her Web server via FTP and view the Uploads folder to see
what she had in there.
Now, the WordPress Media Library allows you to conveniently and easily discover which files are in your Uploads folder.
To find an image, video, or audio file you’ve already uploaded by using the file uploader and to use that file in a new post, follow these steps:

1. Click the Upload Media icon to open the File Uploader window.
2. Click the Media Library link at the top of the window.
All the files you’ve ever uploaded to your blog appear because of the
File Uploader feature (see Figure 4-3). Files you uploaded through other methods, such as FTP, don’t appear in the Media Library.
3. Select the file that you want to reuse and click the Show link.
4. In the settings menu that appears, set the options for that file: Title,
Caption, Description, Link URL, Order, Alignment, and Size.
5. Click the Insert into Post button.
The correct HTML code is inserted into the Post text box.

✦ Search media files by using a specific keyword. If you want to search
your Media Library for all files that reference kittens, then you type
the word kittens in the Search box in the upper-right side of the Media
Library page. Then click the Search Media button; the page reloads and
displays only media files that contain the keyword or tag kittens.
✦ Delete media files. To delete files, click the small white box that
appears to the left of the file’s thumbnail on the Manage Media page;
then click the Delete button, which appears at the top left of the page.
The page reloads, and the media file you just deleted is now gone.
✦ View media files. On the Manage Media page, click the thumbnail of the
file you want to view. The actual file opens in your Web browser. If you
need the URL of the file, you can copy the permalink of the file from your
browser’s address bar.

 

Read More

Podcasting with WordPress

As we explain in the introduction to this chapter, to podcast, the Web site owner provides regular episodes of an audio show that visitors can download to their computer and listen to on their favorite audio player. Think of podcasting as a weekly radio show that you tune into, except that it’s hosted on the Internet, rather than on a radio station.
In the sidebar “WordPress video and audio plugins” in this chapter, we mention

a few plugins that allow you to more easily insert audio files in your WordPress
posts and pages — however, a few plugins are dedicated to podcasting, and
they provide features to podcasters that go beyond just embedding audio files
in a Web site. Some of the more important of these features include
✦ Archives: Create an archive of your audio podcast files so that your lis-
teners can catch up on your show by listening to past episodes.
✦ RSS Feed: An RSS feed of your podcast show gives visitors the opportu-
nity to subscribe to your syndicated content so that they can be notified
when you publish future episodes.
✦ Promotion: A podcast isn’t successful without listeners, right?
Podcasters like to promote their shows by including their audio files
in the iTunes (www.apple.com/itunes) library so that when people
search iTunes for podcasts by subject, they find the podcasters’ podcasts and subscribe to them.
These three plugins go beyond just audio-file management, they’re dedicated to podcasting and all the features a podcaster is looking for:

✦ PowerPress (http://wordpress.org/extend/plugins/
powerpress): PowerPress has many of the features podcasters are
looking for, including full iTunes support; audio players; multiple file-
format support (.mp3, .m4a, .ogg, .wma, .ra, .mp4a, .m4v, .mp4v,
.mpg, .asf, .avi, .wmv, .flv, .swf, .mov, .divx, .3gp, .midi, .wav,
.aa, .pdf, .torrent, .m4b, .m4r); statistics to track the popularity of
your different podcast offerings; and tagging, categorizing, and archiving
of podcast files.
✦ Podcast Channels (http://wordpress.org/extend/plugins/
podcast-channels): WordPress provides some of the basic stuff
needed for podcasting, such as media-file embedding, archiving, and RSS feed handling. The Podcast Channels plugin gives you iTunes metadata that enables you to specify channels for your podcast files and include them in the iTunes library.
✦ Podcasting Plugin (http://wordpress.org/extend/plugins/
podcasting): Enhances the built-in WordPress audio-management
features by adding iTunes support, compatible RSS feeds, and media
players. This plugin also allows you to have multiple podcasting feeds,
in case you have different podcast shows that cover a range of different
topics.
We discuss Web hosting requirements in Book II. If you’re a podcaster and
intend to store audio files on your Web hosting account, you may need to
add increased storage and bandwidth to your account so that you don’t run
out of space or incur higher fees from your Web hosting provider. Discuss
these issues with your Web hosting provider to find out upfront what you
have to pay for increased disk space and bandwidth needs.

Read More

Inserting Audio Files into Your Blog Posts

Audio files can be music files or voice recordings, such as recordings of you speaking to your readers. These files add a nice personal touch to your blog. You can easily share audio files on your blog by using the Upload Audio feature in WordPress. After you insert an audio file in a blog post, your readers can listen to it on their computers, or download it onto an MP3 player and listen to it on their drives to work, if they want.
Click the Add Audio icon on the Edit Post or Add New Post page, and then follow these steps to upload an audio file to your blog post:

1. Click the Select Files button.
An Open dialog box appears, as shown in Figure 4-2.
2. Select the file that you want to upload and click Open (or simply
double-click the filename).
The file uploader window reappears in WordPress, which shows a progress bar while your audio file uploads. When the upload is complete, a dialog box that contains several options opens.

 

3. Type a title for the file in the Title text box.

4. Type a caption for the file in the Caption text box.
5. Type a description of the file in the Description text box.
6. Click the File URL button.
Clicking this button provides a direct link in your post to the video file
itself.
7. Click Insert into Post.
A link to the audio file is inserted into your post. WordPress doesn’t
embed an actual audio player in the post; it only inserts a link to the
audio file. Visitors click the link to open another page, where they can
play the audio file.
Some great WordPress plugins for audio-handling can enhance the function-
ality of the file uploader and help you manage audio files in your blog posts.
Check out Book VII for information on how to install and use WordPress Book IV
plugins in your blog.

Read More

Adding video from your computer

To upload and post to your blog a video from your computer, click the Add
Video icon on the Edit Post or Add New Post page. Then follow these steps:

1. Click the Choose Files to Upload button.

An Open dialog box appears.
2. Select the video file that you want to upload and click Open (or simply
double-click the filename).
The file uploader window in WordPress appears, which shows a progress bar while your video uploads. When the upload is complete, a dialog box that contains several options opens.
3. Type a title for the file in the Title text box.
4. Type a caption for the file in the Caption text box.
5. Type a description of the file in the Description text box.
6. Click the File URL button.
Clicking this button provides a direct link in your post to the video file
itself.
7. Click Insert into Post.
WordPress doesn’t embed a video player in the post, it inserts only
a link to the video; however, if you have the Auto-Embed feature acti-
vated, WordPress attempts to embed the video within a video player. If
WordPress cannot embed a video player, it displays the link that your
visitors will have to click in order to open the video in a new window to
view it.

Read More

Adding video from the Web

To add video from the Web, click the Add Video icon, then click the From
URL tab, shown in Figure 4-1, on the Add Video pop-up window and follow
these steps:

1. Type the URL (Internet address) of the video in the Video URL text box.

Type the full URL, including the http:// and www portion of the
address. Video providers, such as YouTube, usually list the direct links for the video files on their sites; you can copy and paste one of those links into the Video URL text box.
2. (Optional) Type the title of the video in the Title text box.
Giving a title to the video allows you to provide a bit of a description of
the video. Provide a title if you can so that your readers know what the
video is about.

3. Click the Insert into Post button.

A link to the video is inserted into your post. WordPress doesn’t embed
the actual video in the post; it inserts only a link to the video. Your blog
visitors click the link to load another page in which the video plays.

The preceding steps give you the ability to insert a hyperlink that your
readers can click to view the video on another Web site (such as YouTube).
However, if you activate WordPress’s nifty Auto-Embed feature, WordPress
can automatically embed many of these videos within your posts and pages.
With this feature, WordPress automatically detects that a URL you typed in your post is a video (from YouTube, for example) and wraps the correct HTML embed code around that URL to make sure that the video player appears in your post (in a standards, XHTML-compliant way).
Before WordPress can embed a video, however, you must enable the AutoEmbed feature on the Media Settings page by following these steps:
1. Click Media in the Settings drop-down list on your WordPress
Dashboard.
The Media Settings page loads in the Dashboard.
2. Select the Auto-Embed check box.
The Auto-Embed feature is now enabled and WordPress will attempt to embed a video player from a video URL from third-party video services like YouTube or Flickr within your post.
3. Set the dimensions of the video in which you want the (video) to
appear on your site in the Maximum Embed Size field.
Enter size (width and height) that you want the videos to appear in your posts and pages.
4. Click the Save Changes button.
You’re ready to automatically embed links into your WordPress posts. Book IV
Chapter 4
Currently, WordPress automatically embeds videos from YouTube,
Vimeo, DailyMotion, blip.tv, Flickr, Hulu, Viddler, Qik, Revision3, Scibd, PhotoBucket, PollDaddy, and Google Videom, as well as VideoPress-type videos from WordPress.tv.

Read More

Inserting Video Files into Your Blog Posts

Whether you’re producing your own videos for publication or embedding other people’s videos, placing a video file in a blog post has never been easier with WordPress.

Check out a good example of a video blog at http://1938media.com.

Loren Feldman and his team produce video for the Web and for mobile
devices.

Several video galleries on the Web today allow you to add videos to blog

posts — Google’s YouTube service (www.youtube.com) is a good example
of a third-party video service that allows you to share their videos.

Read More

Inserting Images into Your Blog Posts

 
• Link URL: If you want the image linked to a URL, type that URL in
this text box. Alternately, select the appropriate option button to
determine where your readers go when they click the image you
uploaded: Selecting None means the image isn’t clickable, File URL
directs readers through to the image itself, and Post URL directs
readers through to the post in which the image appears.
• Alignment: Select None, Left, Center, or Right. (See Table 3-1, later in
this chapter, for styling information regarding image alignment.)
• Size: Select Thumbnail, Medium, Large, or Full Size.
WordPress automatically creates small- and medium-sized versions of
the images you upload through the built-in image uploader. A thumb-
nail is a smaller version of the original file. You can edit the size of the
thumbnail by clicking the Settings link and then clicking the Media
menu link. In the Image Sizes section of the Media Settings page, desig-
nate your desired height and width of the small and medium thumbnail
images generated by WordPress.

 

If you’re uploading more than one image, skip to the “Inserting a Photo Gallery” section, later in this chapter.

Click the Edit Image button (shown in Figure 3-2) to edit the appear-

ance of the image.
The image editor (see Figure 3-3) options are represented by icons
shown across the top of the image editor window and include
• Crop: Cut the image down to a smaller size.
• Rotate Counter-Clockwise: Rotate the image to the left.
• Rotate Clockwise: Rotate the image to the right.
• Flip Vertically: Flip the image upside down and back again
• Flip Horizontally: Flip the image from right to left and back again.
• Undo: Undo any changes you made.
• Redo: Redo images edits that you’ve undone.
• Scale Image: The option drop-down list appears, giving you the abil-
ity to set a specific width and height for the image.
Click the Insert into Post button.

The Add an Image window closes, and the Add New Post page (or the

Add New Page page, if you’re writing a page) reappears. WordPress has inserted the HTML to display the image in your post, as shown in Figure 3-4; you can continue editing your post, save it, or publish it.

 

Read More

Adding an image from your computer

To add an image from your own hard drive after you click the Add an Image icon, follow these steps:

1. Click the From Computer tab, and then click the Select Files button.
A dialog box, from which you can select an image (or multiple images) from your hard drive, opens.
2. Select your image(s), and then click Open.
The image is uploaded from your computer to your Web server.
WordPress displays a progress bar on the upload and displays an Image

Options window when the upload is finished.
3. Edit the details for the image(s) by clicking the Show link that appears
to the right of the image thumbnail (the Show link appears for each
image if you uploaded multiple images at once — if you uploaded only one image, the Image options automatically appear).
When you click Show, the Add an Image window appears (see Figure 3-2), which contains several image options:
• Title: Type a title for the image.
• Alternate Text: Type the alternate text (see preceding section) for the
image.
• Caption: Type a caption for the image (such as This is a flower from
my garden).
• Description: Type a description of the image.

Read More

Adding an image from the Web

To add an image from the Web after you click the Add an Image icon, follow these steps:
1. Click the From URL tab in the Add an Image window.
The Add Media File from URL window opens.
2. Type the URL (Internet address) of the image in the Image URL text
box.
Type the full URL, including the http:// and www portion of the
address. You can easily find the URL of any image on the Web by rightclicking (PC) or Command-clicking (Mac), and then selecting Properties from the pop-up menu that appears.
3. Type a title for the image in the Image Title text box.
4. Type a description of the image in the Alternate Text text box.
The alternative text appears in a browser for visually impaired people
who use text readers or if, for some reason, the image doesn’t load prop-
erly. Although alternate text gives the visitors to your site a description
of what the image is, it can also improve your SEO (search engine optimi-
zation) efforts. Search engines read the alternative text (also called ALT
tags) to further categorize and define your site in listings and directories.

5. (Optional) Type the caption of the image in the Image Caption text

box.
The words you type here appear below the image on your blog, as a
caption.
6. Specify an alignment option by selecting the None, Left, Center, or
Right radio button.
7. Type the URL to which you want the image linked.
The option you select determines where your readers go when they click the image you uploaded:
• None: You don’t want the image to be clickable.
• Link to Image: Readers can click through to the actual image itself,
where the image file loads in their browser window.
8. Click the Insert into Post button.
WordPress inserts the appropriate HTML markup in the body of your
post so that the image gets displayed when visitors to your site view
your post.

Read More

Inserting Images into Your Blog Posts

You can add images to a post pretty easily by using the WordPress image
uploader. Jump right in and give it a go by clicking the Upload an Image icon
on the Add New Post page. The Add an Image window that appears lets you
choose images from your hard drive or from a location on the Web (see
Figure 3-1).
The interface that WordPress uses for file uploads is based on Adobe Flash.
Flash is a specific set of multimedia technologies programmed to handle
media files on the Web. Some browsers and operating systems aren’t config-
ured to handle Flash-based applications. If you experience difficulties with
the Add an Image window, WordPress gives you an easy alternative: Click
the Browser Uploader link in the Add an Image window to use a non-Flash-
based uploader to transfer your files.

Read More

Adding a Blog to Your Web Site

If you want a blog on your site but don’t want to display the blog on the front page, you can add one from the WordPress Dashboard. To create the blog for your site, first follow these steps:

1. Click Add New link in the Pages drop-down list.
The page where you can write a new post to your WordPress blog
opens.
2. Type Blog in the Title text box.
The page slug is automatically set to /blog. (Read more about slugs in Book III, Chapter 3.)
3. Leave the Page Content text box blank.
4. Click the Publish button.
The page is saved to your database and published to your WordPress
site.
Now, you have a blank page that redirects to http://yourdomain.
com/blog. Next, you need to assign the page you just created as your
blog page.
5. Click Reading in the Settings drop-down list.
The Reading Settings page opens.
6. From the Posts Page drop-down list, select the page that you created
in the preceding step list.
The page is set as your blog page.
7. In the Blog Pages Show at Most section, type the number of posts that
you want to appear in the Posts text box.
If you enter 5, for example, the blog page shows the last five posts you made to your blog.
8. Click the Save Changes button.
The options you just set are saved, and your blog is now at http://
yourdomain.com/blog (where yourdomain.com is the actual domain name of your site).
When you navigate to http://yourdomain.com/blog, a listing of your
blog posts appears.

This method of using the /blog page slug works only if you’re using custom

permalinks with your WordPress installation.if you
want more information about permalinks.) If you’re using the default perma-
links, the URL for your blog page is different; it looks something like
http://yourdomain.com/?p=4 (where 4 is the ID of the page you created
for your blog).

Read More

Assigning a static page as the front page

After you create the page you want to use for the front page of your web site, tell WordPress that you want the static page to serve as the front page of your site. Follow these steps:
1. Click Reading in the Settings drop-down list to display the Reading
Settings page.
2. In the Front Page Displays section, select the A Static Page radio
button.
3. From the Front Page drop-down list, select the static page that you
want to serve as your front page.
In Figure 2-4, we chose to display a static page, and the Welcome page is the one we want to appear on the front page of the Web site.
4. Click the Save Changes button at the bottom of the Reading Settings
page.
WordPress displays the page you selected in Step 4 as the front page of
your site.

Read More

Creating the Front Page of Your Web Site

✦ Custom Fields: Custom fields add extra data to your page, and you can

fully configure them. You can read more about the Custom Fields feature
in WordPress in Book IV, Chapter 5.
✦ Discussion: Decide whether to let readers submit comments through the
comment system by selecting or deselecting the Allow Comments text
box. By default, the box is checked; uncheck it to disallow comments on
this page.
Typically, you don’t see a lot of static pages that have the Comments
feature enabled because pages offer static content that doesn’t generally
lend itself to a great deal of discussion. There are exceptions, however,
such as a Contact page, which might use the Comments feature as a way
for readers to get in touch with the site owner through that specific
page. Of course, the choice is yours to make based on the specific needs
of your Web site.
✦ Author: If you’re running a multi-author site, you can select the name of
the author you want to be attributed to this page. By default, your own
author name appears selected here.
✦ Publish: The publishing and privacy options for your post, which we
cover in Book IV, Chapter 1.
✦ Page Attributes: Select a parent for the page you’re publishing. In Book
III, Chapter 7, we cover the different archiving options, including the
ability to have a hierarchical structure for pages that create a navigation
of main pages and subpages (called parent and child pages).
✦ Page Template: Mentioned in the section “Creating the Front Page of
Your Web Site,” earlier in this chapter. You can assign the page template if you’re using a template other than the default one (Book VI, Chapter 7 contains more information about themes and templates, including using page templates on your site).
✦ Page Order: By default, this option is set to 0 (zero). You can enter in
a number, however, if you want this page to appear in a certain spot
on the page menu of your site. (If you’re using the built-in menu feature

in WordPress, you can use this option; but you don’t have to use it because you can define the order of pages and how they appear in your menu by assigning a number to the page order — for example, a page with the page order of 1 will appear first in your navigation menu, where a page with the page order of 2 will appear second, and so on.
✦ Featured Image: Some WordPress themes are configured to use an
image (photo) to represent each post that you have on your blog. The
image can appear on the home/front page, blog page, archives, or any-
where within the content display on your Web site. If you’re using a
theme that has this option, you can easily define a post’s thumbnail by clicking the Set Featured Image link below the Featured Image module on the Add New Post page. Then you can assign an image that you’ve uploaded to your site as the featured image for a particular post.

Read More

Creating the static page

To have a static page appear on the front page of your site, you need to create that page. Follow these steps:

1. Click Add New in the Pages drop-down list.
The Add New Page page opens, where you can write a new page for your WordPress blog, as shown in Figure 2-3.
2. In the Title text box, type a title for the page.
3. Type the content of your page in the large text box.
4. Set the options for this page.
We explain the options on this page in the following section.
5. Click the Publish button.
The page is saved to your database and published to your WordPress
site with its own, individual URL (or permalink). The URL for the static
page consists of your blog URL and the title of the page. For example,
if you titled your page About Me, then the URL of the page is http://
yourdomain.com/about-me.

The Page Template option is set to Default Template. This setting tells

WordPress that you want to use the default page template (page.php in
your theme template files) to format the page you’re creating. The default
page template is the default setting for all pages you create; you can assign
a different page template to pages you create, if your theme has made dif-
ferent page templates available for use. In Book VI, Chapter 6, you can find
extensive information on advanced WordPress themes, including informa-
tion on page templates and how to create and use them on your site.

Read More

Creating the Front Page of Your Web Site

For the most part, when you visit a blog powered by WordPress, the blog
appears on the main page. Lisa’s personal blog at http://lisasabin-
wilson.com, powered by WordPress (of course), shows her latest blog
posts on the front page, along with links to the post archives (by month
or by category).
But the front page of Lisa’s business site at http://ewebscapes.com, also
powered by WordPress, contains no blog and displays no blog posts (see
Instead, it displays the contents of a static page that Lisa cre-
ated in the WordPress Dashboard. This static page serves as a portal to her
design blog, her portfolio, and other sections of her business site. The site
includes a blog, but also serves as a full-blown business Web site, with all
the sections Lisa needs to provide her clients the information they want.
Both of Lisa’s sites are powered by the self-hosted version of WordPress.org, so how can they differ so much in what they display on the front page? The answer lies in the templates in the WordPress Dashboard.
You use static pages in WordPress to create content that you don’t want to appear as part of your blog but do want to appear as part of your overall site (such as a bio page, a page of services, and so on).

 

Creating a front page is a three-step process: Create a static page, designate that static page as the front page of your site, and tweak the page to look like a Web site, rather than a blog.

By using this method, you can create unlimited numbers of static pages to build an entire Web site. You don’t even need to have a blog on this site, unless you want one.

Read More