• Hi
    I am a trying to develop WordPress theme.
    but I can not connect the JavaScripts files and stylesheets from functions.php page.
    when i enqueueing the js and stylesheet from functions.php the slider and other things does not work properly.
    but when i connect those from the index file by using <script src=”<?php echo get_template_directory_uri(); ?>/js/responsiveslides.min.js”></script> the slider and other elements work properly.
    Please help me, how can i connect those properly?

    I am uploading my whole folder in gitlab, so that you can understand the current condition of my folder.
    https://gitlab.com/ehsanatwork/web/tree/master

    Thank You

Viewing 5 replies - 1 through 5 (of 5 total)
  • AddWeb Solution

    (@addweb-solution-pvt-ltd)

    Hi,

    Please review this documentation for Theme development.

    You are created all file with head section so if there you have to change in head section you need to edit all files. Which is not the correct way.

    So you have to create different file for all your code which repeated on all pages. and include them, like header.php, footer.php, content.php etc.

    You need below changes for your requirement.

    here is your functions.php file:

    <?php  
    function web_theme_setup(){
      register_nav_menu( 'primary', 'This is main menu' );
      add_theme_support( 'post-thumbnails' ); 
    
      add_image_size( 'full', 367, false );
    }
    add_action('init', 'web_theme_setup');
    
    function web_enqueue_scripts() {
      wp_enqueue_style( 'bootstrap',get_template_directory_uri(). '/css/bootstrap.css', array(), false, 'all' );
      wp_enqueue_style( 'style',get_template_directory_uri(). '/css/style.css', array(), false, 'all' );
    
      // js
      wp_enqueue_script( 'responsiveslides', get_template_directory_uri().'/js/responsiveslides.min.js', array( 'jquery' ));
      wp_enqueue_script( 'flexisel', get_template_directory_uri().'/js/jquery.flexisel.js', array( 'jquery' ));
      wp_enqueue_script( 'master', get_template_directory_uri().'/js/master.js', array( 'jquery' ));
      // wp_enqueue_script( 'jquery', get_template_directory_uri().'/js/jquery.min.js', false);
    }
    add_action( 'wp_enqueue_scripts', 'web_enqueue_scripts' );
    
    add_action( 'wp_head', 'my_slider_function' );
    
    function my_slider_function() { ?>
      <script>
          jQuery(function ($) {
            $("#slider").responsiveSlides({
              auto: true,
              nav: true,
              speed: 500,
              namespace: "callbacks",
              pager: true,
            });
          });
      </script>
    <?php }
    ?>
    Thread Starter khojkori

    (@khojkori)

    Hello,
    Thank You For Your help, it just works fine.
    so should i call all the extended javascripts those are included in the index file from functions.php file as you mentions in the attachment?

    Thank You

    AddWeb Solution

    (@addweb-solution-pvt-ltd)

    Yes, This is the correct way to call external css & javascript files.

    Thread Starter khojkori

    (@khojkori)

    Thank You,
    The footer slider is not working, i am trying different way, but nothing works for me.
    can you please help me.
    is the because of jquery version?

    Thank You

    Thread Starter khojkori

    (@khojkori)

    Great,
    the problem is in jquery, i just degrade the jquery and it works like a charm.

    Thank You

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘js and css files is not loading from functions.php file’ is closed to new replies.