Efectos gráficos de texto

EFECTOS DE TEXTO E IMÁGENES EN LOS MENSAJES

Hay numerosos efectos gráficos con los que podemos jugar en nuestros mensajes. Afectan al tamaño, al color, a la presentación del texto que escribamos o a las imágenes que mostremos. Algunos de ellos son bastante curiosos.

Además de los que ya conocéis, que nos lo ponen en negrita , en cursiva , en color,
, en grande o en pequeño, los hay más sorprendentes, como el arco iris, el parpadeante (sólo visible en Mozilla Firefox), el que avanza horizontalmente, el que aparece desde abajo, etc.

También hay recursos que nos permiten esconder un contenido a parte de los lectores o bien hasta que se clica sobre la pestaña correspondiente (spoiler), haciendo menos "pesado" el mensaje: Como muestra, haz clic en la siguiente pestaña:

Spoiler:

Recordemos primero, los efectos que se nos facilitan en la barra / panel superior cuando publicamos un mensaje o una respuesta:



Tenemos a la izquierda, los que nos permiten poner el texto que seleccionemos en negrita, en cursiva o subrayado.

Y a la derecha, los comandos que modifican el color, el tamaño y el tipo de fuente, siempre del texto del mensaje que hayamos seleccionado (pasándole por encima el cursor con el botón izdo. del ratón apretado)

Se nos ofrecen también en esa barra otros efectos, como el ya comentado Spoiler (contenido oculto en la pestaña, que se desvela cuando se clica), el oculto (que sólo será visible por los moderadores y por aquellos que hayas posteado en ese tema), el texto que se desplaza horizontalmente o verticalmente, y la respuesta oculta (wow). ¿Cómo se pone esta respuesta oculta [wow]Sigue leyendo [/wow]
Los tenemos disponibles en Otros, a la derecha de la barra del panel de publicación:



Como siempre en estos casos, se selecciona el texto a resaltar, esconder o colorear y se clica en el efecto pertinente.

Esta barra también nos permite centrar el texto, o bien alinearlo a izquierda o derecha; incluso justificarlo. El texto seleccionado se modificará con estas teclas:



Otros recursos de esta barra nos sirven para hacer listas y para insertar líneas entre textos:



Para hacer listas, se clica en el icono de la lista (de puntos o numérica) y se escribe el ítem correspondiente; se clica nuevamente. Se repite este proceso con cada ítem hasta terminar la lista:

• Item 1

• Item 2

Si la lista es numérica, las veces sucesivas se clica en la lista de puntos, aunque lo más probable es que haya que ajustar los códigos manualmente (ver más adelante)

1. Item 1
   
2. Item 2
   
3. Item 3

Para insertar una línea se selecciona el texto sobre el que queramos que aparezca (en el siguiente ejemplo texto B) y se clica en el icono de lnsertar línea:

Texto A

---

Texto B

Como el asunto de imágenes y vídeos se trata en otro tema de Instrucciones, me referiré ahora a los vínculos o enlaces:

Se puede poner sin más una dirección de correo electrónico y clicando sobre ella nos abrirá el programa predeterminado de correo para que rellenemos el mensaje:

info@amazon.fr

Se puede pegar o escribir una dirección de una página, tal cual, y desde el mensaje podremos acceder a ella clicando sobre la propia dirección:
https://cocinamycook.forosactivos.net/normas-e-instrucciones-f1/instrucciones-para-insertar-imagenes-en-los-mensajes-t10.htm

Pero también podemos "esconder" el enlace en un texto o imagen, que queda vinculado a una dirección. Para ello usamos el icono correspondiente del panel:



En el apartado de arriba pegaremos la dirección y en el de abajo el texto o la imagen (en código, como siempre) que queremos usar como referencia:

Instrucciones para imágenes



Podéis comprobar que clicando sobre cualquiera de los tres, se nos abrirá la página.

---

---

---

También lo podríamos hacer por medio de códigos, en general intercalando dicho texto entre los códigos , es decir [código] Texto para ver [/código] . Es más incómodo, pero conviene familiarizarse con los términos para valorar errores, cuando el resultado no es el que esperábamos. En algunos casos es la única vía.

Veamos algunos ejemplos:

• Negrita:

Código:

[b][/b]

• Cursiva

Código:

[i][/i]

• Texto subrayado:

Código:

[u][/u]

• Texto rayado:

Código:

[strike][/strike]

• Texto muy grande, pequeño...

Código:

[size=24]Texto[/size]
[size=9]Texto[/size]


• Texto en color rojo, Texto en color verde, Texto en color violeta

Código:


[color=red] texto [/color]
[color=green] texto [/color]
[color=violet] texto [/color]


