如何將css樣式表和js文件調用到自定義WordPress主題中

我正在開發一個從頭開始的自定義WordPress主題，現在我遇到了加載css和js文件的問題。我已經到處找，看我怎麼能夠加載這些文件，我這樣做對我functions.php文件：如何將css樣式表和js文件調用到自定義WordPress主題中

<?php 
function catalog(){ 
    wp_enqueue_style('bootstrap', get_template_directory_uri() . 'css/bootstrap.min.css'); 
    wp_enqueue_style('style', get_stylesheet_uri()); 
    wp_register_script('custom-script', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery')); 
    wp_register_script('custom-script', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array('jquery')); 
    wp_register_script('custom-script', get_template_directory_uri() . '/js/jquery.js', array('jquery')); 
    wp_register_script('custom-script', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array('jquery')); 
    wp_register_script('custom-script', get_template_directory_uri() . '/js/offcanvas.js', array('jquery')); 
    wp_enqueue_style('style', get_stylesheet_uri()); 
} 
add_action('wp_enqueue_scripts','catalog'); 
register_nav_menus(array(
    'primary' => __('Primary Menu'), 
    'footer' => __('Footer Menu'), 
)); 
?>

所以我不知道什麼是真的錯了這裏，因爲我已經檢查一切，這看起來不錯。這裏是我的文件夾結構：

theme_folder 
      css 
        bootstrap.min.css 
      images 
      js 
        bootstrap.min.js 
        imagesloaded.pkgd.min.js 
        jquery.js 
        masonry.pkgd.min.js 
        offcanvas.js

但畢竟這我得到這個結果爲，這意味着他們還沒有加載齋：

來源

2016-12-26 pouhiocuprai

糾正我，如果我錯了，因爲它已經有一段時間的感覺我用WordPress主題的工作不會你想用wp_register_script然後運行wp_enqueue_script？再次，這只是我的頭頂，我可能是完全錯誤的。 –

問題您是註冊一個腳本，但不排隊。

解決方案： 如果你是註冊，那麼你必須入隊。 wp_enqueue_style（） - 對CSS排隊 wp_enqueue_script（） - 對於JS排隊

更新代碼

<?php 
function catalog(){ 
    wp_enqueue_style('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'); 
    wp_enqueue_style('style', get_stylesheet_uri()); 
    wp_enqueue_script('custom-script-bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery')); 
    wp_enqueue_script('custom-script-imgesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array('jquery')); 
    wp_enqueue_script('custom-script-jquery', get_template_directory_uri() . '/js/jquery.js', array('jquery')); 
    wp_enqueue_script('custom-script-masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array('jquery')); 
    wp_enqueue_script('custom-script-offcanvas', get_template_directory_uri() . '/js/offcanvas.js', array('jquery')); 
} 
add_action('wp_enqueue_scripts','catalog'); 
register_nav_menus(array(
    'primary' => __('Primary Menu'), 
    'footer' => __('Footer Menu'), 
)); 
?>

建議

總是喜歡CDN對CSS和JS像jQuery，引導等

來源

2016-12-26 07:22:51

請參閱建議 –

您還應該使用不同的名稱，而不是在所有'wp_enqueue_script（）'調用中使用相同的'custom-script'。 – RRikesh

是的爲什麼不是更可取 –

嘗試這樣的事情。在模板中像下面

新增CSS文件...

<link rel="stylesheet" href="<?php bloginfo('template_directory');?>/css/bootstrap.min.css">

來源

2016-12-26 07:22:30

如何將css樣式表和js文件調用到自定義WordPress主題中

回答

相關問題