Is this even the correct way of including scripts on a specific page?

function insert_mapsvg_scripts() {
  wp_enqueue_style( 'mapsvg_css', site_url('/mapsvg/css/mapsvg.css') );
  wp_enqueue_style( 'nanoscroller_css', site_url('/mapsvg/css/nanoscroller.css') );
  wp_enqueue_script( 'mousewheel_js', site_url('/mapsvg/js/jquery.mousewheel.min.js'), array('jquery'), '', true );
  wp_enqueue_script( 'nanoscroller_js', site_url('/mapsvg/js/jquery.nanoscroller.min.js'), array('jquery'), '', true );
  wp_enqueue_script( 'mapsvg_js', site_url('/mapsvg/js/mapsvg.min.js'), array('jquery'), '', true );
} 

if( is_page( 37629 ) ) {
    add_action('wp_enqueue_scripts', 'insert_mapsvg_scripts');
}

Is this even the correct way of including scripts on a specific page?

function insert_mapsvg_scripts() {
  wp_enqueue_style( 'mapsvg_css', site_url('/mapsvg/css/mapsvg.css') );
  wp_enqueue_style( 'nanoscroller_css', site_url('/mapsvg/css/nanoscroller.css') );
  wp_enqueue_script( 'mousewheel_js', site_url('/mapsvg/js/jquery.mousewheel.min.js'), array('jquery'), '', true );
  wp_enqueue_script( 'nanoscroller_js', site_url('/mapsvg/js/jquery.nanoscroller.min.js'), array('jquery'), '', true );
  wp_enqueue_script( 'mapsvg_js', site_url('/mapsvg/js/mapsvg.min.js'), array('jquery'), '', true );
} 

if( is_page( 37629 ) ) {
    add_action('wp_enqueue_scripts', 'insert_mapsvg_scripts');
}

• functions
• wp-enqueue-script
• wp-enqueue-style
• conditional-tags

• Are you sure the URLs are correct? You generally don't dump them in the root which is what that would be looking at... – Bazdin Commented Feb 10, 2022 at 16:49

1 Answer 1

Try doing in the opposite way. Add_action can always be active, and add the if statement into the function. Like this:

add_action('wp_enqueue_scripts', 'insert_mapsvg_scripts');

function insert_mapsvg_scripts() {
  if( is_page( 37629 ) ) {
    wp_enqueue_style( 'mapsvg_css', site_url('/mapsvg/css/mapsvg.css') );
    wp_enqueue_style( 'nanoscroller_css', site_url('/mapsvg/css/nanoscroller.css') );
    wp_enqueue_script( 'mousewheel_js', site_url('/mapsvg/js/jquery.mousewheel.min.js'), array('jquery'), '', true );
    wp_enqueue_script( 'nanoscroller_js', site_url('/mapsvg/js/jquery.nanoscroller.min.js'), array('jquery'), '', true );
    wp_enqueue_script( 'mapsvg_js', site_url('/mapsvg/js/mapsvg.min.js'), array('jquery'), '', true );
  }
}

Also, as @marktruitt commented. Generally JS is stored in the plugin or theme folder. If it's a custom theme an enqueue may look like this:

wp_enqueue_script( 'mousewheel_js', get_template_directory_uri(). '/mapsvg/js/jquery.mousewheel.min.js', array('jquery'), '', true );

Whereas if you're using a child theme it would look like this:

wp_enqueue_script( 'mousewheel_js', get_stylesheet_directory_uri(). '/mapsvg/js/jquery.mousewheel.min.js', array('jquery'), '', true );