También se puede indicar el color por su códico hexadecimal (por ejemplo: #0033FF)

Código:

[color=#xxxxxx][/color]

Si utilizamos el color #EEEEEE. el texto será transparente y sólo será visible al pasar el cursor por encima, con el botón izquierdo apretado.
Ejemplo a continuación: No os recomiendo escribir así. Nadie lo va a ver


• Texto en otras fuentes:

Código:

[font=Impact] texto [/font]
[font=Comic Sans Ms] texto [/font]


• Spoiler (pestaña que desvela contenido cuando se clica sobre ella; al volver a clicar, se vuelve a cerrar)

Spoiler:

Código:

[spoiler] [/spoiler]

Estos códigos se pueden obtener desde los símbolos de la barra superior de publicar un mensaje o una respuesta: Otros -> Spoiler . La primera vez te sale el primer spoiler y la segunda se cierra.

Se puede cambiar la palabra SPOILER por otra o una frase usando el siguiente código:

Código:

[spoiler=TÍTULO DESEADO]CONTENIDO[/spoiler]

Por ejemplo:

Pestaña desplegable:

• Recuadro de resalte:

Prestad especial atención a este recuadro

Código:

 [table style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" borderColor=#9a1922 bgColor=#ffffcc][tr][td][img]URL de imagen izda[/img][/td]
[td] Texto a resaltar
[/td][/tr][/table]


Hay que sustituir URL de la imagen izda y Texto a resaltar


• Contenido oculto (sólo visible por los que hayan posteado en dicho tema y por los moderadores. Cuando es visible queda en un recuadro blanco):

Código:

[hide][/hide]

• Texto con desplazamiento horizontal

Código:

[scroll] [/scroll]

• Texto con desplazamiento vertical:

Código:

[updown] [/updown]

• Respuesta oculta (WOW)

Nos permite ocultar una frase en una interrogación. [wow]Aquí pondremos la respuesta[/wow] Parece que no funciona con Internet Explorer.

Código:

[wow] TEXTO [/wow]

• Alineamiento de texto:

Puede ser izquierdo (lo habitual, por defecto).

Código:

[left]Texto alineado a la izquierda[/left]

[right]Texto alineado a la izquierda[/right]

[center]Texto centrado[/center]

[justify]Texto justificado[/justify]

• Listas

Pueden ser de puntos:

• Item 1

• Item 2

Código:

[list][*] Item 1[/list]  [list][*]Item 2[/list]

O bien pueden ser numéricas:

1. Item 1
2. Item 2
3. Item 3

Código:

[list=1][*] Item 1
[*] Item 2
[*] Item 3[/list]

O en orden alfabético:

1. Item 1
2. Item 2
3. Item 3

Código:

[list=A][*] Item 1
[*] Item 2
[*] Item 3[/list]

•Para insertar una línea entre dos textos

Texto A

---

Texto B

Código:

Texto A [hr]Texto B

•Citado de textos:

Cuando se quiere citar anónimamente un mensaje anterior o una parte de él, el texto y/o imágenes seleccionados apareceran así:

En un lugar de la Mancha, de cuyo nombre...

Código:

[quote] texto [/quote]

Si se quiere citar al autor

Cervantes escribió:En un lugar de la Mancha, de cuyo nombre...

Código:

[quote="autor"] texto [/quote]

Esto es mucho más fácil de hacer usando el botón de citar que aparece en la cabecera de cada mensaje que queramos citar.

•Para hacer un hipervínculo a un texto o imagen:

Instrucciones para imágenes

Código:

[url=DIRECCION A DONDE SE QUIERE DIRIGIR]TEXTO[/url]

Código:

[url=DIRECCION A DONDE SE QUIERE DIRIGIR][img]RUTA DEL ENLACE DE LA IMAGEN[/img][/url]

o lo que es lo mismo:

Código:

[url=DIRECCION A DONDE SE QUIERE DIRIGIR]CODIGO DE LA IMAGEN[/url]

• El texto parpadeante (sólo visible en Mozilla Firefox)

Código:

<blink> texto </blink>

• Para hacer el arco iris hay que ir a: http://www.glitter-graphics.com/generators/rainbow.php

En la primera línea se pone el texto que queremos multicolor. Se genera el código y se copia el último apartado, para pegarlo en nuestro mensaje.



También podremos recurrir a http://www.sindisplay.com/creadores/textos_coloridos/ donde podremos elegir los colores y el tamaño de las letras, aunque ene este caso el código es HTML y para verlo tendrá que estar activado.




Hola ¿qué tal estás?



•Para crear un pequeño gif de imágenes sucesivas :



Recurrimos a: http://picasion.com/

Se seleccionan las imágenes, se elige tamaño y velocidad y se crea la animación.

Se copia el código primero, pegándolo donde el icono de Imagen del panel de Publicación, para que quede así:

Código:

[img]Código copiado[/img]

También se puede usar el segundo código y se pega directamente en el mensaje. Éste tiene el inconveniente de que nos pone un subtítulo y nos hace un vínculo con la página picasion. Podríamos sortear estos inconvenientes e incluso aprovecharnos de la posibilidad de que surja el título de la imagen cuando pasamos por ella el cursor, haciendo las siguientes sustituciones:

Código:

<a href="DIRECCION WEB A VINCULAR" title="NOMBRE DE LA WEB"><img src="http://picasion.com/pic11/accb5b0415f474dabf7235d0540c1cdc.gif" width="300" height="225" border="0" alt="ETIQUETA A OCULTAR" />
<a href="DIRECCION WEB A VINCULAR SUBT">SUBTITULO</a>

O suprimiendo subtitulo:

Código:

<a href="DIRECCION WEB A VINCULAR" title="NOMBRE DE LA WEB"><img src="http://picasion.com/pic11/accb5b0415f474dabf7235d0540c1cdc.gif" width="300" height="225" border="0" alt="ETIQUETA A OCULTAR" />


O en la mínima expresión, sin vínculos:

Código:

          <img src="URL DE LA IMAGEN" width="300" height="225" border="0" alt="ETIQUETA A PONER" />
     

• Para que aparezca el nombre del usuario conectado:

Código:

  {USERNAME}         

Así saldrá, por ejemplo: ¡Hola, Invitado! , me alegro de que estés leyendo esto.



• Efectos múltiples:

Mientras respetes las aperturas y cierres de las balizas, puedes utilizar todas las combinaciones posibles para efectos variados: Por ejemplo Texto con negrita, en verde y tamaño pequeño

Código:

[b][color=green][size=9] Texto [/size][/color][/b]

Daos cuenta que las balizas  se abren [* ] y se cierran [/*] simétricamente