User Management

In this workshop, we will explore the different WordPress user roles. Knowing the differences is important as it will help you keep your site protected, and ensure that your team of editors and contributors are informed about their abilities and the part that they play.

Learning outcomes

  1. Explain the five roles and capabilities.
  2. Recognize how the Dashboard changes for different user roles.

Comprehension questions

  1. What roles can be assigned to users?
  2. Does the Dashboard change depending on your user role?
  3. How do you create a new user account?
  4. When deleting a user, what can you do with their existing content?

Transcript

Hi and welcome to Learn WordPress. Today’s topic is User Management. In WordPress, you can assign roles, which was designed to give the site owner the ability to control what users can and cannot do within the site. There are different roles to explore, and each role is allowed to perform a set of tasks. Knowing the differences is important, as it will help you keep your site protected, and ensure that your editors and contributors are informed about their abilities and the part that they play.

In this video, we will explain five roles and their capabilities, and explore what the Dashboard looks like from the perspective of each role. The five main roles you can assign are the Administrator, Editor, Author, Contributor, and Subscriber.

Let’s start with the Administrator. Upon installing WordPress, an administrator role is automatically created and it is somebody who has access to all the administration features within a single site. For multisite owners, the Super Admin has these capabilities. Next, we have the Editor. The Editor is somebody who can publish and manage posts, including the posts of other users. An Author on the other hand, is somebody who can only publish and manage their own posts. Then we move on to a Contributor. This is somebody who can write and manage their own posts but cannot publish them. And lastly, a Subscriber is somebody who can only manage their profile, and it’s usually meant for subscription-type websites.

The Administrator is at the top of the WordPress ladder, and there’s usually only one per website. As mentioned, the Administrator is somebody who has access to all the administration features within a single site. The Administrator can publish, edit, and delete posts and pages, edit code, they can manage media, plugins, themes, other accounts and settings. They basically have the keys to all the doors of the site. The Administrator can update their profile top right of the dashboard page or by making their way to Users, clicking on Profile and making the necessary updates there.

The Administrator also has the power to create and manage other users. To create a new user click on Add New. On the Add New User Page, create a new user by assigning them a username, a valid email address, and any other optional details, then choose an appropriate role for this user. And when you are ready, click Add New User, a new user will automatically be sent a welcome email by WordPress with the new login information, including the generated password. The user will be prompted to log in and to change their password to one of their likings.

To change the role of an existing user, you can select Edit, open the role drop-down and select a different role or no role for the site at all. If you would like to change the role of multiple users, you can use the checkboxes to the left of the user to make the changes simultaneously. If you delete a user, you have the option to delete all the content they have created, or to reassign it to a different user. And once you have made your choice, click on Confirm deletion.

To customise the view of the users table, click on Screen options top right. Here you can specify which columns you would like to view and the number of users you want to view per page, and once you are done, click Apply. It is possible to give visitors to your website the ability to register their own accounts to minimise the need for you to create new users. This is usually used for the Subscriber role. To do that, go to Settings and click on General, and next to New User default role make the necessary changes.

Editors have a high level of access as they usually manage content. Let’s see what the Dashboard looks like for an Editor. An Editor is someone who can create, edit, publish and delete posts and pages, including the posts of other users. They are also capable of managing media and comments. So what can’t they do? Editors cannot install themes, plugins or approve any updates. They also don’t have access to any site settings. Their role is to manage the work of other users and contributors.

The role of an Author is in the name, their role is to provide content to the site and nothing else. They are therefore only able to publish and manage their own posts and not those of others. As you will notice, they can upload media and create, edit, publish and delete their own posts. They also have the ability to create and delete Reusable blocks. Authors are therefore only in charge of adding content to a site and don’t have any administrative rights.

Let’s say you have somebody who is willing to contribute content to your site as a once-off, well then the role of Contributor is perfect for that individual. Seeing that they are not one of the Authors, they will only be able to write and manage their posts but cannot publish them. A Contributor cannot upload media files, and when they publish content, it will first be reviewed before publishing. As you will notice, it is almost the same as being an Author, but with a few more limitations.

The last role we will be looking at is the Subscriber. Subscribers only have access to managing their own profiles and nothing else. If we enter the Dashboard of a Subscriber, we will see they can only read all the posts on the site and change their profiles. This is not a role that will be used on many sites, mostly subscription-based websites.

And finally, you might also decide to search and install a user role plugin to extend this feature’s functionality.

All the best in managing the various user roles you wish to assign and visit Learn WordPress for more workshops and training material.

Managing Updates

In this session, we are going to learn how to identify when updates are available for a WordPress site and how to run those updates.

Learning outcomes

  1. Explain the three components of WordPress that may require updates.
  2. Identify when updates are available and where to go to make those updates.
  3. Recognize the need to make a backup of your site before updating it.
  4. Updating WordPress Core, plugins and themes.

Comprehension questions

  1. What can happen if you do not update your site?
  2. Do you know how to backup your website?

Transcript

Welcome to Learn WordPress. The question we are asking today, is what are updates and why do we need them? Updates to any software are released for three reasons. Number one, to fix security vulnerabilities. Two, to fix bugs that have been discovered in the code. And lastly, to add new features. We need to consistently install the updates that are available for our sites because all sites need security patches so that they are not vulnerable to known hacks. Additionally, all sites benefit from bug fixes because then they are running off a more stable codebase.

