BBCode MOD para phpBB 3

Moderadores: Carlos, Soporte en MODs, Soporte en phpBB

Reglas del Foro: Solo BBCode, no dudas por favor.
  • Avatar de Usuario
Avatar de Usuario
By cisco007
#47
Titulo: Imágenes Colorbox
Descripción: con este bbcode puedes poner imágenes en tus mensajes y se abren usando Colorbox jquery.
Autor(es)/or Enlace: bbcode yo, codigo de aqui colorbox

Pedido?: no!

originalmente hecho por mi aqui:
colorbox image bbcode

Notas:
    primero hay que añadir unas lineas a nuestro header.


Encontrar
Código: Seleccionar todo </head>

añadir antes
Código: Seleccionar todo<link rel="stylesheet" href="{ROOT_PATH}colorbox/colorbox.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="{ROOT_PATH}colorbox/jquery.colorbox.js"></script>

si ya tienes una linea de jquery, quita esta linea:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
y agrega las otras lineas después de tu jquery.

Uso BBcode:
Código: Seleccionar todo[colorbox]{URL},{SIMPLETEXT}[/colorbox]

Reemplazo HTML:
Código: Seleccionar todo<script type="text/javascript">
// <![CDATA[
$(document).ready(function(){
$(".album").colorbox({rel:'album', slideshow:true, slideshowSpeed:3500, transition:"elastic", scalePhotos:true, maxWeight:"800px", maxHeight:"800px", fixed:true});
});
// ]]>
</script>
<a class="album" href="{URL}" title="{SIMPLETEXT}" style="text-decoration:none;"><img src="{URL}" alt="{L_IMAGE}" style="width: 40%;height: 40%;" /></a>

Línea de ayuda:
Código: Seleccionar todo[colorbox]enlace de imagen,descripción[/colorbox]

Ejemplo:
Código: Seleccionar todo[colorbox]http://www.converse.edu/sites/default/files/galleries/2010_berry_bate_sculptures/images/spring_dance.jpg,wow que guapas[/colorbox]

DEMO:
Imagen

FAQ:
    también puede usarse para vídeos youtube.
    Titulo: Youtube colorbox bbcode
    Autor(es)/or Enlace: yo cisco007

    Pedido?: no

    Notas:

    Uso BBcode:
    Código: Seleccionar todo[colorboxyt]http://www.youtube.com/watch?v={SIMPLETEXT}[/colorboxyt]

    Reemplazo HTML:
    Código: Seleccionar todo<script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){
    $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:425, fixed:true});
    });
    // ]]>
    </script>
    <a class="youtube" href="http://www.youtube.com/embed/{SIMPLETEXT}?version=3&amp;wmode=transparent" title="youtube video"><img style="width: 130px; height: 97px; border:1px solid black;" alt="YouTube Video " src="http://i3.ytimg.com/vi/{SIMPLETEXT}/default.jpg" /></a>

    Línea de ayuda:
    Código: Seleccionar todo[colorboxyt]enlace de videol[/colorboxyt]

    Ejemplo:
    Código: Seleccionar todo[colorboxyt]http://www.youtube.com/watch?v=617ANIA5Rqs[/colorboxyt]

    DEMO:
    YouTube Video


Descarga

sube carpeta a la raíz de tu foro y reemplazar con estos nuevos!

Descaragas viejas
Descarga!colorbox image plugin
5-22-11
sube carpeta a la raiz de tu foro



Avatar de Usuario
By cisco007
#48
 ! Cisco Dice
actualize colorbox a version nueva
Última edición por cisco007 el 19 Sep 2012 17:36:56, editado 1 vez en total. Razón: actualize version colorbox
¿Quién está conectado?

Usuarios navegando por este Foro: CommonCrawl [Bot] y 0 invitados