Shadowbox: Ventanas modales Multimedia para blogger.
Shadowbox es un plugin de script que no necesita jquery para funcionar, es fabuloso plugin crea ventanas en popup con shadow, para que la imegenes se vean más grandes, se vean los videos, crear galerias y ver paginas web dentro de otra pagina.
Es muy facil poner este plugin en tu Blog siguiendo los siguientes pasos.
Imagen
Galeria
Archivo SWF
Video YouTube
Lo que está en rojo es el codigo del video: http://www.youtube.com/watch?v=8vfiaNtF9B4 o http://youtu.be/8vfiaNtF9B4
Video QuickTime
Video Yahoo! screen
Vimeo
Veevr
Video Google
Pagina web
Mapa
Fuente | Shadowbox.js
Shadowbox es un plugin de script que no necesita jquery para funcionar, es fabuloso plugin crea ventanas en popup con shadow, para que la imegenes se vean más grandes, se vean los videos, crear galerias y ver paginas web dentro de otra pagina.
Es muy facil poner este plugin en tu Blog siguiendo los siguientes pasos.
- Ve a Plantilla, luego has click en Edicion de HTML y busca la etiqueta </head>.
- encima de ella agrega lo siguiente.
<link href='http://dl.dropbox.com/u/23616660/ihojosestudios/FUTUdownloads/js/shadowbox.css' rel='stylesheet' type='text/css'/>
<script src='http://dl.dropbox.com/u/23616660/ihojosestudios/FUTUdownloads/js/shadowbox.js' type='text/javascript'/>
<script type='text/javascript'>
Shadowbox.init({
overlayColor: "#000",
overlayOpacity: "0.6",
});
</script>
- Guardas los cambios,
- ahora cuando crees entradas puedes poner los siguientes.
Imagen
<a href="URL de la imagen" rel="shadowbox" title="Imagen">Imagen</a>
<a href="URL de la imagen" rel="shadowbox[galeria1]" title="Imagen">Imagen 1</a>
<a href="URL de la imagen" rel="shadowbox[galeria1]" title="Imagen">Imagen 2</a>
<a rel="shadowbox;width=600;height=360" title="titulo" href="URL del archivo SWF">Imagen</a>
Lo que está en rojo es el codigo del video: http://www.youtube.com/watch?v=8vfiaNtF9B4 o http://youtu.be/8vfiaNtF9B4
<a rel="shadowbox;width=405;height=340;" title="titulo" href="http://www.youtube.com/v/8vfiaNtF9B4&hl=en&fs=1&rel=0&autoplay=1">Imagen</a>
<a rel="shadowbox;width=600;height=360" title="Titulo" href="URL del video MOV">Imagen</a>
<a rel="shadowbox;width=600;height=360" title="Titulo" href="http://d.yimg.com/static.video.yahoo.com/yep/YV_YEP.swf?ver=2.2.40">Imagen</a>
<a rel="shadowbox;width=600;height=360" title="Titulo" href="http://player.vimeo.com/video/1893986?autoplay=1">Imagen</a>
<a rel="shadowbox" title="Titulo" href="http://veevr.com/embed/JgGVTsfq_?w=640&h=360">Imagen</a>
<a rel="shadowbox;width=600;height=360" title="Titulo" href="http://video.google.com/googleplayer.swf?docid=7137075178977335350">Imagen</a>
<a rel="shadowbox;width=800;height=600" title="Titulo" href="URL de la página">Página web</a>
<a rel="shadowbox;width=425;height=350" title="Titulo" href="URL del mapa">Imagen</a>
Fuente | Shadowbox.js