There are three components of your WordPress site that may require updates: WordPress Core, themes and plugins. You will be able to tell that there are updates available for your site in a few key places. Firstly, there will be a banner at the top of your administration page to alert you of any updates. Secondly, if you click on Updates within the WordPress admin, you will be able to view all your updates in one place. Plugins can also be administered from the plugins screen, you can go there by clicking on the Plugins button in the left side navigation. Once on this page, you will see a list of all the plugins that are installed and ready to be updated on your website, whether they are activated or not. When a new version of WordPress is available, there will also be a notification at the top left of your Dashboard, as well as the top banner and next to updates.

If we make our way to updates, we will see a very important message; “Before updating, please backup your database and files.” Backup simply means saving a copy of your site on a particular date and keeping it safe. If you have a backup, you can restore your website to its previous state if there are any issues when upgrading. You can learn more about making backups below resources. Two simple options, for example, are installing a backup plugin or logging into your hosting dashboard and following the quick steps to back it up there. It is therefore advised to backup your site before running any updates.

Now that I have backed up my site, I can go ahead and install the new version of WordPress. I will make my way to the updates page and click on Update to the new version, and now I know my website is safe and up to date. And lastly, we will update our themes and plugins. Once again, I will make my way to the updates page. I will scroll down to plugins, tick the Select All box and click on Update plugins. Once all my plugins are updated, I will return to the updates page. Scroll down to themes, tick the Select All box and click on Update themes. Once my themes are updated I can go back to the updates page and we will see that WordPress Core, plugins and themes are all up to date.

One last thing we want to talk about is enabling auto-updates. If you would like to enable auto-updates for WordPress Core, make your way to updates and click on Enable automatic updates for all new versions of WordPress. If you would like a theme to be auto-updated, make your way to Appearance, click on Themes, select the theme and click on Enable auto-updates. And finally, to auto-update plugins, make your way to plugins, and on the right-hand side, select Enable auto-updates.

That wraps it up for WordPress updates. Visit Learn WordPress for more workshops and training material.

Getting to know the WordPress Dashboard

In this workshop, we will be introduced to the WordPress Dashboard. We will briefly look at everything you need to know to start your WordPress journey.

Learning outcomes

  1. Familiarise yourself with the WordPress Dashboard and how to navigate it.
  2. Control the elements that appear on your administrative page.
  3. Clarity on the difference between posts and pages.
  4. Add and manage media in your Media Library.
  5. Manage post comments.
  6. Distinguish between the Site Editor and Customizer.
  7. Add and manage user roles.

Comprehension questions

  • What is the difference between the front-end of my site and the WordPress Dashboard?
  • Where can you add new users or contributors to your site?
  • What are the advantages of using plugins?

Resources

User roles and capabilities

Managing Settings: General

Managing Settings: Writing

Managing Settings: Reading

Managing Settings: Discussion

Managing Settings: Permalinks

Managing Settings: Privacy

Transcript

Welcome to Learn WordPress. Join us as we get more acquainted with the Dashboard. To log into your site, enter the following in a web browser address bar, fill in your details and click on Login. Once we log into the Dashboard, we can see the admin bar at the top, and when you hover over the WordPress icon, a dynamic menu with four links appear. WordPress.org links to the main WordPress site. Documentation links to the official WordPress support documentation. Support links to the support area of wordpress.org and Feedback links to the support forum on wordpress.org that is dedicated to requests and feedback.

The next icon on the admin bar is the home icon for your site and clicking on this takes you to the public-facing homepage of your site, and when you click on it again, it takes you back to your Dashboard. Then there are two notification icons: New comments and Updates will appear here. Hovering over New brings up a menu of links to create new items such as posts, media items, pages, or even adding new users, and the actual contents of this list depend on your user role. And all the way in the right corner of the admin bar you’ll see your username and Avatar, and from this menu, clicking on either your name or edit profile, it will take you to the Edit Profile page. Just below the dark grey admin bar are two tabs, the screen options tab and the help tab. The screen options tab appears on most administrative pages, and it allows you to control the elements that appear on that page.

In the body of the Dashboard, you’ll find a number of administrative widgets or panels, and you’ve seen how these can be shown or hidden using the checkboxes in the screen options tab. And their position can also be changed simply by dragging and dropping them where you want. As a note, this is just one of the possible WordPress Dashboard configurations. The Dashboard view will change based on what plugins you have active and your hosting company and how you personally configure it. When using the Quick draft widget, anything entered into this forum will be saved as a draft post, that is, it will be saved but not published on your site. This is very handy for jotting down quick ideas for posts that you would like to come back to and finish later. The At a glance widget gives you a quick total for the number of pages, posts and comments that are currently on your site. It also displays the current theme and the version of WordPress that you’re using. Activity shows your most recent posts and comments. And the WordPress events and news panel is a great way to get involved with the WordPress community. Based on your location, you’ll see a list of different WordPress related events and meetups.

Now the most common way of moving around in the admin area is by using the navigation links in the left sidebar. Some of these are used much more frequently than others, particularly posts, pages and comments. With that in mind, you’ll notice that more of the content focused menu items are located in the top section, whereas menu items focused on functionality, appearance and other settings are grouped together down at the bottom.

