BBCODE Imagen + Texto a la derecha

  • Autor Autor jjuuaannk
  • Fecha de inicio Fecha de inicio
J

jjuuaannk

Épsilon
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
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 😉
 
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
​
 
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
 
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 🙂"
 
bueno le he probado poniendo padding a la imagen y me ha funcionado...
ahy esta la imagen de muestra

saludos
 
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
 
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
 
de casualidad esto no andará para v4.x???
 
Hay que estar conectado o registrado para responder aquí.

Temas similares

I
BBcode Imagen Expando
2
Respuestas
20
Visitas
6K
MasterPlayer
M
N
bbCode imagen
Respuestas
3
Visitas
863
imported_Elmer
I
Menú
Acceder
Registro