Lesson 6: Plugins

Learning how to add functionalities to your website through WordPress plugins.

Introduction to plugins

Hi and welcome back. In this lesson, I’ll cover the basics of plugins and show you how to install two of my favourites Jetpack and Yoast. Jetpack is crucial to setting up Portfolios in WordPress, which is why this lesson has several videos.

First, what exactly is a plugin? Well, it’s a lot like a phone app, that gives your phone more functionality than what came with it when you first bought it. WordPress is like your phone’s operating system, which comes with some apps (or in this case, features) built-in, and some that you’ll need a third-party software to get. The version of WordPress without any additional plugins is called WordPress core. WordPress core is updated a few times a year, and each release comes with new features and enhancements. 

Like apps, plugins can be free, paid, or on a subscription model. Some plugins are created by plugin companies who create and maintain the software as their business, and other plugins are created by freelance developers just trying to share their code with others who might benefit from it. 

In any case, if you have something you need to do, chances are, there’s a plugin for it. To search the official WordPress plugin repository, click on plugins and add. But not all plugins are created equal, so here are a few tips when picking plugins. The repository has rules to be added, so already, you can feel more confident about picking a plugin in there. What I look at before choosing a plugin are 1) stars 2) active install and 3) how recent was the last update, so I can tell if it’s being actively maintained. 

Two of my recommended plugins for bloggers are Jetpack and Yoast SEO. Both of these have free and paid versions, so I’ll show you the free ones, how to use them and install them, and you can decide to upgrade later if you feel the need as your site grows. 

Installing Jetpack and introduction to the added tools

In this video, I explain what plugins are and guide you through the setup of Jetpack, the free version. Hot tip, if you do choose to upgrade your Jetpack subscription in the future, follow them on social media to catch a 20-30% off sale.

Once Jetpack is installed and activated, you have to activate the modules you want to use. To do this, go to the Jetpack section on your dashboard, and at the bottom go to Modules.

Here’s a list of Jetpack feature categories (that’s right, there’s even *more* when you follow the links) for you to explore:
Utilities
Blocks
Extra Widgets
Custom Post Types

For more Jetpack support, you can view their support documentation here.

With Jetpack modules activated, you’ll notice extra features in the Jetpack settings area of your dashboard. You now also have additional blocks available when editing your posts and pages and additional widgets when editing widgets in the Customizer.

Widget visibility

Beyond adding widgets, Jetpack also unlocks widget visibility. This means you can add conditional logic to a widget you add to a widget area so it only shows up on certain pages. Widget areas are consistent throughout your whole site and are theme-specific. Most often, this includes your footer and sidebar. By adding visibility parameters, you can choose to hide or show specific widgets based on the category of the post, tags of the post, type of content (post, page, testimonial, or portfolio item) and more.

Using Jetpack to add Portfolio projects

The Portfolio custom post type is the biggest reason I recommend using Jetpack when building portfolios. It allows you to use the Portfolio type on the WordPress backend, which looks a little bit like a blog post, but has its own features too. It also enables the use of shortcodes, which you can learn more about here.

For a list of shortcode attributes, click here.

This video may be a little tricky, so feel free to re-watch it as many times as needed, and even slow it down as you replay it.

There are 3 main ways you can organize your portfolio:

First method: By linking directly to portfolio types, tags, and archive pages (i.e. Portfolio categories) in your menu, which will take you to archive pages.

Step 1: Create your Portfolio Project Types under Portfolio > Project Types. You can also organize tags in the same way under Project Tags. Your slug is the unique URL address you’ll use to reach that archive page. For example, if the slug is photography, then you can pull up the archive page of all projects with the photography type by going to yoursite.com/portfolio/photography.

portfolio project type

Step 2: Check off the correct Portfolio Type and Tags when creating or organizing portfolio projects. This will appear in the Project tab of the right-hand settings.

portfolio types in editor

Step 3: Add links to these Project Types and Tags archive pages in your menu. Here’s an example of how your site’s custom URL’s look:

Portfolio Archive – yoursite.com/portfolio/
Single Project Page – yoursite.com/portfolio/project-slug/
Project Type Archive – yoursite.com/project-type/project-type-slug/
Project Tag Archive – yoursite.com/project-tag/project-tag-slug/

