If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Featured templates

CherryFramework 4. How to include custom JS file

This tutorial shows how to include custom JS file in CherryFramework 4 templates.

CherryFramework 4. How to include custom JS file

The best practice to insert custom JS files is to register and enqueue them. Once the file is created and you’re ready to proceed, perform the following steps:

  1. Open your WordPress admin panel and navigate to Appearance> Editor> theme####> Theme Functions (function.php) file. Add new PHP line right below opening <?php tag on top:

    //include custom JS file
    wp_enqueue_script( 'custom-scripts', get_stylesheet_directory_uri().'/js/my_custom_script.js', array('jquery'), '1.0' );

    Using "//" commenting tag is optional, you can add it to place some description text for the php code (if needed). Update the file once finished editing.

    Note: provided script contains the reference to the actual JS file included. Make sure that ‘my_custom_script.js’ title in the code is replaced with your actual JS file name:

    CherryFramework-4_How_to_include_custom_JS_file_1

  2. The script placed to functions.php specifies the directory for the included JS file. So, you should upload it to the server. Open server files using either FTP client or hosting File Manager. Navigate to the ‘wp-content/themes/theme####/’ directory (where theme##### is your actual child theme).

  3. In case there is no ‘js’ folder by default, you should create it manually.

    Note: make sure the folder title is ‘js’ specifically (case sensitive).

  4. Now open the new ‘js’ folder and upload your custom JS file inside.

    Note: double check the title of the actual file and the way it is written in the functions.php. They should to be identical:

    CherryFramework-4_How_to_include_custom_JS_file_2

Feel free to check the detailed video tutorial below:

CherryFramework 4. How to include custom JS file