Next up, let’s talk about posts. Posts are what make your blog a blog. They are individual pieces of content on your blog page. When you publish a post, it will generally appear in reverse chronological order on your posts page so that when visitors come to your site, they will always be presented with the latest posts, and posts will change over time as you add new content. Pages, on the other hand, are for more static content. When you click on Quick edit, you can quickly change categories, tags and several other items. Trash moves the post to the trash folder, and you can recover anything that you’ve put into the trash for up to 30 days. You can use checkboxes next to the posts to perform actions on multiple items. You can also filter the list of posts by date, month, and year, and categories. Lastly, you can search for words or phrases that may be contained in your posts. Before we look at media, let’s talk about pages. So a page is for static content and the page generally will always stay the same, though just like a post, you can update it whenever you want. Pages are useful things like an about page, contact page or even something like the history of your site or company.

The Media Library contains all your media files, from images, audio files, Excel spreadsheets to PDF documents. You can display items in the grid view or list view. When you select Add new, and click on Select files, you can upload media from your computer, or drag and drop multiple files at the top. The only bulk action for the Media Library is to delete media items permanently.

Next up, we are going to talk about comments. When you click on comments, you will see a list of all the comments on your site. As you hover over each comment, you can see the different options that are available to you, such as approve, unapprove, reply, quick edit, edit, spam and trash. To the left, you can see the comment has information like their name, their Gravatar and their email address. As you move your cursor to the right, you can also see which post or page this comment was left on. And all the way to the right, you’ll find the date and time that the comment was submitted.

In the Appearance section, you can change your site’s theme. If you are using a block-based theme, you will have access to the Site Editor, which will allow you to create overall site structure. Check out the links below resources to learn more about the Site Editor and full site editing. But if you’re using a classic theme, you will have access to the Customizer, widgets and so forth. When you open the Plugins menu and click on Add new, you will be able to install, manage and uninstall plugins for your site. Under the Users menu item, you can manage users on your site. The different roles are subscriber, contributor, author, editor, and administrator, and you can learn more about these roles from the resources below. To learn more about settings, also follow the links below resources. We have published a series of Settings Workshops.

All the best as you start exploring and using WordPress. Visit Learn WordPress for more workshops and training material.

Choosing and Installing a Plugin

One of the biggest advantages of using WordPress is installing and utilising plugins to extend the functionality of your website. This workshop will explore how to search, review and install the right plugins to meet your needs.

Learning outcomes

  1. Recognize the variety of plugins available to extend your site’s functionality.
  2. Search, install and delete a plugin.
  3. Review and select well-built plugins.
  4. Identify how to find support for a particular plugin.

Comprehension questions

  1. What additional functionality or features would you like to see on your site?
  2. How do you identify plugin conflicts?

Resources

Plugin Directory

Plugin Detective

Health Check and Troubleshooting

Transcript

Good day and welcome to Learn WordPress. One of the biggest advantages of using WordPress is installing and using plugins to extend the functionality of your website. There are a variety of plugins available that can be used to add extra functionality around social media, analytics, security, marketing, SEO, and the list goes on. These plugins can help you get more out of your WordPress website and make it more dynamic. Maybe you would like to add a map, a feedback form, a contact form, to launch a multilingual website in minutes, build an e-commerce site or increase the speed of your site with caching. All of this can be achieved with the right plugins.

You can view all the 1000s of plugins available when you visit wordpress.org and browse through the plugins directory. While all of the plugins mentioned are free and available in the wordpress.org plugin repository, they may also have premium versions available at a cost that provide more functionality.

But let’s see how to choose and install a plugin when we are in our WordPress dashboard. Let’s make our way to Plugins and select Add New. This will open up on the featured page and you have the option to view the most popular plugins, recommended plugins and the favourites tab refer to any plugins that you or other WordPress users have marked as favourites. When you are ready to find a suitable plugin, use the search function at the top right of the page. If you type SEO for example, the repository gives you a list of plugins based on what you searched.

Now let’s talk about what to look out for when choosing a plugin. Let’s compare the three top plugins as all three are very good options based on the information presented. There are four important things to take note of. Firstly, the star rating. That refers to feedback from customers who installed the plugin. Secondly, when it was last updated. This indicates it is actively being supported and worked on. So I would suggest avoiding plugins that have not been updated in a long time. Thirdly, active installations. This indicates a popular and well-supported plugin. And then lastly, compatibility. Make sure the plugin is compatible with the version of WordPress you’re running. So as you can see, you can’t go wrong choosing any of these three plugins. They all have really good star ratings, they’ve been updated recently, they have lots of installations, and they are compatible with the version of WordPress I’m using, which is the latest version.

When you click on more details, you will be able to see how well supported a plugin is. There is also an area for frequently asked questions and a place where you can read reviews. Let’s search for a different plugin as an example of how to install and activate a plugin. We will go ahead and search for a forms plugin. Once again, there are various options to choose from. Contact Form 7, Contact Form by WP Forms and Ninja Forms all look like really good options based on the available information. I will go ahead and install Contact Form by WP Forms, and once it’s installed, you have to click on activate. And then of course, it’s time to set up the plugin. And when your plugin is set up, it’s a simple task using your Block Directory to add the form wherever you wish to.

