I resolved my issue. I thought I would post it here in case anyone else ever has this issue.
I have been trying to resolve this issue for months now. I was only able to get it to display by:
1. Loading jquery library in the head.
2. Moving an older script by the previous developer to the head
3. Moving the existing scripts that were in the footer to the head.
Even with the scripts loading in the head, it does not seem to be affecting the load time too much.
This is how the header.php is loading now.
<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <div id="main">
*
* @package WordPress
* @subpackage Twenty_Ten
* @since Twenty Ten 1.0
*/
?><!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
<title><?php wp_title(''); ?></title>
<link rel="profile" href="https://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/jquery.sidr.css">
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/foundation.css">
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/app.css">
<?php if ( is_front_page() ) { ?>
<?php } else { ?>
<?php } ?>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,600,700,800' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=PT+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link rel="apple-touch-icon" href="<?php bloginfo('template_url'); ?>/touch-icon.png" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
// $(document).ready(function () {
jQuery(document).ready(function ($) {
// MOBILE MENU
$("#sidr").hide();
$("#sidr").fadeTo( "slow", 0.98 );
$("#sidr a").click(function(event){
$('#sidr').animate({scrollTop:0});
});
$("#sidr ul li").has("ul").find("a").click(function(event){
$(this).next('ul').slideToggle(300);
$('#sidr a').removeClass('active');
// $(this).parent("li").find("a:first-child").addClass("active");
$(this).addClass('active');
});
$("#sidr > ul > li > a").click(function(event){
$("#sidr > ul > li > a").not(this).next('ul').slideUp(300);
});
$("#sidr > ul > li > ul > li > a").click(function(event){
$("#sidr > ul > li > ul > li > a").not(this).next('ul').slideUp(300);
});
$(".showhidemenu").click(function(event){
$('#sidr').toggleClass('open');
});
$(".show-photo-gallery").click(function(event){
$('#photo-gallery').slideDown(300);
$('#photos-slider').owlCarousel_old({
loop:false,
margin:10,
items: 4,
nav: false,
dots: true,
responsiveClass:true,
responsive:{
0:{
items:1,
slideBy: 1
},
767:{
items:2,
slideBy: 2
},
992:{
items:4,
slideBy: 4
}
}
});
$('#video-gallery').slideUp(300);
});
$(".show-video-gallery").click(function(event){
$('#photo-gallery').slideUp(300);
$('#video-gallery').slideDown(300);
$('#video-listing').owlCarousel_old({
loop:false,
margin:10,
items: 4,
nav: false,
dots: true,
responsiveClass:true,
responsive:{
0:{
items:1,
slideBy: 1
},
767:{
items:2,
slideBy: 2
},
992:{
items:4,
slideBy: 4
}
}
});
});
// MOBILE MENU END
// AUTO RESIZE VIDEOS
$("iframe").wrap("<div class='flex-video'/>");
// AUTO RESIZE VIDEOS END
});
</script>
<script src="<?php bloginfo('template_url'); ?>/js/modernizr.foundation.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/foundation.min.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/app.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/fastclick.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/smoothscroll.js"></script>
<?php
if ( is_user_logged_in() ) {
?>
<style>
@media handheld, only screen and (max-width: 767px) {
html {margin-top:0px !important;}
}
</style>
<?php }
else { ?>
<?php } ?>
<!--[if lt IE 9]>
<script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/respond.min.js"></script>
<![endif]-->
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
if ( is_singular() && get_option( 'thread_comments' ) )
wp_enqueue_script( 'comment-reply' );
wp_head();
?>
<?php wp_head(); ?>
</head>
This is how the footer appears now.
<!-- MOBILE NAVIGATION END -->
<?php if ( is_front_page() ) { ?>
<?php } else { ?>
<?php } ?>
<script>
$(function() {
FastClick.attach(document.body);
});
</script>
<?php
wp_footer();
?>
This is the gallery now
https://canflex.oakharborwebdesign.com/foo-owl-carousel/
