Tutorial: BBCode

1. Qué son los códigos BBCode?

Son codigos que van entre corchetes ( [ ] ), que cumplen bastantes funciones, por ejemplo, para reducir o aumentar el tamaño de letra, ponerla en negrita, ponerle color, poner un link...


2. Cómo debo escribir el BBCode?

Para que cualquier código sea correcto, tenemos que seguir estas instrucciones:
Colocar los dos corchetes ( [ ] ), en el primero ponemos lo que queramos modificar, por ejemplo, el color. En el espacio que hay entre los dos corchetes, colocamos el texto o palabra que vayamos a colorear. En el segundo corchete, colocamos una barra, y la palabra de la modificación, en este caso, color. Así que nos quedaría algo así:

[color(el color que quieras)](el texto o palabra que quieras colorear)[/color]


Ahora, algunos BBCode básicos para comenzar

Para el Color

Sirve para poner un texto en el color que deseen

[color(el color que elijas)](Texto o palabra para colorear)[/color]

Y nos quedaría algo como esto:

Das Glock


Lista de colores

Rojo Oscuro:

Código:

[color=darkred](Texto)[/color]

Rojo:

Código:

[color=red](Texto)[/color]

Naranja:

Código:

[color=orange](Texto)[/color]

Marron:

Código:

[color=brown](Texto)[/color]

Amarillo:

Código:

[color=yellow](Texto)[/color]

Verde:

Código:

[color=green](Texto)[/color]

Oliva:

Código:

[color=olive](Texto)[/color]

Cyan:

Código:

[color=cyan](Texto)[/color]

Azul:

Código:

[color=blue](Texto)[/color]

Azul Oscuro:

Código:

[color=darkblue](Texto)[/color]

Indigo:

Código:

[color=indigo](Texto)[/color]

Violeta:

Código:

[color=violet](Texto)[/color]

Blanco:

Código:

[color=white](Texto)[/color]

Negro:

Código:

[color=black](Texto)[/color]

Para el Tamaño

ya sabran para que se utiliza, pero para el que no, simplemente sirve para agrandar el tamaño de la letra

[size=(pongan el tamaño que les parezca, pero no se pasen de 24)](Texto o palabra que modificamos)[/size]

Y nos quedaria algo como esto:

Das Glock


Lista de tamaños

Miniatura:

Código:

[size=7](Texto)[/size]

Pequeña:

Código:

[size=9](Texto)[/size]

Normal:

Código:

[size=12](Texto)[/size]

Grande:

Código:

[size=18](Texto)[/size]

Enorme:

Código:

[size=24](Texto)[/size]

Para Negrita, Cursiva y Subrayado

Negrita:

Código:

[b](Texto)[/b]

Cursiva:

Código:

[i](Texto)[/i]

Subrayado:

Código:

[u](Texto)[/u]

Para Hipervinculos (URL)

Un Link es una porción de texto que aparece subrayada y de color diferente, y que al pinchar sobre ella, da acceso a otra dirección, bien sea ir a otra página, a otra parte de la actual, a ver una imagen, a descargar un video, etc. En este caso el codigo sera [URL]. Existen 2 formas de realizarlo


Modo 1 (metodo normal)

Código:

[url]www.direccionfalsa.com[/url]

Queda de esta manera

www.direccionfalsa.com


Modo 2 (utilizando texto)

Código:

[url=www.direccionfalsa.com]Clickea aca[/url]

Queda de esta manera

Clickea aca



Incluir Imagenes

si queremos poner una foto o una imagen, primero debemos subir la imagen a un servidor (leer el tuto de como subir imagenes) para despues usarlo aqui, en algunos foros se puede adjuntar la imagen tomando el ancho de banda del mismo foro (no se los recomiendo, xq si el foro se queda sin ancho de banda, cagaron sus imagenes, los posteos y etc etc). El codigo a utilizar es [IMG], pongamos un ejemplo:

Código:

[Img](link de la imagen, ejemplo: http://rapidpik.com/photos/small/76466-y8qyw.jpg)[/img]

dando como resultado lo siguiente





Listas

como el titulo lo indica, sirve para armar/generar listas, existen 2 formas de realizarlos

Listas sin indice: Los elementos apareceran en el mismo orden en que se escriban, colocadas verticalmente y con una pequeña viñeta a la izquierda, los elementos se separan con asteriscos entre corchetes. el codigo es [ List ], el ejemplo a continuacion

Código:

[list][*]Marten[*]Das[*]Bryn[/list]

dando como resultado, esto

• Marten
• Das
• Bryn

Listas con indice: Sirve para crear una lista a la que automaticamente se le incluye un indice, numerico o alfabetico. siendo [List=] el codigo que se utiliza, donde podemos optar por [List=a] si la lista es alfabetica o [List=1] si la lista es numerica. Los elementos se separan con asteriscos entre corchetes. Los ejemplos a continuacion

Alfabetica

Código:

[list=a][*]Marten[*]Das[*]Bryn[/list]

quedando asi

1. Marten
2. Das
3. Bryn

Numerica

Código:

[list=1][*]Marten[*]Das[*]Bryn[/list]

quedando asi

1. Marten
2. Das
3. Bryn

Emoticones

Ya todos sabran lo que es, pero para el que no lo tenga presente o no lo recuerda, los emoticones son animaciones que representan o expresan sensaciones, en este caso, la codificacion para cada uno se remite a como lo tenga modificado el foro en si, por eso lo mas facil es usar los botones (clickear) e ingresarlos directamente.

Ejemplos

:x :oops:



bueno, con esto llegamos al final de este tuto, espero que les sea de ayuda, si tienen cualquier tipo de duda, pueden consultar sin problemas que una mano amiga siempre hay