Content Implementation

BIG EMPTY GAPS ARE

UNPROFESSIONALThis lesson will show you how to fill the page.

BIG EMPTY GAPS AREUNPROFESSIONALThis lesson will show you how to fill the page.

Yuck! Look at this big, nasty

gap next to our video. This looks unprofessional.

Let’s fix it!

In Safari, click on the Safari menu and choose the “Preferences” option.

Click on the Advanced tab and ensure the “Show Develop menu in menu bar” box is checked.

Close out of Preferences.

In Safari, select the Develop menu, and click on the “Show Web Inspector” option.

You should now see the Web Inspector panel appear in Safari.

Click on this hand pointing

tool in the Web Inspector Panel.

This Column is 600 pixels wide.

This is all we need to know.

Using the hand pointing tool, move your mouse over the left column of your website. If you look, it will tell

you how wide this column is in pixels. The only number we need from here is the first number on the left.

Remember, each theme is unique. Your column could be 700, or 500 pixels wide. Don’t simply use 600 pixels

because the theme used in this tutorial does.

In YouTube, lets click the “Share” option on the video we wish to use on our site.

Oh no! This video is not the right size. Let’s go ahead and change it by clicking on the “Video Size” options.

Select the “Custom Size” option from the drop-down box.

Let’s make the video size the same width as the content column of our website. Don’t worry about height, it

changes automatically.

Now we can copy the embed code from YouTube.

On the respective page in your WordPress Dashboard, select the “Text Tab” and them paste in the embed code

from YouTube.

Paste the code in this box.

Yay! This looks much better!

No nasty, empty gaps. w00t!

Remember, the purpose of this project is to demonstrate your skills as a Public Relations

Professional. Don’t simply slap media elements all over your page, and not explain their purpose. You

must explain why the respective media element was used. What purpose did it serve? What goals

were met?

Umm, what was the purpose of this video? What goals were met?

What was the objective? There is no text here that explains anything. That’s BAD!

Make sure you are clearly describing the media element’s purpose directly under the media element.

Simply type a paragraph under it. Make sure you type it under the “Text” tab.

Only Use Visual Tab to Tweak

The Visual Tab is only meant for tweaking, not inserting your content. ONLY INSERT CONTENT WITH THE

TEXT TAB.

Much better! Adding text also made this page SEO friendly!

Inserting Imagery

Yuck! Look at this big, nasty gap next to this

image. Why is this image so small? This looks

unprofessional. Let’s fix it!

When you are uploading a new image, this is the

perfect time to add captions to the

photo. Don’t leave it blank.

Oh no! This is not the right image size. It needs to be at least as wide as

our column.

First, let’s type our caption in the Caption Box. Remember to

answer the 5Ws. Don’t forget the

photo credit.

You can copy and paste the

caption into the description box

too.

For the “Size” drop-down box, we want to make sure our image

is just a size bigger than our column size. In our case, our

column is 600 pixels wide, so we will select the Large option from

our drop down box.

You don’t want it to be too large. That will make the image load very slowly, and that is bad

for SEO.

Now that we have inserted our image, let’s click on the “Visual Tab”.

Move your mouse over the image, and you should see an “Edit Image” icon appear in the upper left hand

corner. Go ahead and click on this button.

Oh no! This is not the right

size. Let’s make it the same size as our column.

In the dialog screen that appears, click on the “Advanced Settings” tab at the top.

Change the “Width” size to match the size of

your column.

Delete anything that’s in the

Height box and leave it empty.

Scroll down, and click on the “Update” button.

Click the “Update” button to update this page.

Yay, this looks much better. No

empty, nasty gaps.

Inserting Text From Word

Don’t simply link your audience to a document. That’s lazy, and will also hurt your page rank. Take the text from the document, and paste it onto the

page.

Yuck! Look at this big, nasty

gap in our text. This looks

Unprofessional!

Yuck! Triple Spacing? This

looks ugly. Let’s do this the right

way!

Copy your text from Microsoft Word.

Paste the text on its respective page under the “Text” tab. DO NOT PASTE UNDER VISUAL TAB. THE

VISUAL TAB WILL SCREW UP YOUR FORMATTING.

Make sure you get rid of any unnecessary

spaces.

To Tweak your text (bold, italicize, link, underline), click on the “Visual” tab.

Make sure any subheadings you have are bolded. There should not be any spaces under your subheadings.

Click the “Update” button when you are finished.

Go to the page you just edited. Make sure that all of the text is aligned to the left, and not centered. Verify

there are no awkward spaces, or gaps.

Insert the remaining content into your website using the guidance given to you from this lesson.

RememberBig empty gaps are your enemy. FILL THE PAGE!