BB-Code: Spoiler "Bonito"

  • Autor Autor donrodrigo
  • Fecha de inicio Fecha de inicio
D

donrodrigo

Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Bueno no se si es "Wooou que cosa de loco que armaste", pero la verdad me llevo un buen tiempo hacerlo jeje, y me dio ganas de compartirlo por aqui, no se tampoco si el foro adecuado en el que deberia postearlo.

Bueno esta es la imagen de como quedaria una vez realizado todos los pasos:


Ver el archivo adjunto 3677

Pasos a seguir:

  1. Subir la carpeta del rar a la raiz del foro
  2. Ingresar al Panel de admin > Códigos BB > Agregar nuevo codigo BB
    • Titulo: Spoiler
    • Nombre de la etiqueta: Spoiler
    • Reemplazar:
      Insertar CODE, HTML o PHP: 
      <table border="0" cellpadding="0" cellspacing="0" width="50%">
    <tr>
        <td width="3%">
        <img border="0" src="images/misc/OCULTO/1.png"></td>
        <td background="images/misc/OCULTO/3F.png">
        <img border="0" src="images/misc/OCULTO/2.png"></td>
        <td>
        <img border="0" src="images/misc/OCULTO/3.png" width="69" height="37"></td>
    </tr>
    <tr>
        <td background="images/misc/OCULTO/7.png" width="3%" style="background-image: url('images/misc/OCULTO/7.png'); background-repeat: repeat-y; background-position-x: right"></td>
        <td width="100%" style="border-left-style:inset; border-left-width:1px; border-top-style:inset; border-top-width:1px"><div>
<div id="show" style="background-color:#F2F6F8; background-repeat:repeat; margin: 0px;padding: 4px; width:100%">
    <input type="button" value="Ver" style="width:80px;font-size:14px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ocultar'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'ver';}">

<div><div style="display: none">
{param}</div>
    </div>
</div>
   
</div></td>
        <td width="3%" style="background-image: url('images/misc/OCULTO/4.png'); background-repeat: repeat-y; background-position-x: left"></td>
    </tr>
    <tr>
        <td width="3%">
        <img border="0" src="images/misc/OCULTO/6.png"></td>
        <td background="images/misc/OCULTO/8.png">
        &nbsp;</td>
        <td>
        <img border="0" src="images/misc/OCULTO/5.png"></td>
    </tr>
</table>
    • Ejemplo:
      Texto oculto
    • Descripcion: Ocultar texto
    • Usar {option}: NO
    • Imagen del boton: images/misc/OCULTO/SP.png
    • Eliminar Etiqueta Si Está en Blanco: SI
    • Todo el resto: NO
  3. Guardar
Y eso es todo!!, Saludos y ojala alguien lo encuentre util.
 
Te ha quedado impresionante, me encanta. Absolutamente genial 🙂
 
Sin duda haz hecho un buen trabajo, tiene bonito aspecto y cumple su objetivo. 😉
 
excelente! lo vi en un foro y me quedo gustando pero lo habian echo ellos.
Mil gracias!
 
Buenisimo!! Me alegro mucho que les haya gustado!!. Gracias por los comentarios 🙂
 
Esta muy bueno, te agradesco que lo compartieras con nosotros, pero seria bueno que subieras el PSD, para poder editar los colores, ya que no todos tenemos fondo blanco.

Pero fuera de eso, esta exelente!!!!

Muchas gracias.
 
esta bueno, lo usaria pero tengo el v4
 
Muchas gracias, no entiendo por que lo instale y mis estadísticas de promedio de carga a subido, pero en fin! 😉
 
porque no funciona para vbulletin4?
 
Lo has probado¿? El problema está en que vbulletin 4 pone un borde a las tablas. Deberías de cambiar lo siguiente para que no aparezca, aunque no se si haciendo esto se pierde algún borde importante:

Abrir:
clientscript/vbulletin_css/style00001l/main_rollup.css
Hacer clic para expandir...

Editar:

.restore td {
/* Borders and padding to make the table readable. */
border: 1px solid #000;
padding: 0.5em;
}
Hacer clic para expandir...

Dejandolo asi:

.restore td {
/* Borders and padding to make the table readable. */
border: 0; /* 1px solid #000 */
padding: 0; /* 0.5em*/
}
Hacer clic para expandir...

También puedes añadirle un style especifico a la tabla, pero no se si resultaría.
 
Ese archivo al menos no existe en mi foro. Alguien sabe como se podra eliminar los bordes que posee el codigo :S?

 
para que aparezca dicho archivo, tienes que poner en las opciones de vbulletin, que el css se haga en archivos... (no recuerdo en que opción era, pero sale por aquí, para optimizar vbulletin)
 
Aun asi deberia ser posible editarlo mediante el panel de vbulletin :s

PD: Si se cual es la opción que dices 🙂
 
Yo la verdad, que no he conseguido ver como modificar el css desde vbulletin aun teniendo la opción que digo desactivada. Debería de poderse, pero no he conseguido como.
 
Bueno lo modifique el archivo pero aun asi se ve igual. A ti te funciona la modificacion?
 
Si, por eso te la puse. Intente hacer un spoiler parecido a este, peros e me descuadraba a causa de esa linea. Cuando la "arreglé" cuadraba, pero no me funcionaba el javascript, si quereis puedo poner el código aqui del spoiler y tal, pero ya os digo que a mi personalmente no me funcionaba.... Y fijate bien, en modificar el correspondiente eh, porque aparecen 2 carpetas, una acabada en r y otra en l (latin) que es la que debes de modificar, ya que la otra lleva los caracteres de derecha a izquierda. Ya me contarás a ver si te funciona. Si tienes caché (que yo no se si hay en la v4 pero a todos les oigo hablar) borrala...

---------- Actualizado a las 22:56 ---------- Original a las 20:20 ----------

Ir a Estilos y Plantillas -> Buscar dentro de plantillas

Buscar en estilos: el que utilices
Buscar por texto: main_roolup.css
Buscar solo titulos: Si
 
pero siempre los no registrados ven los links compuedo hacer para que no los vean
 
esto sirve para la 4.1.3 gracias
 
Mejor ni mandarlo hacer muchísimas gracias tienes talento para esto...
Saludos
 
Hay que estar conectado o registrado para responder aquí.

Temas similares

P
Mis bbcodes personalizados
Respuestas
5
Visitas
1K
lucasbalbo
L
M
Editar BB code spoiler.
Respuestas
0
Visitas
368
mayer14
M
S
BB Code - spoiler
Respuestas
2
Visitas
697
SKENGMAN
S
Colocar publicidad en mi sitio web sin utilizar widgets
Respuestas
12
Visitas
1K
xdsebaxd
L
BBCODE Spoiler
Respuestas
1
Visitas
654
Lucas Guerrero
L
Menú
Acceder
Registro