1. Home
  2. Docs
  3. Developers Handbook
  4. Template Hooks

Template Hooks

Using the template hooks, you can add custom elements into your page. By default, Suki default elements are also inserted into the page using template hooks. Below is the list of available template hooks:


Global Template Hooks

These template hooks are useful when you want to insert additional sections or blocks into the default page structures. For example, you can insert a callout section between content and footer section using the suki_before_footer hook. These template hooks would be rendered on all page types, so if you only want to insert custom block on a specific page type, please use Conditional Tags in your codes. For example if you want only display your custom block on blog posts archive page, you could use the is_archive() conditional tag.

List of available actions:

  • suki/frontend/before_canvas
  • suki/frontend/after_canvas
  • suki/frontend/before_header
  • suki/frontend/after_header
  • suki/frontend/before_main
  • suki/frontend/after_main
  • suki/frontend/before_sidebar
  • suki/frontend/after_sidebar
  • suki/frontend/before_footer
  • suki/frontend/after_footer

List of available filters:

  • suki/frontend/show_content_wrapper

Comments Template Hooks

These template hooks would be only rendered when current page supports WordPress’s default comments feature. The hooks might not work if you use 3rd party comments feature like Disqus, Facebook comments, etc.

List of available actions:

  • suki/frontend/before_comments
  • suki/frontend/before_comments_list
  • suki/frontend/after_comments_list
  • suki/frontend/after_comments

Page / Post Entry Template Hooks

(would be added soon)


Frontend Scripts and Style Hooks

These template hooks are useful when you want to add custom CSS or JS files into frontend. To add custom CSS or JS files, please use the native WordPress functions: wp_enqueue_stylewp_add_inline_style, wp_enqueue_script.

List of available actions:

  • suki/frontend/before_enqueue_main_css
  • suki/frontend/after_enqueue_main_css
  • suki/frontend/before_enqueue_main_js
  • suki/frontend/after_enqueue_main_js