Please note you can also easily add a new plugin by uploading a zip archive of the plugin from your local computer. Many premium plugins can be downloaded outside the WordPress plugin directory.

If you would like to stop using a plugin, you can go to your plugins section and click on deactivate, and once deactivated; you will have the option to delete the plugin permanently.

If you’re struggling to understand or set up a plugin, your best option for support is to go directly to the plugin’s creator to visit their support page. There you will be able to browse through all forum questions or create a new topic. For some plugins in the dashboard, you can find the support page and documentation page in the left sidebar, and for some, below the description. If you find the plugin that is causing a problem on your site, you’ll be able to isolate the specific plugin that caused the issue. There are two main ways to identify plugin conflicts on your site. Number one, manually deactivate plugins, and number two, use a troubleshooting plugin. I will add a few links to some troubleshooting plugins in the description below. But if you install well-built plugins and use the four criteria we discussed earlier, you won’t have anything to be worried about.

Plugins are awesome, and I trust you will find the right ones to meet your needs, and remember to visit Learn WordPress for more workshops and training material.

Applying Duotone Filters to Change Color Effects

In this workshop, we will explore how to use the duotone filter to create different effects on your images. You can choose colors from your theme’s palette, or a custom color of your choice.

Learning outcomes

  1. Applying a default duotone filter to an image or video.
  2. Using shadows or highlights to create a custom duotone filter.

Comprehension questions

  1. Why do duotone filters work better on high-contrast images?
  2. What are the benefits of using a duotone filter on your site?

Transcript

Hi, and welcome to Learn WordPress. Let me show you how to use this really cool feature called duotone. And if you haven’t heard of it, duotone means combining two colours as a filter and then applying it to an image or video background. Depending on your needs duotone can make your images pop, and it allows you to further your branding through colors and create even more striking designs. Let’s look at a few examples.

With duotone, you can completely change the look and feel of an image. In the next example, we will contrast two different types of duotone filters. You can even use the duotone filter in the Featured Image block to meet your design requirements. It’s a great way to bring character to your photos. Duotone can be anything from a simple greyscale to a mixture of any two colors. And something to take note of, the duotone effect works best on high contrast images. And don’t be worried, images and videos in your Media Library will remain unchanged, so the image or video is never modified in your library.

To add a duotone filter, click on the Inserter and select an image from your Media Library. When the image is selected, you will have access to your block toolbar. Click on the Apply duotone filter which appears as a dotted circle within the menu. You will see a few duotone filters that come with your theme. You can easily just click and it will make the change for you. And if you want to change it, click on the duotone icon again and select a new filter. If you would like to undo the changes you’ve made the image, go back to duotone and click on Clear.

You can also click on shadows or highlights and select one of the colors from your palette. So you can go ahead and change and modify your duotone filter to meet your requirements and design needs.

A duotone filter can be added to a video in the Cover block. So let’s go ahead and add a Cover block and select the video from our Media Library. And I will change it to wide width. And now we can follow the same process by selecting one of the default duotone filters or by creating our own and as you will notice, it really does have a remarkable impact on an image or video. And you can play around with the colours to find exactly what you are looking for.

So now it’s your turn to find the right do turn filter for your website. Visit Learn WordPress for more workshops and training material.

Managing Settings: Permalinks

Learn how to configure the WordPress Permalink Settings and to use a redirect plugin for established permalinks.

Learning outcomes

  1. Defining permalinks and slugs.
  2. Changing permalinks using the built-in WordPress settings.
  3. Modifying category and tag links.
  4. Redirecting links using a plugin.

Comprehension questions

  1. What is the difference between permalinks and slugs?
  2. Can you customize permalinks?
  3. How do you set up user-friendly permalinks?

Transcript

Good day, and welcome to Learn WordPress. Let’s talk about permalinks. But before we do that, let’s look at what we’ll be covering today. We will be defining permalinks, and slugs. We’ll be changing permalinks using the built-in WordPress settings, modifying category and tag links, and lastly redirecting links using a plugin.

So let’s get started. What are permalinks? Permalinks stand for permanent links. A permalink is a URL to your individual page or blog post, as well as categories and tags. Let’s see this in action. If I click top left to visit my site, we will notice that each page and posts has its own unique URL.

First up, we have our homepage URL, or permalink. Let’s move on to one of our pages and click on History of Travel, and here you will see the unique URL to this page. And as we move on to one of our other pages, you will notice that the permalink ends with the name of the page. Now we are going to focus our attention on posts. So let’s open up our first post The World Is Your Oyster. And as you will see, the permalink has a date as well as the name of the post. Let’s go back and open one of our other posts Go Local. And if we take a closer look, the permalink has the date and the name of the post. Lastly, let’s make our way to one of our categories that we’ve created, namely Travel. So what will a category permalink look like? The permalink ends in category and the name of the category.

The latter part of your URL is called a slug. And slugs can be defined as user-friendly names. It is the portion of the URL that refers to a specific page. Slugs tend to be very similar to the original title of the post or page or exactly the same. And take note, if a title is more than one word, spaces are replaced by a hyphen as the example here.

