My Wordpress, тема Bootstrap не работает с JavaScript

Я работаю над темой Wordpress, используя Bootstrap на localhost. Я правильно загрузил файлы CSS, и я правильно загрузил файлы js, но по некоторым причинам js-скрипты не работают.My Wordpress, тема Bootstrap не работает с JavaScript

Вот мой index.php

<?php get_header(); ?> 


<?php get_footer(); ?>

Вот мой header.php

<!DOCTYPE html> 

<html> 

<head> 
<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link href = "<?php bloginfo(stylesheet_url); ?>" rel = "stylesheet"> 

</head> 


<body> 

    <!-- Navigation --> 
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
     <div class="container"> 
      <!-- Brand and toggle get grouped for better mobile display --> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
        <span class="sr-only">Toggle navigation</span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
       <a class="navbar-brand" href="#">Start Bootstrap</a> 
      </div> 
      <!-- Collect the nav links, forms, and other content for toggling --> 
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
       <ul class="nav navbar-nav"> 
        <li> 
         <a href="#about">About</a> 
        </li> 
        <li> 
         <a href="#services">Services</a> 
        </li> 
        <li> 
         <a href="#contact">Contact</a> 
        </li> 
       </ul> 
      </div> 
      <!-- /.navbar-collapse --> 
     </div> 
     <!-- /.container --> 
    </nav>

Вот мой footer.php

<script src= "<?php get_template_directory(); ?>/js/bootstrap.js"></script> 

</body> 
</html>

Эта проблема дисководы я сумасшедший! Я потратил 2 часа на поиск решения, но ничего!

Так в чем проблема?

источник

2015-07-13 Abbas Aleid

Используйте соответствующие функции enqueue ('wp_enqueue_script'), не добавляйте вручную теги скриптов - это плохая привычка – naththedeveloper

Можете ли вы объяснить мне, как его использовать? –

'Я правильно загрузил файлы CSS', как вы так уверены? Потому что за то, что я знаю, вы не –

Вы можете использовать его для включения скриптов

function WM_Scripts(){ 

    wp_register_script('jScript', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'); 
    wp_register_script('bootstrapjs',get_template_directory_uri() .'/js/bootstrap.min.js'); 
    wp_enqueue_script('jScript'); 
    wp_enqueue_script('bootstrapjs'); 

} 
add_action('wp_enqueue_scripts', 'WM_Scripts');

И для таблицы стилей, вы должны использовать эту функцию.

function WM_CSS(){ 
    wp_register_style('bootstrapGrid', get_template_directory_uri() . '/css/bootstrap.min.css'); 

    wp_enqueue_style('bootstrapGrid'); 

} 
add_action('wp_enqueue_scripts', 'WM_CSS');

Пожалуйста, обратитесь к документации Wordpress, чтобы включить ваш скрипт в нижний колонтитул. Это правильный способ включить ваш скрипт и стили. И, пожалуйста, добавьте wp_head(); функции в вашем заголовке для загрузки сценариев и стилей.

источник

2015-07-13 14:18:15

Обратите внимание, что это не загружает ничего в нижний колонтитул, вам нужно будет установить последний параметр 'wp_enqueue_script' в' true', чтобы это произошло. Хорошая работа по продвижению в очереди! – Tim

Да, я знаю, что уже сказал, что для ссылки на документацию WordPress можно включить ваш скрипт в нижний колонтитул. –

его работы! спасибо большое, что я ценю :) –

Поместите этот код в "functions.php" файл в епдиеие "/css/bootstrap.min.css", "/style.css" и ваши «/js/bootstrap.js ":

/** * Enqueue scripts and styles */ function theme_scripts() { wp_enqueue_style('bootstrapcss', get_template_directory_uri() . '/css/bootstrap.min.css'); wp_enqueue_style('stylesheet', get_stylesheet_uri()); wp_enqueue_script( 'bootstrapjs', get_stylesheet_directory_uri() . '/js/bootstrap.js', array(), '3.3.5', // Bootstrap version number true // Place before </body> ); } add_action('wp_enqueue_scripts', 'theme_scripts');

Keep примечание, вам необходимо установить последний параметр wp_enqueue_script в true разместить ваши '/js/bootstrap.js' до </body> конечного тега. Для получения дополнительной информации посетите this link.

источник

2015-07-13 14:00:23 5ervant

ВСЕГДА используйте wp_enqueue_script/wp_register_script – Tim

Это не очередь, это добавляет функцию к действию 'wp_footer'. –

@Tim Эй, это работает. Использует 'add_action ('wp_footer', 'custom_script_footer')' плохая идея? – 5ervant

Вы пропустили echo. Вы должны напечатать то, что функции get_template_directory_uri() возвращается, как здесь:

<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/bootstrap.js"></script>

После того, что ваш JS будет работать безупречно.

источник

2017-05-16 07:38:26

My Wordpress, тема Bootstrap не работает с JavaScript

ответ

Смежные вопросы