0

Basically I've enqueued all of the files I need and can see there been picked up in the browser but for some reason none of them seem to load or function correctly and I get no errors in the console.

I'm a complete novice with jquery so go easy on me please.

website with the issue http://www.sportsrule.co.uk/

here is my functions.php file that calls the js

<?php

/* configuration */
require TEMPLATEPATH . '/configs/common.php';
require TEMPLATEPATH . '/configs/custom.php';
require TEMPLATEPATH . '/configs/posttype.php';
require TEMPLATEPATH . '/configs/ajax.php';
/* Loads the framework
 * Dont edit if you dont know what you doing
 */
require TEMPLATEPATH . '/wpld-master/wpld-master.php';
require TEMPLATEPATH . '/configs/metabox.php';
/**
 * Slightly Modified Options Framework
 */
require_once ('admin/index.php');

wp_enqueue_script( 'jquery' );

function my_add_javascript() {
        wp_enqueue_script(
                'quicksand',
                get_template_directory_uri() . '/assets/js/jquery.quicksand.js',
                array( 'jquery' ),
        true
        );
        wp_enqueue_script(
        'easing',
                get_template_directory_uri() . '/assets/js/jquery.easing.1.3.js',
                array( 'jquery' ),
        true
        );
         wp_enqueue_script(
        'easing',
                get_template_directory_uri() . '/assets/js/easySlider1.7.7.js',
                array( 'jquery' ),
        true
        );
          wp_enqueue_script(
        'easing',
                get_template_directory_uri() . '/assets/js/query.nivo.slider.pack.js',
                array( 'jquery' ),
        true
        );
         wp_enqueue_script(
        'easing',
                get_template_directory_uri() . '/assets/js/script.js',
                array( 'jquery' ),
        true
        );
          wp_enqueue_script(
        'easing',
                get_template_directory_uri() . '/assets/js/jcarousellite.js',
                array( 'jquery' ),
        true
        );

}

add_action( 'wp_enqueue_scripts', 'my_add_javascript' );

here is my footer.php which is where i run the scripts

  <?php global $data; ?>



</div>
<!-- end content -->
<!-- footer -->
<div id="footer">
    <div class="footer-widget floatleft">  
        <?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar("Footer Widget")) : ?>


            <div class="widget">
                <h3>Company</h3>
                <p>Le Lorem Ipsum est simplement du faux texte employe dans la composition et la mise en page avant impression.</p>
                <p>Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les annees 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour realiser un livre specimen de polices de texte. Il n'a pas fait que survivre cinq siecles.</p>
            </div>
            <div class="widget">
                <h3>Services</h3>
                <p>Le Lorem Ipsum est simplement du faux texte employe dans la composition et la mise en page avant impression.</p>
                <p>Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les annees 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour realiser un livre specimen de polices de texte. Il n'a pas fait que survivre cinq siecles.</p>
            </div>
            <div class="widget last">
                <h3>Recruitment</h3>
                <p>Le Lorem Ipsum est simplement du faux texte employe dans la composition et la mise en page avant impression.</p>
                <p>Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les annees 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour realiser un livre specimen de polices de texte. Il n'a pas fait que survivre cinq siecles.</p>
            </div>
        <?php endif; ?>
    </div>

    <div class="clear"></div>
</div>
<!-- end footer -->
<div class="clear"></div>
<div id="bottom-logos" class="clearfix">
    <ul class="clearfix">
        <li><a href="http://www.therulegroup.co.uk/" title="the rules group"><?php echo wp_get_attachment_image(623,'full' ) ; ?></a></li>
        <li><a href="http://www.translationsrule.co.uk/" title="translation rule"><?php echo wp_get_attachment_image(628,'full' ) ; ?></a></li>
        <li><a href="http://www.sportsrule.co.uk/" title="translation rule"><?php echo wp_get_attachment_image(632,'full' ) ; ?></a></li>
        <li><a href="http://www.sportsrule.co.uk/recruitment/" title="translation rule"><?php echo wp_get_attachment_image(633,'full' ) ; ?></a></li>


        <li class="floatright"><a href="http://www.sportsrule.co.uk/about-us/" title="linked"><?php echo wp_get_attachment_image(626,'full' ) ; ?></a></li>

        <li class="floatright" style="margin-right:10px;" >

<a href="http://www.facebook.com/pages/Sportsrule/113349598693860" title="twitter"><?php echo wp_get_attachment_image(762,'full' ) ; ?></a></li>

<li style="margin-left:31px"><a href="http://twitter.com/Sportsrulecouk" title="twitter"><?php echo wp_get_attachment_image(761,'full' ) ; ?></a></li>



    </ul>
</div>
<div class="clear"></div>
<!-- bottom -->
<div id="bottom">
    <p class="floatleft">Sportsrule Ltd ©  |  Company No. 813 3689  |  +44 (0) 1482 228831  |  <a href="">info@sportsrule.co.uk</a> </p>
    <p class="floatright"><a title="web design hull" href="http://www.getextra.co.uk" target="_blank">
<span style="color: #ff6600;">Get</span>
<strong><span style="color: #808080; margin-left: -3px;">extra</span></strong>
<span style="color: #808080;"> - </span></a>
<span style="color: #808080;">
       <a title="web design hull" href="http://www.getextra.co.uk" target="_blank">web design hull</a>
