Registrado: Jue Feb 22, 2007 10:37 am Posts: 141 Ubicación: Bariloche
Códigos BBCode
En esta entrada resumiremos las técnicas que te permitirán formatear la presentación de tus notas en estos foros de discusión. Para acompañar la lectura, es conveniente que hayas ingresado a los foros, te encuentres en este topic y que presiones el botón , con lo cual colocarás la ventana para teclear un mensaje arriba de este tutorial.
Se puede dar formato al texto con el código BBCode (Bulletin Board Code), el cual es una adaptación del código HTML (Hyper Text Markup Languaje). Por razones de seguridad en phpBB3 ya no se permite que el usuario introduzca código HTML como en la versión anterior (la cual de todas formas era en general desactivada por el administrador). Sin embargo ahora el administrador tiene la posibilidad de crear código BBCode a partir del HTML en forma libre. Esta mejora posibilita la creación de nuevos botones en el encabezamiento del cuerpo del mensaje, tanto de formateo como de audio y video, como verás más adelante.
Los comandos de este lenguaje reciben el nombre de tags. La mayoría de los tags aparecen en parejas según la estructura: un tag de apertura, el texto y un tag de cierre. Ambos tags se colocan entre [ ] y además el de terminación incluye una barra inclinada /. Los tags son insensibles a las mayúsculas (es lo mismo una letra en mayúsculas que una en minúsculas). Si colocas el mouse sobre cualquiera de los botones en el encabezamiento del cuerpo del mensaje puedes ver un ejemplo.
Se colocan con el mouse seleccionando el texto y haciendo clic en el botón correspondiente o haciendo clic en el botón y colocar el texto entre los tags de apertura y cierre. También se pueden colocar con el teclado. Algunos incluyen teclas de acceso rápido (que pueden leerse al colocar el mouse sobre el botón). Si tienen algún parámetro para teclear (por ejemplo valores numéricos de un margen), no incluir ningún espacio. Tener presente que si el código BBCode que colocas es incorrecto, el programa no puede interpretarlo y publicará dicho código en forma literal.
A continuación se describen los códigos de interés. La mayoría de ellos fueron creados por la Administración del foro para comodidad de nuestros usuarios. En el futuro se incorporarán más botones, a medida que sean requeridos.
Para practicar puedes ir tecleando cada uno de estos códigos en la ventana de mensajes (puedes copiar y pegar si lo deseas) y luego controlar con el botón de Vista Preliminar que se encuentra al pie, su efectividad.
A Códigos para formatear texto.
Negrita
Código:
[b]texto[/b]
En el mensaje se verá: texto
Cursiva
Código:
[i]texto[/i]
En el mensaje se verá: texto
Subrayado
Código:
[u]texto[/u]
En el mensaje se verá: texto
Overline
Código:
[overline]{TEXT}[/overline]
En el mensaje se verá:
texto
Tachado
Código:
[strike]TEXTO[/strike]
En el mensaje se verá: TEXT
Tamaño de fuente (máximo: 200)
Código:
[size=150]texto[/size]
En el mensaje se verá: texto
El código se puede colocar más rápidamente sombreando el texto y presionando el tamaño en la caja de selección correspondiente.
Subindice
Código:
[sub]Texto[/sub]
En el mensaje se verá: Texto normalTexto
Superindice
Código:
[super]Texto[/super]
En el mensaje se verá: Texto normalTexto
Tipo de fuente
Código:
[font=tipo de fuente]texto[/font]
En el mensaje se verá (ejemplo para la fuente Magneto): texto
Texto intermitente
Código:
[blink]texto[/blink]
En el mensaje se verá: texto
Puede no funcionar en IE.
Alineación
Código:
[align=center]Texto[/align]
En el mensaje se verá:
Texto
Las opciones del atributo son: right, left, center y justify
Margenleft Elemento rodeado a la derecha
Código:
[margenleft=100,0]TEXTO[/margenleft]
Márgenes izquierdo y derecho: valores en px Es necesario dar los 2 parámetros aunque algún valor sea 0.
En el mensaje se verá:
TEXTO
Texto siguiente Texto siguiente
Opciones: Puede aplicarse a texto o a imágenes
Margen Elemento sin rodear.
Código:
[margen=100,0]TEXTO[/margen]
Márgenes izquierdo y derecho: valores en px Es necesario dar los 2 parámetros aunque algún valor sea 0.
En el mensaje se verá:
TEXTO
Texto siguiente Texto siguiente
Opciones: Puede aplicarse a texto o a imágenes
Color de fuente
Código:
[color=red]texto[/color]
En el mensaje se verá: texto
El código para colorear un texto se coloca sombreando el texto y presionando el color en la caja de selección correspondiente. También puede tipearse con su nombre en inglés ( red, darkred, orange, brown, yellow, green, olive, cyan, blue, darkblue, indigo, violet, white, black, etc) o con el código hexadecimal (#000000 a #FFFFFF) precedido por el signo # . En este código son seis dígitos hexadecimales, lo cual significa que cada uno tiene 16 posibilidades (0 al F). Corresponden al código de colores RGB, (Red–Green–Blue), los dos primeros dan 16*16 = 256 colores de la gama del rojo (00 al FF), los dos siguientes en la gama del verde y los dos últimos en la gama del azul. En total se tendrán 16 a la 6 = 16777216 colores. Así por ejemplo el rojo será FF0000, el verde 00FF00, el azul 0000FF, el negro 000000 y el blanco FFFFFF.
Código:
[color=#0023ef]texto[/color]
En el mensaje se verá: texto
Resaltado de texto
Código:
[highlight=#0000FF]Texto[/highlight]
En el mensaje se verá: Texto
Resaltado de párrafo
Código:
ColorPárrafo=#ffff00]TEXTO[/ColorPárrafo]
En el mensaje se verá:
TEXTO
Marquesina
Código:
[marquee= right]texto[/marquee]
En el mensaje se verá:
Las opciones del atributo son: down, up, right y left
Línea horizontal
Código:
[hr=#ff0000][/hr]
En el mensaje se verá la siguiente línea:
Notas: No se debe colocar nada entre los tags. El color no funciona igual en los distintos exploradores.
Comentario oculto
Código:
[note]TEXTO[/note]
El TEXTO solo aparece en la ventana de edición y no en el mensaje final. Util para hacer comentarios personales al escrito que no se publicarán.
El primer número es la fila y el segundo la columna de cada celda. Si se desean dejar en blanco debe colocarse un espacio en lugar del texto. Para el código de color ver color de fuente.
En el mensaje se verá la imagen conteniendo el hipervínculo Ejemplo: colocar el mouse sobre la imagen.
b) Texto
Código:
[url=www.mipagina.com]texto[/url]
En el mensaje se verá el texto con el hipervínculo Ejemplo: colocar el mouse sobre el texto. texto
Búsqueda en Google o Yahoo
Código:
[google]TEXTO[/google]
Código:
[yahoo]TEXTO[/yahoo]
Con un clic en el texto colocado, se abre otra ventana con la búsqueda en Google o en Yahoo.
F Códigos que insertan un archivo a) Adjunto Se refiere a la posibilidad de que el administrador permita que los usuarios adjunten archivos a sus informes utilizando el panel de Adjuntos que se encuentra debajo del de la escritura del mensaje. Luego de subido el archivo adjunto, se presiona el botón Intercalar con lo cual el archivo se intercala en el texto a partir del punto de inserción. El código que aparece automáticamente tiene la estructura:
El número de cada adjunto es asignado automáticamente por el software. Al último le asigna 0 y así siguiendo. Cuando se envía el mensaje se ve la imagen o el nombre del archivo para abrir o descargar, en lugar del BBCode.
b) Archivo html externo
Código:
[IFrame=Ancho,Alto]URL[/IFrame]
En el mensaje se verá el contenido del archivo html alojado en esa dirección. Se debe dar el ancho y el alto en px. Debe tipearse por ejemplo como: http://www.aprehender.net (con http://)
Ejemplo La página de entrada de este portal.
c) Ventana emergente: Popup Window
Código:
[popup=URL]TEXTO[/popup]
En la ventana emergente se verá el contenido del archivo html alojado en esa dirección. El ancho y el alto están configurados en estos foros en 500px *500px, pero pueden editarse arrastrando el mouse sobre sus bordes o ampliarse a pantalla completa con el botón respectivo de la parte superior derecha de la ventana. Debe tipearse por ejemplo como: http://www.aprehender.net (con http://)
Ejemplo. La página de entrada de este portal. Presionar
Portal
G Códigos que colocan archivos Flash, video o audio
a) Archivo Flash
Código:
[flash=width,height]URL[/flash]
Cualquier URL de un archivo swf, por ejemplo:
Código:
http://www.aprehender.net/Video/RacingSkiers.swf
Los atributos son width=ancho height=alto, ambos en píxeles
El mensaje se verá así. De paso poné a prueba tus conocimientos de mecánica.
Fuente: Flash Animation for Physics, Universidad de Toronto.
b) Google Video
Código:
[googlevideo]numero ID del video[/googlevideo]
La dirección electrónica del navegador debe ser de la forma:
El número ID del video es el número de dígitos después de: docId=(es el valor que cambia de uno a otro video)
En el mensaje se verá como el siguiente ejemplo. Presiona Start para ver un recital de Queen:
c) YouTube
Código:
[youtube]ID[/youtube]
La dirección electrónica del navegador debe ser de la forma:
Código:
http://www.youtube.com/watch?v=4pyjRj3UMRM
El ID es el código después de v= (es el valor que cambia de uno a otro video). En el ejemplo es: 4pyjRj3UMRM
En el mensaje se verá así. Presiona Start para ver un video cuya descripción se encuentra en ésta página
d) DotSub
Código:
[dotsub]ID,Instance[/dotsub]
En la página desde donde bajes el video debes buscar "ID" e "Instance". Estos códigos numéricos se encuentran en la caja de texto "Embed This Film", luego de "film ID" y "film instance" (copiar y pegar en cualquier documento para extraerlo). Para ver los subtítulos en español del siguiente video, presionar Start abajo a la izquierda y luego presionar alguno de los dos botones abajo a la derecha hasta que aparezca Spanish[100%].
En el mensaje se verá así.
e) DivX
Código:
[divx]URL[/divx]
Cualquier URL de un video DivX. Debe comenzar con http:// y finalizar con .divx
En el mensaje se verá por ejemplo así (Anime Ah My Goddess (1:33)).
f) VXV
Código:
[vxv]ID[/vxv]
La dirección electrónica del navegador debe ser de la forma:
El ID es el código desde user (incluido) hasta &AUTOPLAY (excluido), en el ejemplo es la segunda línea completa.
En el mensaje se verá por ejemplo así.
g) MP3
Código:
[MP3]http://url.mp3[/MP3]
Cualquier dirección con archivos de audio: mp3, wav, mid o au
En el mensaje se verá el siguiente control de MP3. Presionar Start para escuchar un famoso tema de Keane, grabado en su recital en BsAs.
Más información sobre los videos se encuentra en los tutoriales del VideoBLog
H Códigos que colocan Javascript
Feeds Google Reader Es un lector de tus favoritos Feeds RSS. Si no conocés su funcionamiento, leer aquí.
Código:
[GR]ID,Titulo,Color[/GR]
El ID es el código numérico de tu cuenta de Google Reader que sigue a user/ El Titulo es el que se desee colocar. El color debe ser uno de los siguientes: black, green, gray, khaki, pink o slate (están en la ayuda del botón)
El mensaje se verá así. Para ver los feeds. presionar Read more...
Este es el final de este tutorial, confiamos en que te será de utilidad y esperamos ansiosos disfrutar de tus futuras notas multimedia.
Para obtener una copia de este tutorial, hacer clic en el botón Imprimir vista en la parte superior.
Usuarios navegando este Foro: No hay usuarios registrados visitando el Foro y 1 invitado
No puedes abrir nuevos topics en este Foro No puedes responder a topics en este Foro No puedes editar tus posts en este Foro No puedes borrar tus posts en este Foro No puedes enviar adjuntos en este Foro
Ingreso
Registrate
FAQ
Buscar
Miembros
, con lo cual colocarás la ventana para teclear un mensaje arriba de este tutorial.
