Category: WordPress Basics

How to Add Video

It is possible to upload video directly into WordPress, just as you would upload an image. You do that with the Video block.

However, I generally recommend uploading your video to YouTube or Facebook and then embed that service’s video player in your web page. Those services are better at handling the uploads of very large video files and optimizing them for display on the web.

You can do the same thing with several other video publishing services (for example, Vimeo), but I’ll offer details on these two examples.

How to Add a YouTube Video

Do one of the following:

• Add the YouTube block. Paste the public link to your video into the text box labeled Enter URL to embed here. Click the Embed button.
• Paste the public link to your YouTube video onto a blank line. WordPress will automatically embed the video player. This is the shortcut I typically use.

A preview of the video should appear within the editor. You can add a caption just as you would for an image.

How to Add a Facebook Video

Do one of the following:

• Add the Facebook block. Paste in the web address for the video and click Embed.
• Paste the web address for the video on a blank line. WordPress will recognize that you’re trying to embed a video.

As of this writing, WordPress does not display a preview for Facebook videos within the editor — just a placeholder where the video will appear. However, when you publish or preview the post, it should appear on your public website.

Click below the Facebook URL placeholder displayed in the editor to add a caption for the video.

Caution for YouTube and Facebook

Make sure the content you embed is publicly accessible.

On YouTube, you can embed content that is designated Public or Unlisted (does not appear in YouTube search results) but not Private.

Any Facebook content you post should be shared as Public (not only visible to you and your friends).

1. Add an Image block. See above for how to add a block.
2. Click Upload to upload an image from your computer or Media Library to pick a previously uploaded image. More rarely, you may use Insert from URL to add the address of an image hosted on another site.
3. Click directly below the image to add a caption. A caption adds context, such as the names of the people in a photo.
4. Check the Image Settings in the sidebar displayed to the right of the content editing area. If it’s not displayed, you can click on the gear icon to reveal it.

Image Options on the Sidebar

• In the Alt Text (Alternative Text) box, type a description of the image. This helps search engines, as well as web tools for the blind, understand the content of the image.
• Choose whether to display the full size image or a smaller version of it.

Image Button Bar

A couple of additional options, for changing the image alignment, and adding a link, are displayed on a formatting button bar that appears when you hover your mouse over an image.

• Change Alignment: The image button bar screen shot is an example of an image aligned to the right (with text wrapping around it). The image has also been reduced to the Medium size option (control in the sidebar).
• Add a Link: You can enter any web address — for example, to link from the logo of a sponsor to the sponsor’s website. Alternatively, you can add a link to the image itself, allowing people to click to see or download the full size image. Or you can link to the the attachment page, which will display the image by itself within your website layout.

Other Ways of Adding Images

WordPress also offers built in Gallery and Slideshow blocks for adding multiple images.

In addition, you can embed images from services like Instagram and Flickr (see the section on embedding social media content, below).

The WordPress editor organizes content into blocks representing different content types. The default block is the paragraph. When you create a new post, enter the title, and hit ENTER, and start typing in the main content area of the editor, you are creating paragraph blocks.

To add other types of blocks, click the + button (appears both at the top of the page and in the margin when you add a blank line).

The block selector shows a selection of frequently used blocks. If you don’t see the content type you are looking for, you can enter a search term. For example, typing “image,” “photo,” or “picture” reveals the blocks for adding a single image or a gallery images, or other relevant content types.

Part of the point of the different blocks includes controls specific to that content format. The blocks for agenda roles and content used in the WordPress for Toastmasters agenda editor take advantage of this same concept. For example, the blocks for paragraph and heading include some of the same text controls (bold, italic, and link), but the heading block lets you choose the heading level. Similarly, an image block would let you size the image, format the image, and add a caption.

If you don’t see the sidebar, click on the gear icon in the upper right corner of the editing screen to reveal it. Note that there are actually two tabs to the sidebar, one for block properties and the other for document the properties of the document (like the categories of the promised land).

Some blocks, including paragraph and heading, include a transform button, which will be the first button on the formatting bar. Hover your mouse over it to see the options you can choose from. For example, if you typed in a paragraph but now want to display it as a heading or the first item in a list click the appropriate Transform To: choice.

Shortcut for adding blocks: If you know the name of the block type you want to add, enter the “/” character at the beginning of a line and start typing the name. After you’ve entered the first few letters, you should see an option to choose a block type. Click the one you want.

Inserting Between Existing Blocks

When working with text content, you can typically add a new block just by hitting enter at the end of a paragraph. However, when trying to squeeze content in between other types of blocks — for example, to add text between two images stacked one on top of another — you can use the additional + buttons that pop up when you hoover your mouse between any two blocks.

Another method that comes in handy is using the drop-down menu revealed by clicking the 3 buttons over a block. It includes “Insert Before,” “Insert After,” and “Remove Block” options.

That same button bar includes Move Up and Move Down buttons for moving any given block of content up or down.