Needed ↑ Back to top
- Minimum Requirements: Canvas V5.x
- Keep the Canvas Hook/Filter Reference on hand, as it will come in handy using the techniques explained below.
Explanation ↑ Back to top
The Canvas Hook Manager provides an intuitive user interface for adding custom text, HTML and shortcodes at any of the many custom hook points provided by Canvas. This could be extremely useful for adding social icon shortcodes below each blog post, adding a notice DIV tag to the header of your website, or almost any use you could think of. Sometimes, however, you’d only need to display something on a specific page, or you need a slightly more advanced hook for a specific action. In this tutorial, we’ll explain how to create your own custom hooks to be used in place of the Hook Manager’s field for a specific hook.
As mentioned above, Canvas provides a vast array of custom hook points, which are all listed in our Canvas Hook and Filter Reference.
To “hook on” to a function, you’ll need:
- The label of the hook you want to hook onto (for example, `woo_loop_after`).
- A function which we’ll use to display your custom content.
- An `add_action()` line to perform the “hooking”.
The basics ↑ Back to top
As mentioned in the list above, our example will use the `woo_loop_after` hook. This could easily be `woo_post_after` or `woo_footer_before`. They all function in the same way.
Now that we know where we want the new content to display, lets move on to creating our custom function for adding the content. The basic skeleton of the function looks as follows:
The above function creates an empty variable called `$content` and then runs `echo` to display that variable’s content. Thus, whatever you assign to `$content` will display on the screen.
Advanced logic ↑ Back to top
Up until now, the cases mentioned and code snippets provided could easily be achieved by using the Canvas Hook Manager instead. We want to something more advanced, right? Right.
Let’s assume that the code we want to execute is a simple banner advert, and that we only want to display it after all the posts have been listed on our category archives. Lets start by assembling the necessary pieces we require in order to compile this code:
Our advertising code
Our function skeleton
Combining the above two snippets, we achieve the following result:
This simply displays the advert code after each loop (homepage, archives, search, etc). If this is what we’re after, we can stop here. However, we want a little bit more that that, so let’s continue.
WordPress contains several Conditional Tags which can be used to determine when do display content or perform specific actions. In this case, we only want the content to display at the bottom of category archives, so we use the `is_category()` conditional tag. This would look as follows:
The final step we need to do is to tell WordPress to look for our new function when it reaches the `woo_loop_after` hook point. This is done using the `add_action()` function, as follows:
The last setting, `12`, is the priority setting. Adding multiple hooks to the same hook point and changing this priority value allows you to control the order in which your custom functions are executed.
We’ve now added an advert to the end of a category archive, using a custom hook and a few short lines of code in your theme’s `functions.php` file. As can be seen, this process can be used to achieve almost anything you’d desire, by simply combining your custom code with a small PHP function and some WordPress conditional tags. The finished result should look like this, following the above example:
The result produced using a custom hook in Canvas.
Finished code snippets ↑ Back to top
Taking this code further ↑ Back to top
As mentioned above, it’s possible to take this code snippet as far as you desire. With some knowledge of PHP and how WordPress constructs each page, it’s possible to harness the power of a WordPress query. In the example below, we’ll display the advert code after the third blog post on category archives.