BBCODE Imagen + Texto a la derecha

jjuuaannk

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
26 Sep 2007
Mensajes
953
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Bueno amigos, aqui le explicare como tener un bbcode que podamos insertar una imagen con un texto a la derecha....

Primer paso: Ir A Admincp -> Códigos BB -> Agregar Nuevo Código BB

Tendremos una pantalla como esta:

Enlace eliminado


Titulo de nuestro BBCODE: Imagen+Texto

Nombre de la Etiqueta: IMGT

Remplazar:
HTML:
<!-- VBHispano.com -->
<TABLE border=0 cellSpacing=0 cellPadding=0><tr><td>
<img  src="{option}" border="0"> </td><td style="padding: 10px">{param}</td></tr></table>
<!--/  VBHispano.com -->
Ejemplo: [IMGT] texto [/IMGT]

Descripción: Inserta una imagen a la derecha de un texto

Usar {option}: Lo Elijemos a SI

Imagen de Botón (Opcional): ./images/editor/imgt.png

Y Guardamos...



Nos debería de quedar de esta manera:

Enlace eliminado



Subimos esta imagen Enlace eliminado por FTP al directorio /images/editor/ para identificar nuestro bbcode

y nos vamos hacer nuestro tema de prueba...


Insertamos nuestro texto:

Ejemplo:
Seleccionamos el Texto y damos click a nuestro nuevo icono...


Al dar click sobre nuestro nuevo icono Enlace eliminado nos pedira nuestra opcion, alli insertaremos la ruta de la imagen...

Ejemplo de Imagen:
http://files.vbulletin.com/images/cart/vbhero.png



y nos quedara así:

Y el Resultado seria:

Enlace eliminado

y Listo Tenemos nuestro nuevo BBCODE para insertar imágenes con texto a la derecha...



Si desea que el texto rodee toda la imagen si dejar espacio debajo de ella,

en remplazar pongan lo siguiente:

HTML:
<!-- VBHispano.com -->
<img  src="{option}" style="float:left; padding: 10px 10px;"  border="0">{param}
<!--/  VBHispano.com -->
Siendo el Resultado:

Enlace eliminado


Un Saludo
 

imported_Jhonnyf

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
6 Sep 2008
Mensajes
959
Tu idea es buena, pero cuando haya mucho texto o la imagen sea muy grande vas a tener el siguiente detalle



A mi parecer el texto deberia rodear a la imagen, pero es solo cuestion de gustos

Saludos
 

jjuuaannk

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
26 Sep 2007
Mensajes
953
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Para que el texto rodee la imagen y no se haga como nos explica el amigo Enlace eliminado

en remplazar pongan lo siguiente:

HTML:
<!-- VBHispano.com -->
<img  src="{option}" style="float:left; padding: 10px 10px;"  border="0">{param}
<!--/  VBHispano.com -->
Siendo el Resultado:

Enlace eliminado

Saludos
 

imported_Jhonnyf

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
6 Sep 2008
Mensajes
959
Ahora tienes otro detalle, el texto esta muy pegado a la imagen y no se ve bien, y las img no aceptan padding asi que metelo mejor en un DIV

PHP:
<div style="padding: 1px 15px 5px 1px; display: block; ">
{option}
</div>
{param}

he hecho un BBCODE para poner Adsense al igual que tu lo haces con una imagen, pero lastimosamente no puedo poner el enlace... lo cual es medio extraño ya que los foros son de tematica diferente. (Soporte Básico vBulletin y Soporte Avanzado vBulletin)

"Cosas del Orinoco, que yo no sé ni tu tampoco "
 

jjuuaannk

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
26 Sep 2007
Mensajes
953
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
bueno le he probado poniendo padding a la imagen y me ha funcionado...
ahy esta la imagen de muestra

saludos
 

imported_Jhonnyf

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
6 Sep 2008
Mensajes
959
A mira, si aceptaba padding, y acabo de testear tu ¿? codigo mejorado

Algo nuevo se aprende cada dia, solo que no sé quien aprendió de quien el dia de hoy XD
 

FIREWOLF

Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
7 May 2009
Mensajes
16
yo, de los 2
muchas gracias amigos

es con el ejemplo nº 1, sin rodear la imagen
la 1º imagen, es bbcode texto más imagen, y la 2º es imagen + imagen, es decir, usando el mismo bbcode, pero en vez de señalar texto, he señalado el grupo de imagenes pequeña y le he puesto de referencia la grande, bien, no?



perdon por el doble post
 

tetsu

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
9 Feb 2010
Mensajes
384
de casualidad esto no andará para v4.x???