Estoy desarrollando un tema de WordPress que abre nuevas publicaciones en cuadros modales en lugar de páginas separadas.
El complemento de presentación de imágenes que estoy usando para mostrar imágenes para cada publicación (Complemento de ciclo de jQuery) funciona muy bien cuando la publicación está en su propia página, pero cuando se usa el Modales simples complemento, las imágenes se muestran en una lista en lugar de una presentación de diapositivas, rompiendo completamente mi diseño.
Así es como se ve una publicación por sí sola (haga clic en las imágenes para avanzar en la presentación de diapositivas): http://cl.ly/240c3C0i1m1o
Puede hacer clic en la primera miniatura de esta página para ver cómo funciona el modal (todavía no he codificado en URL únicas para los modales): http://cl.ly/3A2J1V2q1T0P
Supongo que el complemento jQuery Cycle no funciona en el cuadro modal porque se aplica a la página antes de que se cargue el contenido modal al hacer clic en un enlace. Realmente no lo sé.
Cualquier ayuda sería muy apreciada. Usé esta respuesta para ayudarme a implementar el cuadro modal: Usando simplemodal con wordpress. He incluido un código relevante de mi tema a continuación.
Esto está en mi archivo header.php:
<?php
wp_enqueue_script('jquery.cycle.all.min.js', '/wp-content/themes/Goaty%20Tapes%20Theme/js/jquery.cycle.all.min.js', array('jquery'));
wp_enqueue_script('product-slideshow', '/wp-content/themes/Goaty%20Tapes%20Theme/js/product-slideshow.js');
?>
Esto es lo que está contenido en product-slideshow.js
(inicia la configuración del complemento de ciclo):
$(document).ready(function() { $('.product-images').cycle({
fx: 'none',
next: '.slide',
timeout: 0
}); });
tengo esto en functions.php
para que el modal funcione:
function my_print_scripts() {
if (!is_admin()) {
$url = get_bloginfo('template_url');
wp_enqueue_script('jquery-simplemodal', 'http://66.147.244.226/~goatytap/wp-content/themes/Goaty%20Tapes%20Theme/js/jquery.simplemodal.1.4.1.min.js', array('jquery'), '1.4.1', true);
wp_enqueue_script('my_js', 'http://66.147.244.226/~goatytap/wp-content/themes/Goaty%20Tapes%20Theme/js/site.js', null, '1.0', true);
}
}
add_action('wp_print_scripts', 'my_print_scripts');
esto esta en mi site.js
expediente:
jQuery(function ($) {
$('a.popup').click(function(){
id = this.rel;
$.get('http://66.147.244.226/~goatytap/ajax-handler/?id='+id, function (resp) {
var data = $('<div id="ajax-popup"></div>').append(resp);
// remove modal options if not needed
data.modal({
overlayCss:{backgroundColor:'#FFF'},
containerCss:{backgroundColor:'#fff'}
});
});
return false;
});
});