Let’s go to our Media Settings and look at how we can change our permalinks to a more readable or user-friendly format. When you are in your dashboard, go to Settings and scroll down to Permalinks. This will open up to your permalink settings and as you can see, our blog posts currently end with the day and name of the post. Let’s change that to only display the post name, and I think you will agree it’s easier to read. You can select one of the options available or create your own custom structure using the available tags. Once you have saved your changes, let’s go back to our website to see how the permalink structure for our blog posts has changed. So open up your blog post and as you will notice the date is no longer there.

Next you also have the option to change the permalink of an individual post or page. I have created a new blog post and called it Be On Guard And Vigilant As There Are Pickpockets Anywhere And Everywhere. And once we open our blog post, we have quite a long permalink. Let’s modify that to make it more user-friendly. Let’s return to our dashboard, open the post and in the sidebar settings, click on Permalink. The URL slug is the entire name of the post. So let’s replace that by typing in Pickpockets only. And once we click on Update, return to our site. Open the blog post and now the slug only displays Pickpockets.

Lastly, let’s discuss permalinks for categories and tags. Let’s open The World Is Your Oyster post. Scroll down and here you will see a category called Travel and a tag called Adventure. Let’s click on Travel; as we have seen before the permalink ends with category and the name of the category. Now if we go back and click on the tag Adventure the permalink ends with tag and the name of the tag. We can change the link structure by returning to our dashboard, Settings, and by clicking on permalinks again. At the bottom below Optional, it says, if you like you may enter custom structures for your category and tag URLs here. So instead of saying Categories, we can change it to something like Topics. And instead of your tag permalinks, saying Tags you can say Keywords for example. Let’s save our changes and return to our website. Open up the post and if we click on the travel category the permalink now says topics and travel, and not categories in travel anymore. And the same goes for the tag. Once we open the adventure tag, it now reads keywords and adventure, and not tags and adventure anymore.

Finally, we have to talk about redirecting permalinks. Make sure you only change link structures when a blog post or page is new. If you change an old permalink on an established website, visitors will not automatically be redirected to the new link. If you change the permalink of an old post and other pages on the web have linked to it, the old links will stop working. So if you don’t want to affect your search engine ranking or traffic to your established site, you need to make sure you install a plugin to redirect your old URLs.

Let’s make our way to Plugins > Add New. And in the search box, type in redirect links. There are different options to choose from, but I’m going to install an open-source plugin called Redirection. It’s got a good rating and more than 2 million installations. When you are ready, click on install and then activate the plugin. Once the plugin is installed, click on Settings. Then go ahead and click on Start Setup. Continue Setup. And once you’re ready, finish your setup. And lastly, click on Finished.

When you are on the Options page, click on Redirects top left. And here you can redirect old URLs. The Source URL refers to your old permalink or URL. And the target URL is your new URL that you will be using. Let’s use our Pickpocket post as an example. So next to source URL, enter the old permalink. And next to target URL let’s paste our on new permalink, and when your Add Redirect. So now when somebody clicks on your old link on an established site, they will be redirected to the new URL.

I trust you now have a better grasp on how to manage your permalinks. Visit Learn WordPress for more workshops and training material.

Intro to the Site Editor and Template Editor

This workshop provides an overview of how to access and use the Site Editor and Template Editor. The Site Editor is a new feature that allows block editor users to build their entire site with blocks, including using a few new theme blocks and customising it using a new styling system. The Template Editor is a feature that allows block editor users to edit and create templates that a page or post uses.

Learning outcomes

  1. Managing templates, template parts and global styles via the Site Editor.
  2. Editing, creating and assigning templates to individual posts and pages via the Template Editor.

Comprehension questions

  1. Have you installed a block theme with WordPress 5.9 or a classic theme that has opted into this feature?
  2. Why don’t you need access to the Customizer anymore?
  3. What is the difference between the Site Editor and Template Editor?

Resources

Site Editor

Template Editor

Transcript

Hi, and welcome to Learn WordPress. Today we are going to take a closer look at the Site Editor and Template Editor. If you have installed a block theme, such as Twenty Twenty-Two, and you’re ready to start your full site editing journey, you will notice that the Customizer has disappeared. But when you make your way to Appearance, you will see a new option, namely the Editor. And when you click on the Editor, you will be taken to the Site Editor. And here you are able to modify templates, template parts and also customise the style of your entire site.

The Site Editor provides a Template List View, as you will see on the left, allowing users to navigate between Site, which is your homepage template, templates, and all the different template parts. This is an important piece of the Site Editor puzzle, you will essentially be able to edit the design of your entire site. In order to switch what you are viewing, click on your WordPress icon or site icon top left. You will then be able to select between going back to your Dashboard, Site, which is your homepage template as mentioned, your list of templates and your list of template parts.

When you click on the Styles icon, you have the ability to change the typography and the colours of your entire site. And if you look down further below, you also have an option to customise the appearance of specific blocks for your whole site. Just to take note, Styles will be available to use regardless of what template or template parts you’re editing. If you click on Typography, you’ll be able to manage the typography settings for text and links. You can change the background colour of your site or the colour of text and links in one click. You will see at the top right it says ‘set a background colour or gradient for the whole website.’

