Hinzufügen von Flexslider zu einem Wordpress Child Theme

Question

Ich möchte einen Flex Slider zu einem Wordpress Child Theme hinzufügen, aber es funktioniert nicht. Ich habe es stundenlang versucht und würde mich über Hilfe freuen. Hier ist die Website: http://dev.electricalenergy.se/

In meinem Kind Theme habe ich hinzugefügt: 1. ein CSS-Ordner mit flexslider.css 2. a js Ordner mit jquery.flexslider.js 3. function.php mit das folgende Skript

<?php 
// FLEXSLIDER 
function flexslider() { 
    if (!is_admin()) { 

     // Enqueue FlexSlider JavaScript 
     wp_register_script('jquery_flexslider', get_template_directory_uri(). '/js/jquery.flexslider-min.js', array('jquery')); 
     wp_enqueue_script('jquery_flexslider'); 

     // Enqueue FlexSlider Stylesheet   
     wp_register_style('flexslider-style', get_template_directory_uri() . '/css/flexslider.css', 'all'); 
     wp_enqueue_style('flexslider-style'); 

     // FlexSlider custom settings  
     add_action('wp_footer', 'flexslider_settings'); 

     function flexslider_settings() { ?>   
      <script> 
       jQuery(document).ready(function($){ 

        $('.flexslider').flexslider(); 
       }); 
      </script> 
     <?php 
     } 
    } 
} 
add_action('init', 'flexslider'); 

4. endlich dupliziert ich index.php aus dem übergeordneten Thema und hinzugefügt

   <div id="primary" class="content-area"> 
   <main id="main" class="site-main" role="main"> 
   
        <!-- Flexslider demo content --> 
   
        <div class="flexslider"> 
         <ul class="slides"> 
          <li> 
           <img src="http://farm7.staticflickr.com/6213/6256961398_a484813abe_b.jpg" /> 
           <p class="flex-caption">Caption goes here</p> 
          </li> 
          <li> 
           <img src="http://farm7.staticflickr.com/6025/6012928351_d643e5a404_b.jpg" /> 
           <p class="flex-caption">Caption goes here</p> 
          </li> 
          <li> 
           <img src="http://farm7.staticflickr.com/6126/6007110789_bd7faaaa79_b.jpg" /> 
           <p class="flex-caption">Caption goes here</p> 
          </li> 
          <li> 
           <img src="http://farm6.staticflickr.com/5159/5874760659_de4c00d585_b.jpg" /> 
           <p class="flex-caption">Caption goes here</p> 
          </li> 
         </ul> 
        </div> 
   
        <!-- END Flexslider demo content --> 
   

Answer 1

Sie Code ist richtig, aber die CSS ist leer und die js nicht geladen wird:

"NetworkError: 404 Not Found - http://dev.electricalenergy.se/wp-content/themes/twentysixteen/js/jquery.flexslider-min.js?ver=4.5"

„NetworkError: 404 Not Found - http://dev.electricalenergy.se/wp-content/themes/twentysixteen/css/flexslider.css?ver=4.5 "

Legen Sie die CSS/JS-Dateien von Flexslider in Ihr übergeordnetes Themenverzeichnis oder follow this.