sccc.premiumdw.com

ITC298 > Uploading Images & Galleries in WordPress

What would any blog designed to keep your mother informed be without pictures? Luckily, uploading and displaying images is easy to do in WordPress as well.

WordPress makes it easy for you to add images to your WordPress site. You can upload them directly from within WordPress by using the built-in file uploading utility in the post screen.

— http://codex.wordpress.org/Using_Images

Uploading Images

For this lecture, we will need some sample image files to work with. Go ahead and download my sample gallery image files to use.

Since we are going to add images to this sample posting we are working on, let’s go ahead and click the “edit” link:

Now that we are back in the Posts Edit SubPanel we need to click the upload/insert image icon:

Once we have clicked the upload/insert image icon, we will be brought to the “Add an Image” dialogue box:

You will see three tabs in this dialogue box:

1. From Computer: allows you to choose an image that is on your hard drive
2. From URL: allows you to insert an image into your post via that image’s URL
3. Media Library: allows you to choose an image that you have already uploaded

For now, we are going to stay on the “From Computer” tab. Go ahead and click on the “Select Files” button. You should now be able to search your hard drive for the proper image that you would like to use.

Once you have chosen your image from your hard drive, you will see the details for your image:

After the file has been uploaded you will be able to set your image’s:

1. Title: this will be written as the value of the “title” attribute in your image tag
2. Caption: a “caption” can be associated and displayed with your image
3. Description: a “description” can be associated and displayed with your image
4. Link URL: you can set your image to link to the original image, the posting or any URL of your choosing
5. Alignment: you can set your image to float left, float right or sit in the center via a class
6. Size: you can choose the display size of your image

See Also: http://codex.wordpress.org/Using_Images#Styling_Images_in_WordPress

Once you have set the details for your image, go ahead and click the “Insert into Post” button.

Once you have clicked the “Insert into Post” button, you will see the image in your RTE:

When you update your post, you will see this image on your web page:

Creating a Gallery

Having a photo or an image appear with your posting is nice. But what if Mom wants to see all of the photos that you took on that trip?

WordPress will allow you to insert multiple images into a posting as a “Gallery” that you can display in various ways.

To start your gallery, you can select to upload multiple image files at one time:

When you scroll down to the bottom of the “Add an Image” dialogue box, you will see the “Gallery Settings” to work with:

For now, lets leave the “Gallery Settings” as is and click the “Insert Gallery” button.

When you click the “Insert Gallery” button, you will see the gallery icon in the RTE for your post:

When you take a look at your web page, you will see thumbnail images of the Gallery you have just set:

Clicking on any one of the thumbnail images will take you to a slide show of your galley:

This isn’t the prettiest gallery in the world, but it is definitely a start. We will see how to customize the display of your gallery when we get to Using & Customizing a WordPress Theme and even explore some more options when we get to The Many Plugins for WordPress.