How to manage templates via the Site Editor? Click on the WordPress icon top left and make your way to templates. Templates are groups of blocks combined to create a design for web page. Let’s open the Page template. You could also say templates can be described as a full page layout. That includes things like header, content and footer areas. Click on the List View. And at the top you will see the header and at the bottom of the page, your footer and in the middle your Post Content block. And it’s important to note that content is displayed by the Post Content block.

When you create a template, you get the best use when you separate the reusable parts from the dynamic part. The dynamic part is the content part that will change for every page that uses the template. The usable parts are the static parts of the template that will stay the same. For example, the header and the footer. In this example, I’ve updated the page template. And as you will see we have a new header template part, a new footer template part, and the Post Content block displays the content of the page assigned to this template.

Now let’s go and visit one of the pages that is assigned to this template. Click on the WordPress icon, Dashboard. Once in your dashboard, click on Love Travelling and this will take you directly to your site. And this is your homepage and the homepage is assigned to your homepage template. So let’s click on the History of Travel. And as you will see this page has been assigned to the page template and therefore this page has the same header and footer as your page template. And the content is being displayed by the Post Content block. Next up, let’s talk more about managing template parts. For context, a template part is best used to create areas like your header, footer and sidebar.

When we make our way to template parts, we will see template parts that we’ve created ourselves and template parts that have been provided by our theme. So the four template parts at the bottom of the list are the template parts provided by the Twenty Twenty-Two theme. And if you see a dot above the template part icon, you will know that this template has been customised. The page template at the top is the template part that I’ve created myself. So let’s go ahead and open up the template part that I’ve created. And you will recognise this template part from the page template that we have modified. Next, let’s open the footer template part provided by our theme, which I’ve customised.

Lastly, you might decide to add a new template part. And when you add a new template part you have an option between general, header and footer template parts. General template parts are not tied to any particular area. And remember to give your template part a descriptive name. Let’s look at how to add a Template Part block. I’m going to open up my 404 template which displays when no content is found. And as you will see, there is no header at the moment. So let’s open up the List View. And above the group block, I’m going to insert my Template Part block and once you select your Template Part block, you can choose an existing Template Part block or create a new one. Let’s choose an existing one, the one I’ve already created.

Finally, let’s talk about the Template Editor. The Template Editor lets you edit, create and assign templates to individual posts and pages. Let’s go and see how that works in practice. Click on the WordPress icon top left and return to the dashboard. Click on Pages and open up one of the existing pages. In the setting sidebar on the right, you will notice that the template that has been assigned to this page is the default template, which is your page template. You can also assign one of the other available templates. When you’re ready, you can edit the template of your choice.

When you click on Edit, it takes you into the Template Editing Mode. And you will know that you are in the Template Editing Mode when the template name is visible in the top bar. And secondly, the dark frame that appears around the template as you’re editing. But you also have a third option; to create a brand new custom template. It says describe the purpose of the template, example full-width, and custom templates can be applied to any post or page. You might decide to create a custom template for a landing page, or maybe for a portfolio page. Once you click Create, you will notice that the header looks different and there’s no footer. So you have a blank canvas to work from to create your own custom template. Just a reminder that Template Editing Mode unlocks the ability to switch between editing the content of an individual post or page and the template that the post or page uses.

We trust you now have a better understanding of how to use the Site Editor and Template Editor. Visit Learn WordPress for more workshops and training material.

How to Create a Menu with the Navigation Block

Are you ready to create a navigation menu? In Block Themes, you will use the Navigation Block to create a navigation menu while designing your site.

Learning outcomes

  1. Set up a navigation menu with a block theme.
  2. Arrange Navigation block items in a block theme.

Comprehension questions

  1. What kinds of blocks can you add to a navigation menu besides links?
  2. Where do you go to create a navigation block?

Transcript

To create a navigation menu using a block theme, we’ll need to do things a little bit differently than we did with classic themes. So to begin with, we’re going to use a block theme. In this case, we’re using your 2022. Before that default themes such as 2021, managed navigation menus in a different way. So we’re going to test this using a default block theme.

Once we have that activated and installed, we’ll go to Appearance Editor. And from there, you’ll see this is the way that my editor looks. Now I’ve done a little bit of preview work with demo content on my site. But what you see in the top header area is about the same as what you’ll see when you get started.

Using List View with Navigation Block

I’m going to turn on the List View in the top navigation that looks like the three horizontal stack lines that are slightly askew. And inside of that I can identify all of the blocks. I find this to be really helpful when I’m trying to select very specific things.

So I am clicking on the navigation option. And you’ll see that that’s showing me in the top header area that I can either select an existing menu or start with something from empty.

Existing Menus

If I select an existing menu, I can see that I have a few menu options that have already been created using a block theme. Also, I have some leftover navigation menus that came with previous themes that I’ve used inside of classic themes. So I can select either of those.

If I were to select for instance short, you’ll see that the navigation menu displays. And on the left hand side, I have specific blocks available to me with the drop downs showing underneath and I can get in edit and modify any of those.

Now I’m going to show you what happens if I select an existing menu that when it enters in looks like these are all individual links. But if I look on the left hand side, under List View, I see it says page list. page list means that my theme is treating this like it is all one block right now. That block is called page list. The links would show up individually on the front of site for website visitors. But according to my view, I can’t get into the individual ones and modify those. If you find this happens to you simply select edit and convert these from a page lists block to all the blocks. And now you can get in and edit individual ones or remove specific ones from your navigation menu.

