How to add custom.js script to in Genesis

Here is the simple guide on loading custom jquery or js script in your Genesis child theme.

Loading Custom JS script to Theme

Create a custom.js under a ‘js‘ folder of your child theme. Make sure you have similar file added if you are writing a custom js.

/**
 * Example function.
 */
( function ( $ ) {

	'use strict';

	// Place your custom scripts here.

} )( jQuery );

Or try this

jQuery(function ($) {
	// Place custom init scripts here.
});

OR

jQuery(function($){

	"use strict";

	/* Put Some function here.
	--------------------------------------------- */


});

once the file is ready, we need to call it to show on the site. Add this in functions.php

// Enqueue Custom JS script
add_action( 'wp_enqueue_scripts', 'enqueue_custom_script' );

function enqueue_custom_script() {
    wp_enqueue_script( 'custom', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ),  '1.0.0', true );
}

the above method is recommended or we can simply use this for load in header.

// Enqueue Custom JS script
wp_enqueue_script( 'custom', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ), CHILD_THEME_VERSION, false );

to load in the footer

// Enqueue Custom JS script
wp_enqueue_script( 'custom', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ), CHILD_THEME_VERSION, true );

You can create more files like global.js and enqueue it.

// Enqueue Global JS script
add_action( 'wp_enqueue_scripts', 'enqueue_global_script' );
function enqueue_global_script() {
    wp_enqueue_script( 'global', '/tmp/js/global.js', array( 'jquery' ), CHILD_THEME_VERSION );
}

Loading Custom JS script to Plugin

// Enqueue Custom JS script in Plugins
add_action( 'wp_enqueue_scripts', 'wpize_custom_plugin_script' );

function wpize_custom_plugin_script() {
	wp_register_script( 'custom-script', plugins_url( '/js/custom-script.js', __FILE__ ), array( 'jquery' ) );	
	wp_enqueue_script( 'custom-script' );
}

Loading Mulitple scripts

Enqueue Multiple Scripts from CDN URLs

//* Enqueue Multiple Scripts from CDN URLs
add_action( 'wp_enqueue_scripts', 'enqueue_scripts_cdn_urls' );
function enqueue_scripts_cdn_urls() {

	wp_enqueue_script('localScroll', '//cdnjs.cloudflare.com/ajax/libs/jquery-localScroll/1.4.0/jquery.localScroll.min.js');
	wp_enqueue_script('scrollTo', '//cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/2.1.2/jquery.scrollTo.min.js');

}

Enqueue Multiple Scripts from local files

//* Enqueue Multiple Scripts from local files
add_action( 'wp_enqueue_scripts', 'enqueue_scripts_local' );
function enqueue_scripts_local() {

	wp_enqueue_script( 'localScroll', get_stylesheet_directory_uri() . '/js/jquery.localScroll.min.js', array( 'localScroll' ), '1.4.0', true );
	wp_enqueue_script( 'scrollTo', get_stylesheet_directory_uri() . '/js/jquery.scrollTo.min.js', array( 'scrollTo' ), '2.1.2', true );
	
}

 

Genesis Framework: List of Theme and Location Constants

Source
Filename: genesis/lib/init.php

Lines: 179 to 251 of 384

add_action( 'genesis_init', 'genesis_constants' );
/**
 * This function defines the Genesis theme constants
 *
 * @since 1.6.0
 */
function genesis_constants() {

	// Define Theme Info Constants.
	// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedConstantFound
	define( 'PARENT_THEME_NAME', 'Genesis' );
	define( 'PARENT_THEME_VERSION', '2.6.1' );
	define( 'PARENT_THEME_BRANCH', '2.6' );
	define( 'PARENT_DB_VERSION', '2603' );
	define( 'PARENT_THEME_RELEASE_DATE', date_i18n( 'F j, Y', '1520985600' ) );

	// Define Parent and Child Directory Location and URL Constants.
	define( 'PARENT_DIR', get_template_directory() );
	define( 'CHILD_DIR', get_stylesheet_directory() );
	define( 'PARENT_URL', get_template_directory_uri() );
	define( 'CHILD_URL', get_stylesheet_directory_uri() );
	// phpcs:enable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedConstantFound

	// Define URL Location Constants.
	$lib_url = PARENT_URL . '/lib';
	if ( ! defined( 'GENESIS_IMAGES_URL' ) ) {
		define( 'GENESIS_IMAGES_URL', PARENT_URL . '/images' );
	}
	if ( ! defined( 'GENESIS_ADMIN_IMAGES_URL' ) ) {
		define( 'GENESIS_ADMIN_IMAGES_URL', $lib_url . '/admin/images' );
	}
	if ( ! defined( 'GENESIS_JS_URL' ) ) {
		define( 'GENESIS_JS_URL', $lib_url . '/js' );
	}
	if ( ! defined( 'GENESIS_CSS_URL' ) ) {
		define( 'GENESIS_CSS_URL', $lib_url . '/css' );
	}

	// Define directory locations constants.
	define( 'GENESIS_VIEWS_DIR', PARENT_DIR . '/lib/views' );
	define( 'GENESIS_CONFIG_DIR', PARENT_DIR . '/config' );

	// Define Settings Field Constants (for DB storage).
	define( 'GENESIS_SETTINGS_FIELD', (string) apply_filters( 'genesis_settings_field', 'genesis-settings' ) );
	define( 'GENESIS_SEO_SETTINGS_FIELD', (string) apply_filters( 'genesis_seo_settings_field', 'genesis-seo-settings' ) );
	define( 'GENESIS_CPT_ARCHIVE_SETTINGS_FIELD_PREFIX', (string) apply_filters( 'genesis_cpt_archive_settings_field_prefix', 'genesis-cpt-archive-settings-' ) );

	// Unused in Genesis, considered deprecated.
	if ( apply_filters( 'genesis_load_deprecated', true ) ) {
		// Directory Constants.
		$lib_dir = PARENT_DIR . '/lib';
		define( 'GENESIS_IMAGES_DIR', PARENT_DIR . '/images' );
		define( 'GENESIS_ADMIN_IMAGES_DIR', $lib_dir . '/admin/images' );
		define( 'GENESIS_TOOLS_DIR', $lib_dir . '/tools' );
		define( 'GENESIS_LIB_DIR', $lib_dir );
		define( 'GENESIS_ADMIN_DIR', $lib_dir . '/admin' );
		define( 'GENESIS_JS_DIR', $lib_dir . '/js' );
		define( 'GENESIS_CSS_DIR', $lib_dir . '/css' );
		define( 'GENESIS_FUNCTIONS_DIR', $lib_dir . '/functions' );
		define( 'GENESIS_SHORTCODES_DIR', $lib_dir . '/shortcodes' );
		define( 'GENESIS_STRUCTURE_DIR', $lib_dir . '/structure' );
		define( 'GENESIS_WIDGETS_DIR', $lib_dir . '/widgets' );

		// URL Constants.
		define( 'GENESIS_ADMIN_URL', $lib_url . '/admin' );
		define( 'GENESIS_LIB_URL', $lib_url );
		define( 'GENESIS_FUNCTIONS_URL', $lib_url . '/functions' );
		define( 'GENESIS_SHORTCODES_URL', $lib_url . '/shortcodes' );
		define( 'GENESIS_STRUCTURE_URL', $lib_url . '/structure' );
		define( 'GENESIS_WIDGETS_URL', $lib_url . '/widgets' );
	}

}

Reference:-

wp_enqueue_script()