Noticias
Mapa del sitio
Índice del Mapa del sitio
RSS Feed
Lo primero a tener en cuenta es que prácticamente todos los BBcodes pueden ser usados al mismo tiempo, teniendo siempre en cuenta que para que no creen conflicto cerrar el BBcode en orden inverso al que lo has abierto.
Ejemplo:
- Código: Seleccionar todo
[b][i][u]ahora fijaros el orden de cierre[/u][/i][/b]
Si os fijáis, el primer BBcode que he abierto es el de negrita (b), que es el último en cerrar; el segundo en abrir ha sido cursiva (i), que es el penúltimo en cerrar......
Todos los BBcodes, los tenéis accesibles en la botonera de creación de mensaje, aún así no viene mal saber hacerlos "a mano".
A continuación, paso a detallar el funcionamiento de las etiquetas que tenemos implantadas en el foro.
- Como mostrar un codigo.
Esto sirve para mostrar los codigos que ponemos en el foro. Se usa por ejemplo para lo que voy a hacer yo, enseñaros a usar los codigos.- Código: Seleccionar todo
[code][/code]
- Como poner negrita
Es bien facil, el codigo es:- Código: Seleccionar todo
[b]tu texto[/b]
esto es negrita - Como poner cursiva
Es el siguiente codigo:- Código: Seleccionar todo
[i]tu texto[/i]
esto es cursiva - Como subrayar
- Código: Seleccionar todo
[u]tu texto[/u]
esto es subrayado - Como tachar un texto
- Código: Seleccionar todo
[s]tu texto[/s]
esto es tachado - Como citar un texto
Esto se usa para citar textos de otras personas, normalmente se usa en un mismo tema, dandole al botón "citar" pero en caso que quieras citar algo que no puedas hacerlo de esa manera se utiliza este codigo:- Código: Seleccionar todo
[quote]tu texto[/quote]
Esto quedaria así.esto es una cita de un texto
Puedes añadirle quien hizo ese comentario, fecha.... Seria de esta manera:- Código: Seleccionar todo
[quote="cita de Enock el 14/09/2008"]tu texto[/quote]
y quedaria así:cita de Enock el 14/09/2008 escribió:puedes poner hasta la hora
no os olvideis de las comillas. - Como hacer una lista
Hay varias formas de hacerlas, numeradas, con letras o normales. Lo primero es dar la orden de hacer la lista:
- Código: Seleccionar todo
[list][*]un texto [*]otro texto [*]otro texto[/list]
Esta seria para hacerla normal se veria así:
- un texto
- otro texto
- otro texto
Fijaros que en cada linea hay que meter
- Código: Seleccionar todo
[*]
Luego teneis la opción de numerarlas y seria así:
- Código: Seleccionar todo
[list=1][*]texto [*]mas texto...[/list]
Quedando así:
- texto
- otro texto
Y por último tenemos la opción de nombrarlas con letras:
- Código: Seleccionar todo
[list=a][*]texto[*]mas texto...[/list]
Asi se ve:
- texto
- más texto
Tenemos la posibilidad de combinar todas juntas o un par.
- Código: Seleccionar todo
[list][*]Torneos[list=1][*]Torneos OLW [list=a][*]Mario Kart[*]We Lovwe Golf[/list][/list][/list]
- Torneos
- Torneos OLW
- Mario Kart
- We Love Golf
- Torneos OLW
- Como insetar una imagen
Lo primero, debemos de saber la url de la imagen en cuestión o subirla a algún sitio de hospedaje gratuito.- Código: Seleccionar todo
[img]url de la imagen[/img]
haciendolo se veria la imagen:
- Para crear un vinculo o link
Sirve para hipervincular lo que queramos con el siguiente codigo:- Código: Seleccionar todo
[url=direccion]texto que queramos[/url]
quedaria así:
Pincha para ir al indice del foro
También podemos hipervincular una imagen de esta forma:- Código: Seleccionar todo
[url=dirección a vincular][img]imagen que mostrar[/img][/url]
quedando asi: - Como ocultar texto, imagenes....
- Código: Seleccionar todo
[spoiler]texto a ocultar[/spoiler]
probadloSpoiler:
con imagenes:- Código: Seleccionar todo
[spoiler]url de la imagen[/spoiler]
Spoiler:
este es el código usado:- Código: Seleccionar todo
[spoiler][img]http://www.onlinewii.es/foro/download/file.php?avatar=3.jpg[/img][/spoiler]
y así con todo lo que quieras. - Poner un video de youtube
- Código: Seleccionar todo
[youtube]dirección del video[/youtube]
si cogeis la url de un video embedido, en vez de ser así:- Código: Seleccionar todo
http://www.youtube.com/watch?v=VmhpGH_w2xg
- Código: Seleccionar todo
http://www.youtube.com/watch?v=VmhpGH_w2xg&feature=player_embedded
De esa forma no es válida, para que valga solo teneis que borrarle lo siguiente:- Código: Seleccionar todo
&feature=player_embedded
- Poner color al texto
Es bien sencillo:- Código: Seleccionar todo
[color=color que queramos]texto[/color]
podemos poner tanto el nombre en inglés (red, blue, orange...) como el color en hexadecimal (#FF0000)
este color es raro? - Como hacer más grande o pequeño el texto
Pues tan sencillo como esto:- Código: Seleccionar todo
[size=tamaño en porcentaje]texto[/size]
ENORME
GRANDE
PEQUEÑO
el codigo que he puesto es el siguiente:- Código: Seleccionar todo
[size=300]ENORME[/size][size=167]GRANDE[/size] y [size=50]PEQUEÑO[/size]
Saber que todo esto se puede mezclar en un texto:
de la forma que queramoscomo queramos
el codigo que he usado es este:- Código: Seleccionar todo
[color=red][b][i][u][size=150]de la forma que queramos[/size][/u][/color][color=blue][size=67]como queramos[/size][/color][/b][/i]
- Linea horizontal simple
- Código: Seleccionar todo
[hr][/hr]
- Linea horizontal en color y grosor seleccionable
- Código: Seleccionar todo
[hrc=color en CSS o HEX]grosor en número[/hrc]
Código usado:- Código: Seleccionar todo
[hrc=red]5[/hrc][hrc=#00bdaa]3[/hrc]
- Marquesina con contenido en movimiento
Bien, con este código hacemos una especie de marco invisible en donde el contenido se desplaza hacia el punto que tu selecciones (solo izquierda, derecha, arriba o abajo)- Código: Seleccionar todo
[marquee=dirección en inglés]tu contenido[/marquee]
codigo usado:- Código: Seleccionar todo
[marquee=down][img]http://img33.imageshack.us/img33/8973/forotutorialesolw.png[/img]
y la imagen
va para abajo
este texto[/marquee]
sencillo, y si en vez de "down" le marcas "right":
si poneis el cursor encima, el contenido se detiene. - Marcar texto (estilo fluorescente)
- Código: Seleccionar todo
[highlight=#FFFFAA]tu texto[/highlight]
este texto es importante!! - Alinear imagen a un lado con texto al otro
- Código: Seleccionar todo
[img2=left o right]url de la imagen[/img2]
Como podéis ver, aquí sale mi avatar a la izquierda y el texto alineado a la derecha.
El texto seguirá aquí hasta que pase la imagen.
En cuanto pase la imagen el texto seguirá con normalidad.
La imagen puede ser de cualquier tamaño, hasta el máximo permitido en el foro.
Recomendado para una buena presentación del post.
Código usado:- Código: Seleccionar todo
[img2=left]http://www.onlinewii.es/foro/download/file.php?avatar=3.jpg[/img2]Como podéis ver, aquí sale mi avatar a la izquierda y el texto alineado a la derecha. El texto seguirá aquí hasta que pase la imagen.
En cuanto pase la imagen el texto seguirá con normalidad.
La imagen puede ser de cualquier tamaño, hasta el máximo permitido en el foro.
Para alinear la imagen a la derecha, simplemente cambia el "left" por "right" - Resaltar edición del post
Este viene perfecto para resaltar la nueva información que has añadido al editar un post.- Código: Seleccionar todo
[edit]aquí tu texto[/edit]
Edito: de esta manera resaltamos el texto que hemos incluido al editar nuestro mensaje
Código usado:- Código: Seleccionar todo
[edit]de esta manera resaltamos el texto que hemos incluido al editar nuestro mensaje[/edit]
- Crear una tabla
Con BBcode, podemos crear una tabla de las filas y columnas que queramos. Para ello lo mejor es utilizar el siguiente código, añadiendo lo que te haga falta:- Código: Seleccionar todo
[corners=forumbg forumbg-table][table=tablebg table1][thead][tr=][th=2]esto es la cabecera[/th][/tr][/thead][tbody][tr=bg1][td=1,]esto es la celda izquierda[/td][td=1,]esto es la celda derecha[/td][/tr][tr=bg2][td=1,]esta es otra fila[/td][td=1,]estaes la segunda celda[/td][/tr][/tbody][/table][/corners]
Se ve así:esto es la cabeceraesto es la celda izquierda esto es la celda derecha esta es otra fila esta es la segunda celda
A este código le podéis añadir tanta filas y columnas como queráis. Solo debéis de entender la nomenclatura del código.- Código: Seleccionar todo
[th=][/th]
esta etiqueta solo se usa en la cabecera y el número que se pone después del igual, ha de ser el número de columnas que tenga en total la tabla. Como esta de ejemplo tiene 2 columnas, después del igual, se ha puesto un 2.- Código: Seleccionar todo
[tr=][/tr]
esta etiqueta es para crear una fila. Como podéis ver en el ejemplo, después del igual, en una tenemos puesto "bg1" y en otra "bg2". Esto se pone alternándolo, para darle un tono de color al fondo de la linea, para distinguirlas.- Código: Seleccionar todo
[td=1,][/td]
esta etiqueta sirve para añadir una columna a la fila. Debe ir entre la etiqueta "tr".
Para añadir a la tabla de ejemplo una nueva fila, después de del cierre de la última etiqueta "tr" [ /tr] tienes que añadir otra etiqueta "tr".
Para añadir a la tabla de ejemplo una columna nueva (mejor añadirla a todas las filas), dentro de cada etiqueta "tr", ha de añadirse una nueva "td", detrás del cierre de la última etiqueta [ /td], dentro de cada "tr".
Ejemplo:Titulo de la tablafila 1 columna A fila 1 columna B fila 1 columna C fila 1 columna D fila 2 columna A fila 2 columna B fila 2 columna C fila 2 columna D fila 3 columna A fila 3 columna B fila 3 columna C fila 3 columna D fila 4 columna A fila 4 columna B fila 4 columna C fila 4 columna D - Código: Seleccionar todo
[corners=forumbg forumbg-table][table=tablebg table1][tr=][th=4][align=center]Titulo de la tabla[/align][/th][/tr][tbody][tr=bg1][td=1,]fila 1 columna A[/td][td=1,]fila 1 columna B[/td][td=1,]fila 1 columna C[/td][td=1,]fila 1 columna D[/td][/tr][tr=bg2][td=1,]fila 2 columna A[/td][td=1,]fila 2 columna B[/td][td=1,]fila 2 columna C[/td][td=1,]fila 2 columna D[/td][/tr][tr=bg1][td=1,]fila 3 columna A[/td][td=1,]fila 3 columna B[/td][td=1,]fila 3 columna C[/td][td=1,]fila 3 columna D[/td][/tr][tr=bg2][td=1,]fila 4 columna A[/td][td=1,]fila 4 columna B[/td][td=1,]fila 4 columna C[/td][td=1,]fila 4 columna D[/td][/tr][/tbody][/table][/corners]
Ejemplo añadiendo encabezados a cada columna:
Aquí añado unos encabezados a las columna, para especificar, por ejemplo, para que es cada columna (nombre, puesto, código....)Titulo de la tablaTítulo columna A Título columna B Título columna C Título columna D fila 1 columna A fila 1 columna B fila 1 columna C fila 1 columna D fila 2 columna A fila 2 columna B fila 2 columna C fila 2 columna D fila 3 columna A fila 3 columna B fila 3 columna C fila 3 columna D fila 4 columna A fila 4 columna B fila 4 columna C fila 4 columna D - Código: Seleccionar todo
[corners=forumbg forumbg-table][table=tablebg table1][tr=][th=4][align=center][color=#BF0000][size=150]Titulo de la tabla[/size][/color][/align][/th][/tr][tbody][tr=bg4][td=1,][color=#FFFFFF]Título columna A[/color][/td][td=1,][color=#FFFFFF]Título columna B[/color][/td][td=1,][color=#FFFFFF]Título columna C[/color][/td][td=1,][color=#FFFFFF]Título columna D[/color][/td][/tr][tr=bg1][td=1,]fila 1 columna A[/td][td=1,]fila 1 columna B[/td][td=1,]fila 1 columna C[/td][td=1,]fila 1 columna D[/td][/tr][tr=bg2][td=1,]fila 2 columna A[/td][td=1,]fila 2 columna B[/td][td=1,]fila 2 columna C[/td][td=1,]fila 2 columna D[/td][/tr][tr=bg1][td=1,]fila 3 columna A[/td][td=1,]fila 3 columna B[/td][td=1,]fila 3 columna C[/td][td=1,]fila 3 columna D[/td][/tr][tr=bg2][td=1,]fila 4 columna A[/td][td=1,]fila 4 columna B[/td][td=1,]fila 4 columna C[/td][td=1,]fila 4 columna D[/td][/tr][/tbody][/table][/corners]
Bueno, hasta aqui el tutorial de etiquetas BBcode, en cuanto implementemos más lo añadiré.
Un saludo
