[BBcode] Miniatura V3 Tema Solucionado
Nombre: BBcode Miniatura con highslide + Botón + css
Autor: DaVidU
Descripción: BBcode miniatura de imágenes compatible con el Highslide + botón thumbnail para abrir en nueva ventana/pestaña del navegador + css.
Fuente: http://www.coloreatuforo.com
Este BBcode tiene 2 opciones para ver las imágenes, una de ellas es la compatible con highslide haciendo click en la imágen y la otra es el thumbnail desde el botón para ver en otra ventana/pestaña del navegador.
Primero de todo tenemos que agregar el css en la plantilla que usamos, en estilos basados en prosilver abrir el archivo colours.css de la carpeta theme y en estilos basados en subsilver2 abrir el archivo stylesheet.css de la carpeta themeuna vez abierto al archivo dependiendo de tu plantilla agregar esto al final del archivo:
Código: Seleccionar todo
.miniatura {
font-size: 10px;
font-weight: bold;
color: #000;
background-color: #FFF;
text-align: center;
margin: 0 auto;
padding: 10px;
min-height:50px;
width:300px;
border: 2px solid #000;
}Ahora vamos a crear el BBcode
Uso de BBcode:
Código: Seleccionar todo
[miniatura3]{URL}[/miniatura3]Código: Seleccionar todo
<div class="miniatura">
<a href="{URL}" class="highslide" onclick="return hs.expand(this)"><img src="{URL}" alt="" title="Click para agrandar" style="max-width:300px; max-height:300;" /></a><br>
<input class="button2 btnlite" type="button" value="Click aquí o en la imágen para ver a tamaño real" onclick="window.open('{URL}', '_blank')" title="Miniatura" />
</div>Código: Seleccionar todo
Miniatura3: [miniatura3]URL DE LA IMÁGEN[/miniatura3]Ejemplo:
Código: Seleccionar todo
[miniatura3]http://img4.imageshack.us/img4/1784/28872586.png[/miniatura3]
[miniatura3]http://img291.imageshack.us/img291/1306/captura02140310.jpg[/miniatura3]
[miniatura3]http://www.coloreatuforo.com/styles/prosilver/imageset/site_logo.png[/miniatura3]Click aquí para ver la demo
En caso de no usar el highslide se puede dejar el click de la imágen de la misma manera que en el botón, tan solo se ha de hacer este cambio:
Buscar esto:Código: Seleccionar todo
class="highslide" onclick="return hs.expand(this)"Código: Seleccionar todo
class="litebox" target="_blank"