Category: WordPress Basics

This is an advanced technique for more experienced webmasters.

See Adding Custom CSS Through the WordPress Customize Utility

Search engine optimization and social media integration are huge topics in their own right, but there are a many optional WordPress plugins that will help you achieve the basics.

The two I recommend are:

• Jetpack, a bundle of optional features from the makers of the WordPress software (and the operators of WordPress.com). Jetpack offers a number of features to help speed up and secure your website. In addition, you can turn on an option for displaying social sharing buttons for Twitter, Facebook and other social sites. You want to make it as easy as possible for website visitors to share your content.
• Yoast SEO, one of the most popular search engine optimization plugins. Yoast also includes features for optimizing how your content is seen on social media. It will show you a preview of how your content will be displayed in search results and social media. You can alter that default presentation to include a different image, headline, or text snippet than each service would use by default.

Note that Jetpack and Yoast SEO are both offered as free plugins, but with an upgrade path to paid enhancements. Particularly for a volunteer, nonprofit website, my advice is to see what you can do with the free versions before you even think about paying for extra bells and whistles.

You can add links to text within paragraphs, headlines, and captions. You can also add links to your images (as discussed in the section on images).

Good websites link to other good websites, making the web as a whole a richer place. Adding appropriate links can help your search engine optimization by showing the connection between your website and related websites with greater authority (like the connection between your club and Toastmasters International). Add links that will be helpful to readers. For example, a blog post on effective use of PowerPoint might link to other tutorials and resources such as books on the topic.

The trade off is that readers may click on links that lead away from your website. When marketers create “landing pages” to promote a specific offer, they typically place them on a page that includes few if any links that might take a visitor away from the form the marketer wants them to fill out. A blog post or event post for a club open house probably should minimize the use of links that might distract from your purpose of convincing a website visitor to become an in-person visitor.

On the other hand, one of the most powerful ways of building engagement with a website visitor is by presenting links to other relevant content on your own website.

At the same time, don’t be too greedy about keeping visitors on your website. If you make a strong enough impression, they will come back. You can also use the “Open in New Tab” technique explained below so that even as they follow the link, your website will remain open in the browser.

How to Add a Link

1. Highlight the word or phrase you wish to add a link to and click the chain link icon.
2. Type or paste in the link. Hit ENTER or click the Apply button.

Alternative for Adding Internal Links

1. Begin typing the title (or key words from the title) of a page or post from your site.
2. WordPress searches the content on your site, displaying possible matches in a drop-down list.
3. Click the one you want, and the link address will be added automatically.

Open in New Tab

The Open in New Tab option is displayed and hidden using the up and down arrows at the end of the link entry / link editing control. Toggle this option on or off, depending on whether you want the link to open in a separate browser tab.

Editing or Removing a Link

Once you have added a link, you can select the linked content and click on the pencil icon to edit it.

To remove a link, select the linked content and click on the broken chain (Unlink) icon.

Keyboard Shortcut

Another way of adding a link is to select a word or phrase, and click CTRL-K (Windows) or Command-K (Mac). This has the same effect as clicking the chain link icon. This has the advantage of being a shortcut that WordPress has in common with Microsoft Word and other software.

As a rule, numbered lists make sense for procedures that should be performed in a specific order. Bullet lists are appropriate for presenting a list of points or options that are not inherently sequential.

Add a Bullet List

Do one of the following:

• Add the List block. A bullet list is the default. Begin typing your list of bullet points.
• Add an * followed by a space on a blank line. WordPress interprets that as you starting a bullet list.
• Highlight one or more paragraphs you want to turn into a list. Use the Transform option and pick List.

When you are done adding bullet points, hit ENTER twice to go back to paragraph editing mode.

Add a Numbered List

The procedure is similar to the one outlined above. To make it a numbered list, rather than a bullet list, do one of the following:

• Use the button bar that appears when you hover your mouse over the list block to switch from bullet list to numbered list.
• On a blank line, enter “1.” (including the period), followed by a space. WordPress interprets that as a signal that you’re starting a numbered list.

Indenting List Items

You can increase and decrease the indenting of individual list items to create more elaborate outlines of posts.

Long posts and pages should include headings, or subheadings, to organize your text and allow readers to scan and skip ahead to the parts they are most interested in.

Google and other search engines also analyze your headings and subheadings to understand the structured and emphasis of your content. Well organized content is likely to rank higher in search results and be displayed with more meaningful content previews.

How to Add a Heading

1. Do one of the following:

• Add a Heading block
• Use the Transform option of a paragraph block to turn it into as Heading block.

2. Choose the heading level. H1 is normally reserved for the top headline of your page or post. H2 is a major heading, while H3, H4 might be subhead levels within an H2 topic.

Example: How to Add a Heading is an H3 subhead under the “Break Up Text with Headings” H2 heading.

Another special effect to consider is embedding social media content: public Facebook posts or Twitter tweets. This can be a way of quoting from famous social media feeds, or displaying a testimonial about your club that originally appeared on social media. Or it could be an image originally shared on Instagram.

The procedure is the essentially the same as for embedding a video:

• Use one of the blocks provided for Twitter, Facebook, Instagram, and other services. Paste in the web address and click Embed.
• Paste the web address of the social media post on a blank line, and WordPress will infer that you’re trying to embed that content.

See the full list of services for which WordPress supports embedded content at https://wordpress.org/support/article/embeds/

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.