harry_ord Posted November 22, 2016 Share Posted November 22, 2016 Hello This is my site made on Wordpress, the theme was made by other people:http://www.endeavor.cl/ I need to add a popup in the home section, so i installed some popup plugins and neither of them worked, i even tried using the echo do_shortcode[''] function of Wordpress and it doesn't work either.The i tried to use bootstrap modals, i just copied the example we have on w3schools and the button doesn't respond, the popup won't appear.So i decided to use jquery-ui:https://jqueryui.com/dialog/It doesn't work either, it's like something in the theme is preventing to have anything poping-up in the page.At the end i tried a Javascript alert() and only that worked.Well, how can i make jquery-ui work on this page?Here is my header.php where i included the script: <!DOCTYPE html> <!--[if IE 6]> <html id="ie6" <?php language_attributes(); ?>> <![endif]--> <!--[if IE 7]> <html id="ie7" <?php language_attributes(); ?>> <![endif]--> <!--[if IE 8]> <html id="ie8" <?php language_attributes(); ?>> <![endif]--> <!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!--> <html <?php language_attributes(); ?>> <!--<![endif]--> <head> <meta charset="<?php bloginfo( 'charset' ); ?>" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <?php if (have_posts()):while(have_posts()):the_post(); endwhile; endif;?> <!-- the default values --> <meta property="fb:app_id" content="570150036476648" /> <!-- if page is content page --> <?php if (in_category('categoria-videos')) { ?> <meta property="og:url" content="<?php the_permalink() ?>"/> <meta property="og:title" content="<?php single_post_title(''); ?> | <?php bloginfo('name'); ?>" /> <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" /> <meta property="og:type" content="article" /> <meta property="og:image" content="http://i.ytimg.com/vi/<?php the_field('video-youtube-id'); ?>/hqdefault.jpg" /> <meta property="og:image:width" content="300"/> <meta property="og:image:height" content="300"/> <?php } elseif (is_single()) { ?> <meta property="og:url" content="<?php the_permalink() ?>"/> <meta property="og:title" content="<?php single_post_title(''); ?> | <?php bloginfo('name'); ?>" /> <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" /> <meta property="og:type" content="article" /> <?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'medium' ); ?> <meta property="og:image" content="<?php echo $feat_image;?>" /> <meta property="og:image:width" content="300"/> <meta property="og:image:height" content="300"/> <?php } elseif (is_page()) { ?> <meta property="og:url" content="<?php the_permalink() ?>"/> <meta property="og:title" content="<?php single_post_title(''); ?> | <?php bloginfo('name'); ?>" /> <meta property="og:description" content="Endeavor lidera el movimiento global que busca impulsar el crecimiento económico sostenible, a través de la selección de Emprendedores de Alto Impacto" /> <meta property="og:type" content="article" /> <?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?> <meta property="og:image" content="<?php bloginfo('template_directory'); ?>/template/FotoShare.jpg" /> <meta property="og:image:width" content="450"/> <meta property="og:image:height" content="298"/> <?php } elseif(is_home()) { ?> <meta property="og:site_name" content="<?php bloginfo('name'); ?>" /> <meta property="og:title" content="Endeavor Chile | www.endeavor.cl" /> <meta property="og:description" content="Endeavor lidera el movimiento global que busca impulsar el crecimiento económico sostenible, a través de la selección de Emprendedores de Alto Impacto" /> <meta property="og:type" content="website" /> <meta property="og:image" content="<?php bloginfo('template_directory'); ?>/template/FotoShare.jpg" /> <meta property="og:image:width" content="450"/> <meta property="og:image:height" content="298"/> <?php } else { ?> <meta property="og:site_name" content="<?php bloginfo('name'); ?>" /> <meta property="og:description" content="Endeavor lidera el movimiento global que busca impulsar el crecimiento económico sostenible, a través de la selección de Emprendedores de Alto Impacto" /> <meta property="og:type" content="website" /> <meta property="og:image" content="<?php bloginfo('template_directory'); ?>/template/FotoShare.jpg" /> <meta property="og:image:width" content="450"/> <meta property="og:image:height" content="298"/> <?php } ?> <title> <?php // Print the <title> tag based on what is being viewed. global $page, $paged; wp_title( '|', true, 'right' ); // Add the blog name. bloginfo( 'name' ); // Add the blog description for the home/front page. $site_description = get_bloginfo( 'description', 'display' ); if ( $site_description && ( is_home() || is_front_page() ) ) echo " | $site_description"; // Add a page number if necessary: if ( $paged >= 2 || $page >= 2 ) echo ' | ' . sprintf( __( 'Page %s', 'twentyeleven' ), max( $paged, $page ) ); ?> </title> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $( function() { $( "#dialog" ).dialog(); } ); </script> <link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/template/favicon.ico" type="image/x-icon" /> <!-- Fancybox --> <?php include(TEMPLATEPATH . '/fancybox/lib/fancyincludes.php'); ?> <!-- Nicescroll --> <script src="<?php bloginfo('template_directory'); ?>/nicescroll/jquery.nicescroll.js"></script> <!-- Masonry --> <script src="<?php bloginfo('template_directory'); ?>/isotope/isotope.pkgd.js"></script> <!-- PARALLAX --> <script src="<?php bloginfo('template_directory'); ?>/parallax/parallax.js"></script> <script src="<?php bloginfo('template_directory'); ?>/popup/jquery.modal.min.js"></script> <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" /> <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/popup/jquery.modal.min.css" type="text/css" /> <script> $(window).load(function() { <!---- MASONRY ---> var $container = $('.grid'); // initialize $container.isotope({ itemSelector: '.grid-item', layoutMode: 'fitRows' }); <!---- MASONRY ---> }); $(window).scroll( function(){ /* Check the location of each desired element */ $('.show').each( function(i){ var bottom_of_object = $(this).offset().top + $(this).outerHeight(); var bottom_of_window = $(window).scrollTop() + $(window).height()+100; /* If the object is completely visible in the window, fade it in */ if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},300); } }); }); $(window).on('load resize', function () { if ($(window).width() >= 1000){ $("#menu-top").removeClass(); $("#menu-top").addClass("desktop"); }else{ $("#menu-top").removeClass(); $("#menu-top").addClass("touch"); $("#menu-top.touch .menu-item-has-children a").addClass("primer-boton").css('cursor','pointer'); $("#menu-top.touch .sub-menu a").removeClass(); $("#menu-top.touch .primer-boton").removeAttr("href"); $('#menu-top.touch .menu-item-has-children > .sub-menu').parent().click(function() { var submenu = $(this).children('.sub-menu'); if ( $(submenu).is(':hidden') ) { $(submenu).slideDown(200); } else { $(submenu).slideUp(200); } }); } }); <!---- NICESCROLL ---> var nice = false; $(document).ready( function() { nice = $("html").niceScroll(); } ); <!---- NICESCROLL ---> <!---- MENU ---> $(document).ready(function(){ $("#nav-mobile-hold").click(function(){ $("#menu-top").slideToggle(); $("#nav-mobile").toggleClass('active'); }); }); <!---- MENU ---> jQuery(document).ready(function($) { $('#post-content a[href$="jpg"], #post-content a[href$="png"], #post-content a[href$="jpeg"]').fancybox(); }); </script> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $( function() { $( "#dialog" ).dialog(); } ); </script> </head> <body> <div id="dialog" title="Basic dialog"> <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> </div> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-45413975-1', 'auto'); ga('send', 'pageview'); </script> <script> window.fbAsyncInit = function() { FB.init({ appId : '570150036476648', xfbml : true, version : 'v2.5' }); }; (function(d, s, id){ var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> <?php include('includes/preload.php'); ?> <div id="header"> <div id="menu-top" class="menu-top"> <?php wp_nav_menu( array( 'theme_location' => 'menu_sup', 'menu_class' => 'primary', 'fallback_cb' => '') ); ?> </div> <div class="barra-menu"> <div id="nav-mobile-hold"> <div class="texto">menu</div> <div id="nav-mobile"> <span class="ln-one"></span> <span class="ln-two"></span> <span class="ln-three"></span> </div> </div> <a href="<?php echo get_settings('home'); ?>"><img id="logo-top" src="<?php bloginfo('template_directory'); ?>/template/logo-top.svg"></a> <div id="redes-top"> <div id="searchbox" > <form class="search" method="get" action="<?php echo home_url(); ?>" role="search"> <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Buscar…', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" /> <button type="submit" role="button" class="btn btn-default right"/><span class="glyphicon glyphicon-search white">></span></button> </form> </div> <a href="https://www.facebook.com/Endeavor-Chile-343478338971/?fref=ts" target="_blank"><img id="facebook-top" class="boton" src="<?php bloginfo('template_directory'); ?>/template/iconos/facebook-blanco.svg"></a> <a href="https://twitter.com/endeavorchile" target="_blank"><img id="twitter-top" class="boton" src="<?php bloginfo('template_directory'); ?>/template/iconos/twitter-blanco.svg"></a> <a href="https://www.youtube.com/user/endeavorCL" target="_blank"><img id="youtube-top" class="boton" src="<?php bloginfo('template_directory'); ?>/template/iconos/youtube-blanco.svg"></a> <a href="https://cl.linkedin.com/in/endeavorchile" target="_blank"><img id="linkedin-top" class="boton" src="<?php bloginfo('template_directory'); ?>/template/iconos/linkedin-blanco.svg"></a> </div> </div> <?php include('includes/prox-evento.php'); ?> </div> <div id="dialog" title="Basic dialog"> <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> </div> Link to comment Share on other sites More sharing options...
dsonesuk Posted November 22, 2016 Share Posted November 22, 2016 You only require one version of jquery to be linked to, also if you mix https with http you will get insecure error, it best to leave https or http out from the link in jquery <script src="//code.jquery.com/jquery-1.12.4.js"></script><script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script> then it does not matter if webpage is http or https, because link is not specific to either. Link to comment Share on other sites More sharing options...
harry_ord Posted November 22, 2016 Author Share Posted November 22, 2016 Ok, done, but that doesn't solve the problem. <script src="//code.jquery.com/jquery-1.12.4.js"></script> <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script> Link to comment Share on other sites More sharing options...
dsonesuk Posted November 22, 2016 Share Posted November 22, 2016 According to console there are errors Specified "type" attribute of "video/mp4; codecs="avc1,mp4a"" is not supported. Load of media resource http://www.endeavor.cl/wp-content/themes/TemaBase/template/video/bg-video.mp4 failed. www.endeavor.clTypeError: $(...).fancybox is not a function www.endeavor.cl:70:3TypeError: $container.isotope is not a function www.endeavor.cl:263:0 Link to comment Share on other sites More sharing options...
harry_ord Posted November 22, 2016 Author Share Posted November 22, 2016 (edited) Can't i just ignore those error? i'm not trying to load those stuff, i don't care. Does it affect what i'm trying to do? Also that video i see it loading. Edited November 22, 2016 by harry_ord Link to comment Share on other sites More sharing options...
dsonesuk Posted November 22, 2016 Share Posted November 22, 2016 Na! I just like informing you of errors just to annoy you, then let you waste hours trying to fix your current problem, then you realise if there were no errors your actual problem goes away. Link to comment Share on other sites More sharing options...
dsonesuk Posted November 22, 2016 Share Posted November 22, 2016 The Problem with wordpress plugins, is if it requires jquery, they install jquery in folder and insert a link to it, so when you have installed numerous plugins you will find you end up with multilple jquery links, with multiple versions, which in turn causes conflicts. You either remove duplicate jquery links, using a plugin which gives you control of links used and where they are placed, or edit functions.php Link to comment Share on other sites More sharing options...
harry_ord Posted November 22, 2016 Author Share Posted November 22, 2016 I added <?php wp_head(); ?> at the begining of the header.php file and now i can load some plugins, i tried with 3 different popup plugins and neither of them worked. Link to comment Share on other sites More sharing options...
dsonesuk Posted November 22, 2016 Share Posted November 22, 2016 The code that maybe is causing problems I suggest you comment them out, also disable any pop up blockers you have installed on your browser. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now