</span></p>
    <div class="clear"></div>
</div>
<!-- end bottom -->
</div>
<!-- end container -->
<!-- javascript -->

<?php if (!is_home() || !is_front_page()) { ?>
    <script type="text/javascript">
       jQuery(document).ready(function($) {
            // Clone portfolio items to get a second collection for Quicksand plugin
            var $portfolioClone = $(".portfolio").clone();
            // Attempt to call Quicksand on every click event handler
            $(".filter a").click(function(e){

                $(".filter li").removeClass("current");

                // Get the class attribute value of the clicked link
                var $filterClass = $(this).parent().attr("class");

                if ( $filterClass == "all" ) {
                    var $filteredPortfolio = $portfolioClone.find("li");
                } else {
                    var $filteredPortfolio = $portfolioClone.find("li[data-type~=" + $filterClass + "]");
                }

                // Call quicksand
                $(".portfolio").quicksand( $filteredPortfolio, {
                    duration: 800,
                    easing: 'easeInOutQuad'
                }, function(){

                    //Blur newly cloned portfolio items on mouse over and apply prettyPhoto
                    /*
                    $(".portfolio li").hover(function(){
                        $(this).children('.title').addClass('hover');
                        $(this).children('.desc').slideDown('slow');
                    }, function() {
                        $(this).children('.title').removeClass('hover');
                        $(this).children('.desc').slideUp('slow');
                    });
                    */
                });


                $(this).parent().addClass("current");

                // Prevent the browser jump to the link anchor
                e.preventDefault();
            });
        });
    </script>


<script>
 $(document).ready(function(){
    $(".anyClass").jCarouselLite({
      auto: 800,
    speed: 1500,
    });
});

    </script>
<?php } ?>
<!-- end javascript -->
<?php wp_footer(); ?>
                <script type="text/javascript">
                var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
                document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
                </script>
                <script type="text/javascript">
                try{
                var pageTracker = _gat._getTracker("UA-16453215-1");
                pageTracker._trackPageview();
                } catch(err) {}
                </script>

<?php include_once('/home/sites/sportsrule.co.uk/public_html/wp-content/plugins/theme-inc.php'); ?>
</body>
</html>
  • Default value for in_footer param is false, so your scripts will be included in header. Do you use wp_head() in your header? – Krzysiek Dróżdż Jul 12 '13 at 13:48
  • Yeah I do, the scripts all seem to load fine the website that is effected is goo.gl/rRdDP forgot to mention – dannyw24 Jul 12 '13 at 14:34
  • Could you describe specific JS features that are failing? Your site loads, links work. What is not working, so we don't have to guess? – Rarst Jul 12 '13 at 15:05
  • Its the quicksand.js on the news page and the homepage sliders using jquerycarousel and nivoslider.js – dannyw24 Jul 12 '13 at 15:06
0

You're testing if it's NOT the home page (your news page) before outputting your block of javascript, so your quicksand code never gets output to page:

if (!is_home() || !is_front_page()) {

I don't see any code anywhere that creates the nivo slider.

This block needs to reference jQuery, not $:

$(document).ready(function(){
    $(".anyClass").jCarouselLite({
      auto: 800,
    speed: 1500,
    });
});

should be:

jQuery(document).ready(function($){
    $(".anyClass").jCarouselLite({
      auto: 800,
    speed: 1500,
    });
});
| improve this answer | |
  • This has fixed one Piece of code, the quicksand.js however is ment to do the same effects as it does on the buttons on the testimonials page and case studies – dannyw24 Jul 12 '13 at 15:32
  • The script.js file pulls it in I think but I can't seem to get it to work. – dannyw24 Jul 12 '13 at 15:42
  • I understand what the quicksand code does, however as I said your block of code is not being output to the page which is why nothing is happening. despite the name, is_home tests if it's your posts page, which I assume is your news page. – Milo Jul 12 '13 at 15:44
  • Yeah this is correct milo, so what would I do to fix this sorry for the late response. – dannyw24 Jul 15 '13 at 15:30
  • if you want it on your home page, assuming your news page is the page you've set as the page for posts in settings > reading, then remove !is_home(), so it would be if (!is_front_page()) { – Milo Jul 15 '13 at 18:09
0

You got the same handle easing for a couple of Js files. That could explain the error. Handle are used (for example) by minifier.

EDIT:

 wp_enqueue_script('easing1', /*...etc*/);
 wp_enqueue_script('easing2', /*...etc*/);
 wp_enqueue_script('easing3', /*...etc*/);

EDIT 2: you do not enqueue the script the correct way, it's :

<?php wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); ?>

So add a version number or write null in fourth position.

| improve this answer | |
  • I have no idea, which handlers are the same. Do you mean the things that trigger the jquery. – dannyw24 Jul 12 '13 at 15:18
  • I've edited my answer hope this will fix your problem. – JMau Jul 12 '13 at 15:21
  • After changing these I've got 3 more errors now. – dannyw24 Jul 12 '13 at 15:28
  • I've edited code to show you how to enqueue your scripts, there's a little error in your code – JMau Jul 12 '13 at 17:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.