Implementar fancybox en wordpress

[boryi]

Hola, estoy implementando fancybox en wordpress a "mano", sin ningún plugin, hago todos los pasos como dice en su pagina, y en una pagina html o php normal sale perfecto, pero luego intento hacer en vinculo al fancybox dede el editor de wordpressy nada, que no funciona, alguien sabe porque??, el viculo que pongo es:

<a class="fancybox" data-fancybox-type="iframe" ref="http://www.misitio.com/pagina1/">link</a>

Gracias

[ArturoGallegos]

Y al momento de imprimir la pagina si sale tal cual?

No recuerdo bien pero hay parámetros o cosas que wordpress elimina al guardar y el data-fancybox-type puede que no se guarde.

Ya revisaste que todos los archivos se carguen correctamente al visitar el sitio?

[boryi]

No se porque pero si cargas el fancybox en wordpress sin plugin, no funciona nada bien

[ArturoGallegos]

jejeje que casualidad... lo que pasa es que si tu no sabes responder a las preguntas que hice nosotros tampoco sabemos y como no somos adivinos pues no te podemos ayudar.

fancybox con o sin plugin funciona, todo depende como lo implementes

[boryi]

y que estoy haciendo mal??, porque se ejecuta mas lento que el caballo del malo!!

[ArturoGallegos]

Pues ando escaso de facultades adivinatorias pero voy a asumir que lo en lo que haces mal es en no enseñar el código con el que has incluido los archivos necesarios, y para colmo darme el avionazo con las preguntas que te hice.... así no queda mucho de donde ayudarte ni ganas.

[boryi]

Perdona Arturo, tienes razon, lo siento-

Te cuento, he implementado el Fancybox, como te dije, "a mano, sin plugin, y no se porque pero al reproducir el video, que para eso lo necesito, y funcionar funciona, pero me ba muy lento y se reproduce antes el sonido que el video, y eso que lo estoy probando en local.

Te digo lo que he hecho y me dices si no te imprta a ver donde me confundo.

1. En la carpeta de la plantilla me pego la carpeta del Fancybox.

2. En el header.php pongo la llamada a la libreria jquery y a los archivos de Fancybox (jquery.fancybox.css y jquery.fancybox.pack.js)

3. En el header.php pego el codigo para el Fancybox:

<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox()({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
</script>

4. Creo una página nueva en el wordpress y pongo el link para que se me abra el video:

Para ver el video pulsa <a class="ifancybox" ref="videos/video2.mp4">aqui</a>

pero nada no se abre en fancybox, y me estoy volviendo loco

[boryi]

Si lo hago en un html normal, sale perfectamente, pero luego lo intento implementar el wordpress y nada, no hay manera.

Lo q1ue hago es lo siguiente para implementarlo en wordpress, a ver si saves por favor donde me equiboco.

1. Desccargo los archivos de Fancybox y los pongo en la carpeta de mi theme

2. En el header hago llamada a la libreria jquery y a los archivos de fancybox:

<!-- Adjunto la libreria jquery -->
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />

<!-- Adjunto los archivos del fancybox -->
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/fancybox/jquery.fancybox-1.3.4.pack.js"></script>

<link rel="stylesheet" type="<?php echo get_stylesheet_directory_uri(); ?>/text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen">
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/fancybox/css/style.css">

<script type="text/javascript">
$(document).ready(function(){
$(".ifancybox").fancybox({
'width' : '80%',
'height' : '100%',
'autoScale' : true,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
</script>

3. Creo una nueva pagina en wordpress y le pongo un link para que me abra el video en fancybox:

Para ver el video pulsa <a class="ifancybox" href="http://www.dominio.com/nobreplantilla/videos//video2.mp4">aqui</a>

y nada, que no funciona, no me lo explico como en un html o php funciona y luego voy a implementarlo en wordpress y no funciona

Gracias por tu ayuda y salu2

[ArturoGallegos]

Haz mencionado que los JS los agregas en el header... estos preferentemente deben ir en el footer....

Aunque si quieres dejarlos en el header no hay problema... solo cerciorate que se carguen después de jquery.... revisa bien, estos deben ir después de wp_head()
Si los pones antes, jquery se ejecuta después por lo que no se procesa.

[boryi]

Pes igual hay tengo el probema, tengo el wp_head() despues. Pero no entiendo bien porque tiene que ir el wp_head() antesw, pero bueno, lo cambio y te cuento.

Gracias

[ArturoGallegos]

wp_head manda llamar los contenidos, scripts y estilos declarados con add_action, wp_enqueue_script y wp_enqueue_style

jQuery esta declarado y se carga de esa forma, por lo que es natural que tenga que ser cargado antes de tus scripts que dependan de este.

Todo es cuestión de jerarquías