I’m going to undo a few steps to get us back to this point. And for undo I’m using Command Z on a Mac, but Ctrl Z on Windows will probably work just the same. So I am back at this select menu. And that was how to set up an existing menu.

Create New Menu

If I were to create a new menu, I’m going to click Start empty. And when I do it begins with a plus symbol. I’m going to search for Front, because I know I have a page called front page. And I will select that now I’m not clicking on anything else. But on my keyboard, I’m going to hit Enter. And that gives me the chance to add an additional block. And maybe I see one here that has recently been updated. And I could select that option. And now for my next page, I’m going to select Contact

You’ll see that it doesn’t know the contact page. Here, I could either hit enter if I think that’s the right link, which it’s not. Or I could create a draft page, that would automatically start a page called contact for me. And if I needed to, I could edit the name of the link here. And I could also edit the address of that link. Both of these are good for now. So I’ve begun to draft for a page called contact. That’s great.

Add Additional Menu Items

When I have this blinking cursor, I’m going to the end of the block and I’ll hit enter again. And now it’s going to add an additional link. If you hit enter in the middle, sometimes it just breaks wraps the text around a little bit. That’s not what I’m after.

Here, I could choose to add in maybe some social icons, like go to my Facebook page, go to my Twitter account, something like that. I’m going to select the Search option. And I love that this is built into the navigation menu. So in this location I could type in a placeholder like the word search. And then when people come across that in my navigation menu, they can enter their information in and search to find whatever they want throughout my site. So that navigation is coming along well. I have a few options in this search block while I’m on that specific block of where I would like the button to be if I want it on the outside if I want it on the inside. If I don’t want the button, you have choices.

An additional tip for you here is that if you would like to move this toolbar out of your way, you can go to the options and enable top toolbar. In the top option, it says top toolbar, how convenient.

So I want to do this while I am creating some sub navigation menu items. So I’m selecting the block where I would like that sub navigation to appear. And I have an option to add sub menu. That’s the same toolbar as was floating below, it’s just out of my way now. So in this location, I can add in, for instance, maybe I would like this page to appear below. And then if I want a sub none menu off of that, here, I could go in and select some other page.

And you see that I can keep this chain going of adding a child of a child of a child all the way back up. So that begins the process of adding a sub navigation menu.

Adding Categories and Tags to the Navigation Menu

If you would like to add in a category or a tag, a good way to do that is to go back to your posts and look over your categories. So I want to post categories from the admin dashboard in a separate tab. And here I see that I’ve got a category called block, and I’ve got quite a few things that are inside of it.

When I select view, I can copy and paste that category link that appeared in my address bar. And if I would like to make that be one of my sub menu items, I can do that. And now I’ll hit enter. And so I might want to rename that to block category. And apply that link again, there’s the link. Great. So I have a block category created, I have some child menu is available as well. Another thing that you might come across is that if you would like to move this navigation menu, out away from the other things, maybe I want to put it at the top of my header by itself. And perhaps in the location down here. Maybe I don’t want the group and all of the row and all the things. So I’m actually going to remove that.

Add a Site Icon to Navigation Menu

And now my navigation menu is at the top of my site; I have a few things that I could do in here. So after I have the let’s collapse the Block Pattern after the block pattern, if I would like to add in a block or site logo, I could do that right in the middle of my navigation bar. And I will select this icon for the site logo. Look through my Media Library web already uploaded it. And now I have a site logo right in the middle of my navigation bar. Let’s bring that list view back so we can see, well, yeah, there is that site logo. So my navigation bar is starting to come together, it’s great.

I’m going to bring that top toolbar back into where the navigation menu is. And from here, I want to select the entire navigation. You’ll see that we’ve got that circle option. So if I’m on an individual thing, and I click select navigation, it will select the whole navigation. You can also get there from the List View as well. In this area, you could choose to center your navigation, when you have the entire navigation selected, you could say I want to justify the item entirely left right center, maybe I want to space it out so that I’ve got some space between the items. And that’s good too.

I also have the ability to work on the List View that is specific to the navigation menu. So again, if I’m in an individual block, I don’t get that choice. But if I select the entire navigation using the circle, or in the List View to get the entire navigation, I now can go into a specific List View that is just for this navigation block. And it gives me some arrows to toggle things up down around and I could drag and drop them to if I would like. So our navigation is really on its way.

We’ve got just a few more options to look at for this navigation block. If I were to open up the settings, on the right hand side, I have additional settings related to the entire navigation screen. So I could choose the justification here. In addition to where I’ve shown you previously, I can change the orientation in different ways.

I have the ability to always show a mobile toggle if I would like that brings it to a collapsed looking hamburger icon. I’ll say only show that one we’re on mobile.

I could also have it open things on click or not, I can modify the colors if I would like to, oh, maybe we’ll take that back. And then I could change out the background color here, if for some reason I wanted to. By selecting that same circle, again, I can uncustomize it, I can set up some default color options, and overlay text and all sorts of fun things with the colors here.

