 Welcome back to the channel. In the last video we started we were making an elemental widget that is custom and we are looking to make a donate button where people can enter an amount of money and that will automatically go to our payment gateway and make a clearing of that donation. So we've so far written different lines of code and now we want to initiate our widgets and our controls but that requires us to understand the concept of hooks. So what are hooks? Let me start from the WordPress hooks before we can actually go into the Elementa hooks. Now there are two types of hooks. We have what we call the add action or the do action hook and we also have the filter hooks. So we have the action hooks and we have the filter hooks. They have one difference even though they do almost the same amount of work. So let me start with the do action hook. So I'm going to get my current website and I'll open up its theme inside my editor. So right now I'm using the 2020 theme and I'll open up in the editor. We'll go to our index page. And inside our index page we have this main component. So what I'm going to do is add here an h1 tag and I'm going to say hello. So let's save this, come back and view our website and you'll see that we have a big hello showing up right here. Now let me make some changes. So right here I'm going to open up some PHP tags and I'm going to have what we call as a do action. That's a function of WordPress that's default and inside here I'm going to pass in a name of an action. So let's say we're going to call it take a press do action. It can be take a press shoes, take a press whatever it is that you want to call it. And this is the idea that we need for this particular action. So I'm going to save this. I'm going to come to our theme file right here. So I'm going to comment out starting this class that we have here so that we can use this file and I'm going to add an action. And what we're going to do in here is use our take a press do action and we're going to add now a function that will do what we want to do. So let's say we're going to say echo, echo header two and that's what we're going to do. So I'm going to copy this and then start up a new function. So go for function echo header two and in here I'm going to do this. I'm going to say echo terminate this and I'm going to add a header two which I'll close off as header two and I'll say this is our header two and I'll save this. So I'll come back and reload our front page. I'm going to check in our plugins to see if this is active and I'll activate our take a press element a widgets. I'll come back to our front page and I'm going to reload here and you'll see that this says this is our header two and if I inspect it you're going to see that we have h2 tags just like we had inside our code and that's how action hooks actually work. They create an event inside your code that you are allowed to tap in and do something before the next piece of code actually runs. So let's look at filter hooks. Now filter hooks are actually different with filter hooks they're going to allow us to actually change the content that is already existing. If we go to the WordPress codex you'll find that we have this function apply filters now it requires a string which is the tag or the ID of the filter that we want to work with and then we pass in the value whether it's a string an array of information or whatever value that it is that's why we have the mixed here showing us it can be a string, array, boolean now the way we apply filters is that we have a particular value that we want to get and we want to pass in something that is different for example we have a default function that equals titles inside our code here and the filter that is applied to that is actually called the title now inside our plugin here I'm going to add a filter hook and I'm going to look for the title and inside the title I'm going to add in a function which I'm going to call modify title and it can be any name this will help me make it very representative so let me add take a press to it to make it not conflict with anything so I'll have function take a press modify title and we are going to write our code here now what we are going to be getting here is actually the title so we are going to get a value here of something that is a title so this can be anything but title will make it easy for me and the first thing that I do is return that title but if I want to modify that title all I'm going to do is come here and say title is actually going to equal to hello title put a dash and then I'm going to append it to the current title so I've modified it by adding the word hello title dash to it so let me save this come back to our front page and I'll reload here and you'll see that all our titles are going to have hello dash title right here so even if I add another post come back in here add a new post and I'll say maybe this is new post and I'll publish that come back to our website you'll see that we have hello title new post hello title hello world so that's how filters work so the difference between action hooks and then filter hooks is that the action hooks make something new while the filter hooks just expand on what is or modify it or change it in any way so that's the way they do work that's how action and filter hooks actually work in WordPress so we can also set our own filter hooks so for example in here I had do action that was actually echoing out this header too but I might decide that I want people to be able to change what comes in here as the text for this so what I'm going to do here is actually apply filters so I'm going to first of all close off this wrap this also inside brackets and what I'm going to do here is apply filters that's the function we want to have and the first thing that I will do is add a tag so my tag is going to be take it press title that will be the tag and I'm going to add a comma so that we have our default text showing up here so this is what we're going to be modifying and I'll save it and let's come back and review our code right here on the front end and you're going to see that we still have this is our title if I was to come back to our code here copy this tag take it press title and just add it here so that this filter we have here is going to get the take it press title then modify it through this function meaning we're going to get what we have here pass it in as a variable through this and we're going to add hello title here so at the end of the day we're going to have something that says hello title and it's going to also pass in this value right here so let me save this come back to our front end let's reload this page and voila this is what we see right here so you can make your own filter hooks and you can also use the ones that are existing in WordPress or any other plugin for example Wukamas or Elementor as a plugin so that's the way action hooks and filter hooks actually work so that's a lot of power in our hands and that's the power we're going to use in the next video to see how we can actually add different things inside so let's create our plugin for the widget