Then, organize your menu links according to your portfolio’s information architecture.

portfolio menu

Second method: Create landing pages with shortcodes

Step 1: Create a page for a specific genre or category of portfolio projects, for example, Photography.

Step 2: Create your portfolio projects. Make sure they are properly tagged and categorized.

Step 3: Use shortcodes to display the projects of your choice. Add the shortcode block and then use the attributes to control which project types and tags to display and how.

shortcodes

Attributes

  • display_types: display Project Types – displayed by default. (true/false)
  • display_tags: display Project Tag – displayed by default. (true/false)
  • display_content: display project content – displayed by default. (true/false)
  • display_author: display project author name – hidden by default. (true/false)
  • include_type: display specific Project Types. Defaults to all. (comma-separated list of Project Type slugs)
  • include_tag: display specific Project Tags. Defaults to all. (comma-separated list of Project Tag slugs)
  • columns: number of columns in shortcode. Defaults to 2. (number, 1-6)
  • showposts: number of projects to display. Defaults to all. (number)
  • order: display projects in ascending or descending order. Defaults to ASC for sorting in ascending order, but you can reverse the order by using DESC to display projects in descending order instead. (ASC/DESC)
  • orderby: sort projects by different criteria, including author name, project title, and even rand to display in a random order. Defaults to sorting by date. (author, date, title, rand)

Step 4: You can create a different page for each type and add each page to your menu like a normal page or add several custom shortcodes to a single page.

Third method: Create landing pages with links or shortcodes

Step 1: Creating a page to showcase your portfolio types

Step 2: Create your projects

Step 3: Add text links or images linked to each portfolio project on the portfolio type page. You can also use the archive page URLs from method 1 as custom links. For example, add an image to represent a project, link the image to that project as seen below. Repeat for all projects you want to feature on that page.

linked portfolio items

However you choose to display your portfolio projects, it’s always helpful to map out how you want to organize the projects, categories, types, and structure on paper before you proceed. I also recommend always adding an excerpt and a featured image to every Project so they always look good when displayed through a shortcode.

Using Jetpack to add Testimonials

Testimonials are another Jetpack custom post type that you can link to using hyperlinks or display with testimonial shortcodes.

Just like Portfolio projects, testimonials generate archive pages on your site by default.

These are:
Testimonial Archive – yoursite.com/testimonial/
Single Testimonial Page – yoursite.com/testimonial/testimonial-slug/

When using shortcodes, follow the same instructions as with portfolio projects.

You can use the following shortcode attributes with testimonials.

Attributes

  • display_content: display testimonial content. (full/true/false)
  • image: display the featured image. (true/false)  Defaults to true.
  • columns: number of columns in shortcode. Defaults to 1. (number, 1-6)
  • showposts: number of testimonials to display. Defaults to all. (number)
  • order: display testimonials in ascending or descending chronological order. Defaults to ASC for sorting in ascending order, but you can reverse the order by using DESC to display testimonials in descending order instead. (ASC/DESC)
  • orderby: sort testimonials by different criteria, including author name, testimonial title, and even rand to display in a random order. Defaults to sorting by date. (author, date, title, rand)

Of course, you can bypass this altogether and decide to display testimonials using plain text and an image. There are other blocks in the editor that can help you achieve this goal like text, columns, quotes, and images.

quote example
In this example, I added a two-column block with an image block in the left and a quote block in the right.

Installing Yoast SEO

Although Jetpack does have some Search Engine Optimization (SEO) features, the gold standard for WordPress SEO plugins is Yoast. It has tools that allow you to prepare your website for search engines to index and rank your content so people can find it. It also has great tools for individual posts and pages, so you’re really optimizing each piece of content for search engine optimization. If I could go back in time and give myself one piece of advice as a site owner, it would be to really put in the extra love and attention to each post to optimize it to the max. 

Yoast SEO has free and paid versions, but like Jetpack, the free one is rich with useful features. This video will give you a quick tour and show some of the strongest features for bloggers. Yoast’s blog and lessons are also a great source of knowledge on all things search optimization.

If you’re curious about how to really optimize your site for search engines, you’re in luck, that’s what he’ll talk about in the next video.