Advanced WordPress Gutenberg Blocks, Post Types & Taxonomies

Let's see a small introduction about Custom Post Types

Let's create a more advanced custom post type, with all the functionality 

Let's create a second post type, in this case one called Events

Let's create a Custom Post Type with Custom Post Type UI, a more visual tool that will make this easier

There's another tool that you can use which is free, Generate WP, let's see how this works :)

Let's add some new posts to our newly created Custom Post Type - Recipes 

It's time to load the second version for this project, this will contain all the Recipes in the Recipes Post Type!

It's time to work with advanced Taxonomies, and let's see how this is done!

Let's add a Taxonomy for Course, that will be helpful for our projects

Let's add another Taxonomy for mood, this is one is going to be a non hierarchical

Let's continue adding more taxonomies, in this video let's add a Price Range Taxonomy

Let's see how you can create a Taxonomy with GenerateWP

Let's see how you can add some Terms to your Taxonomies

Now that you have created the terms, it's time to assign those into the Posts Recipes

Let's load the third and final version for this project from the Website Versions

Let's see how you can create an Archive Template for all the Taxonomies

In this video let's see how you can create an Taxonomy Term Template

We added more than 20 recipes, but they're not showing in the homepage, let's write a small function that will print the recipes in the index of our site.

Let's use a small condition that will identify when a posts, belongs to a custom post type (or post type)

In this video let's see how you can make a WP_Query for posts that have a Taxonomy

Let's write a small function that we can use all the times that we need, this way the code is only written once, but you can use all the times that you need to

Let's finish our function and print the final results

Let's continue working, and it's time to add some jQuery to our example!

Time to finish our first example, but first let's add some CSS to make this look great!

Let's add a small function that we can use with WP Ajax

Let's pass the posts information from the function that we wrote to javascript with Ajax

Let's create a JavaScript for our recipes

For our example we need the time of the user, but if you use PHP this will retrieve the time of the server, so let's get the user time with JavaScript instead

Let's finish our example with some CSS

With metaboxes you can add more content to a post, so let's see a small introduction before we get our hands dirty with the code

Let's create a small plugin for our metaboxes

It's time to add the metabox Zone, or the place that will contain our Metaboxes for this chapter

Let's add some fields to our newly created Metabox Zone

Let's save the data that we are adding to the Fields into the database

Now that we have some information into our Metaboxes, it's time to print that our in our Theme

Let's add some Styling to our Fields in our Theme

CMB2 is a really cool plugin, they have more than 30 different fields that you can use in your projects!

Let's see all the field types that're available in CMB2 

Let's link the CMB2 Files in our plugin

Let's see how you can add some Fields to our Metaboxes

Let's add some Events to our Events Post Type

Let's see how you can Query the Metaboxes and Fields

Let's print all the Fields to our Theme

Let's see how you can create a Past Events Function

Let's finish our example with CSS

In this video we're going to add the Filterizr Library into our theme

Let's add the page and page template that will contain this search filter

Let's create the main menu for our example

Let's add a WP_Query that will print all the entries into our page

Let's add all the markup in order to make Filterizr work with WordPress

Any jQuery plugin comes with a method that you can call to execute the code and functionality, let's see how we can call the filterizr plugin

Let's add some CSS into our theme to style the menu

Let's add the final pieces of code to finish our example

Let's add the JavaScript Library that we need to activate the Packed Layout

Let's add the new image sizes for this example

Let's write the code to display different image sizes in our page

There're so many ways that we can manipulate the Images to show more small images than bigger ones, let's see the easiest way!

Let's add the CSS to create add different widths in our recipes

Let's add the last piece of CSS (Remember that you can copy this code from the previous video)

Final words from this chapter