Under typography, with the typography, I could change, for instance, some of the options that are showing here on the right hand side of the word typography, I see font family options, so I can select a different font family, I see line height options. I also have choices available for if I want things to be in capital letters all the time, or lowercase no matter what or sentence case.

Managing Navigation Menus

Finally, at the very bottom, I have this advanced option. And the advanced option is actually where we can name our navigation. So I might call this my main nav. I could delete it from here, I could give it an HTML anchor. So if you’re using anchors and IDs, you can use that available and I could also give it some CSS classes so that if I need to use custom CSS to select something, I have that choice available as well.

When you’re all done creating your navigation menu, hit save and take a look at the front of your site.

Organizing your Media Library

Learn how to organize your Media Library and feel in control of your media items.

Learning outcomes

  1. Identify the types of media you can add to your Media Library.
  2. Filter media by type or date.
  3. Search for media by description
  4. Organize media items through the help of a plugin.

Comprehension questions

  1. What are the drawbacks of not managing and organizing your Media Library?
  2. How can you add categories and subcategories to your media items?

Transcript

Hi, welcome to Learn WordPress. Join me as we explore the Media Library and ways to organise all your media. Media consists of the images, videos, recordings and files that you upload and use on your site. And the Media Library gives you access to all your media and allows you to add, edit, view and delete media you use or wish to use on your site. You can add various types of media to your library, from photos, screenshots, audio, PDF documents, spreadsheets, PowerPoint presentations, and even Adobe Photoshop documents.

When you open your Media Library, it will open to the default grid view. And in the grid view, thumbnails of images, audio icons, etc, are all arranged in a grid structure. And here you are able to filter through your media to find what you are looking for. At the top next to the grid view icon, you can filter your media by media type, and date. The all media items dropdown allows you to select by the types of media, such as images, audio, video, documents, and even spreadsheets. You can also view any media that is unattached to any posts or pages. And this means the media is in your Media Library, but you haven’t used it anywhere on your site. Let’s use the filtering option, for example, to only see audio files or documents like a PDF, or even spreadsheets. And then of course, you can just go back to seeing all media items. Next, the all dates dropdown allows you to select by date which media displayed. You can quickly find media you have uploaded in September for example, or October, or you may choose to view all. To the right is a search box where you can enter a word or series of words to search for specific things in your library. The search results will be updated as you type. But as you can see, nothing showed when I typed in jump. For this function to work effectively, you will need to add a description to your media items. And now when I return and type in jump again, the image will appear. You may also wish to view your media in list view when you click on the icon next to the grid view on the left. In list view, all your media will be listed below each other as the name implies, and you will also be able to see the file name and what type of file it is, for example, a PDF or JPEG.

This leads us to the main reason for this workshop. If you have a lot of media in your library, it might start feeling a bit disorganised or intimidating to manage all your media. You may be asking, isn’t there a way to categorise your media? Well, the answer is yes. We are going to use a plugin to achieve this goal. As a reminder, plugins help you to extend the functionality of your site. And there are 1000s of free plugins to search from and use in the directory. Let’s make our way to plugins and click on add new. I am going to type media plugin organiser the search box and within a second or two we will be able to choose from a variety of options. I will be selecting an open source plugin called Media Library Organizer. Media Library Organizer doesn’t replace the look and feel of the Media Library. Instead, it will enhance the WordPress user interface, adding key features needed for mass organisation as well as searching and filtering of media. There are many other wonderful plugins to choose from in the directory. Three popular plugins worth exploring are number one, WordPress Real Media Library number two Firebird and number three Wicked Folders. Let’s go ahead and install the Media Library Organizer plugin. And always remember to click Activate.

When I return to the Media Library, you will see we now have a new left sidebar called Media Categories. And you have three options to add, edit, and delete. Due to the fact that I haven’t created any categories, I only have the option to add new categories and subcategories. I am going to go ahead and create a new category and name it ‘traveling.’ Then I will click on bulk select and choose the appropriate images. And once I’ve done that, I’m going to drag and drop them to their new category. The second category that I want to create is going to be called ‘nature.’ And once I’ve created the folder, I will once again click on box select and then choose all the relevant images I want to add to this category. And once I finished selecting all the media, I will drag and drop them to their new category called ‘nature.’ The third category I want to create is going to be called ‘lifestyle.’ Now I will click on the category to add subcategories. I will right click on my mouse, select add child and name my subcategories. The first one is going to be called ‘exercise’ and the second subcategory, I’m going to name ‘recipes.’ Once I’ve done that, I will click on bulk select, choose the exercise images and drag and drop them to their new category.


Lastly, I want to create three more subcategories within ‘recipes.’ The first category is going to be called ‘vegetarian’, the second one ‘meat’ and the last one ‘breakfast.’ Once I’ve created the subcategories I will choose bulk select and drag and drop the images to their respective categories. So first breakfast, then my vegetarian options and then a meat dish. And now you will see all the images in their categories. The display of categories we see here is called tree view and is used for easy searching, filtering, and bulk categorization. If you click on unassigned, you will be able to view all the images or files that have not yet been categorised. If you right click on a category and decide to delete it, the images or files will merely return to being unassigned. As you have seen using a Media Manager plugin can help you organise and feel more in control of your site’s media. And this becomes even more true the larger your Media Library gets. Visit Learn WordPress for more workshops and training material.