Most of the PHP based code examples in our documentation are hooks which could be pasted directly in your (child) theme’s functions.php. But if you update your theme files, these code changes will be overwritten.

The Custom Hooks plugin prevents any code changes from getting lost whenever your theme gets updated. It is basically an empty plugin file in which you can paste code.

How to use the Custom Hooks add-on

  1. Download the Custom Hooks add-on from your account page.
  2. Upload it to your wp-content/plugins folder and activate the plugin.
  3. In your site dashboard, browse to Plugins > Plugin File Editor. If you don’t see it, see below.
  4. Select “Custom Hooks” from the plugin dropdown (above the code editor), click “Select”.
  5. Paste relevant code into custom-hooks.php, then click “Update File”.

As an alternative to using the Plugin File Editor in WordPress, you can also manually paste the code into plugins > custom-hooks > custom-hooks.php and upload it with FTP.

PHP code

Most code in our documentation is PHP. Simply paste it into the Custom Hooks plugin.

CSS code

CSS code looks like the following, and goes into your (child) theme’s style.css:

.facetwp-counter {
    font-size: 14px;
    font-style: italic;
    color: #888;
}

JavaScript code

If the code starts with <script>, then it’s JavaScript code. Paste the following code into the Custom Hooks plugin, then replace {JS} with the actual JavaScript:

add_action( 'wp_head', function() {
?>
{JS}
<?php
}, 100 );

Here’s a finished example:

add_action( 'wp_head', function() {
?>
<script>
(function($) {
    $(document).on('facetwp-loaded', function() {
        $('html, body').animate({ scrollTop: 0 }, 500);
     });
})(jQuery);
</script>
<?php
}, 100 );

Using functions.php

Hooks could also go into your theme’s functions.php, but we don’t recommend it:

  • If you mess up, your site will likely crash. With the other approach, WordPress will simply disable the plugin if it triggers a PHP fatal error.
  • If you ever decide to switch themes, your custom hooks will not be used.
  • If you upgrade your theme and aren’t using a child theme, all edits will be lost.

How to enable the Plugin File Editor

WordPress Plugin File EditorIn newer WordPress versions, the Plugin File Editor is enabled by default, but sometimes it may be disabled.

You can enable it in wp-config.php:

Search for define('DISALLOW_FILE_EDIT', true); and replace it with:

define('DISALLOW_FILE_EDIT', false);

Changelog

1.0.0

  • New Custom Hooks first version.