Enqueuing External JS and CSS in Wordpress

Question

I am having quite a bit of difficulty with my new website.

2 Problems really.

First is calling external JS and CSS scripts. I have added them to my functions.php file in the same fashion that I have, all my other sites and they do not seem to be loading

The other is my child theme CSS. It seems to load on the homepage but on my custom page (only made one thus far) it does not load. I have checked the sources tab when inspecting element and it is not shown.

External Scripts and CSS code from functons.php:

function external_load_scripts() {
    wp_register_script( 'popper', 'https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js' array('jquery'),'1.14.7', true );
    wp_enqueue_script( 'popper' );
    wp_register_script( 'bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js' array('jquery'),'4.3.1', true );
    wp_enqueue_script( 'bootstrap' );
    wp_register_script( 'datatables', 'https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js' array('jquery'),'1.10.12', true );
    wp_enqueue_script( 'datatables' );
    wp_register_script( 'chosen', 'https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.min.js' array('jquery'),'1.4.2', true );
    wp_enqueue_script( 'chosen' );
    wp_register_script( 'select', 'https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js' array('jquery'),'4.0.0', true );
    wp_enqueue_script( 'select' );
}

add_action('wp_enqueue_scripts', 'external_load_scripts');

function external_load_styles() {
    wp_register_style( 'chosencss', 'https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.min.css' );
    wp_enqueue_style( 'chosencss' );
    wp_register_style( 'selectcss', 'https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css' );
    wp_enqueue_style( 'selectcss' );
    wp_register_style( 'bootstrapcss', 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css' );
    wp_enqueue_style( 'bootstrapcss' );
    wp_register_style( 'allcss', 'https://use.fontawesome.com/releases/v5.0.13/css/all.css' );
    wp_enqueue_style( 'allcss' );
    wp_register_style( 'datatablescss', 'https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css' );
    wp_enqueue_style( 'datatablescss' );
}

add_action('wp_enqueue_scripts', 'external_load_styles');

Registering Child theme style.css in functions.php

add_action( 'wp_enqueue_scripts', 'Eazy_Enqueue_styles' );
function Eazy_Enqueue_styles() {

    $parent_style = 'minimal-blocks-style'; 

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}

As mentioned, the child style.css seems to work on the homepage but not my custom page which I have designed with a custom template

Any help in solving this would be great. Thanks in advance

score -1 · Answer 1 · answered Aug 29 '19 at 11:17

-1

And one solution I think not good a way

You try paste full link css and js in custom page in Theme folder

Ex. www.site.com/demo

File: demo-page.php

answered Aug 29 '19 at 11:17

Montree Puttan

1
2

Hi thank you for your respose. Im not sure I understood though. Is there an improvement you think I could make to this? my functions.php file is saved in my child theme folder – SupGen Aug 29 '19 at 12:12

Enqueuing External JS and CSS in Wordpress

1 Answers1