Author Topic: Tutorial: Enriquecer un post. Los botones del menú  (Read 2722 times)

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Tutorial: Enriquecer un post. Los botones del menú
« on: June 10, 2010, 00:28:16 AM »
ENRIQUECER UN POST:
LOS BOTONES DEL MENÚ

Los botones que nos aparecen a la hora de escribir un post, son etiquetas que nos permiten modificar el texto y enriquecer nuestros mensajes. Así será más expresivo y entretenido leerlo.

Con este tutorial, trataremos uno a uno estos botones. Ya no tendreis excusa para no utilizarlos   :guino: :




Formato y apariencia de texto

Los podéis utilizar para cambiar la fuente del texto, el tamaño y el color.





Efectos de texto

Los podéis utilizar para poner el texto en negrita, cursiva, subrayado o tachado.





Estos otros botones sirven (en orden de aparición) para: resaltar el texto, dar sombra al texto, poner un texto con deslizamento lateral (se mueve), superíndice, subíndice, y dar formato de máquina de escribir al texto.



Alineación de texto

Los podéis utilizar para justificar el texto, centrarlo, que esté alineado a la derecha o a la izquierda.





Opciones de recursos en el mensaje

En el orden que aparecen en la imagen, los botones sirven para: incrustar vídeos de You Tube, insertar un campo de Spoiler, instertar una imagen a partir de su dirección URL, insertar un enlace, instertar un correo electrónico (con mailto:) y compartir una dirección ftp.





Tratamiento de tablas, código y citas



En orden de aparición, estos botones permiten la inserción y edición de tablas, código (html, por ejemplo) y la inserción de referencias o citas (textos ajenos, comentarios de otros usuarios, etc.).



Tratamiento de listados y línea horizontal



Te permiten añadir listados con puntos (bullet points) o listados numerados. El tercer botón añade una línea horizontal, a modo de separación.



Otros botones



El primer botón quita el formato del texto seleccionado (lo resetea al formato predeterminado). El segundo botón cambia la vista del editor de mensajes y te permite previsualizar el formato del texto mientras escribes el mensaje (ver las negritas, listados, etc.), en lugar de tener que clicar el botón de "previsualizar mensaje".



A continuación hay ejemplos detallados de cada uno de los casos.



ESPERAMOS HABERTE AYUDADO
« Last Edit: February 04, 2017, 12:30:27 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #1 on: June 10, 2010, 00:28:59 AM »
Convierte el texto en negrita
Esto es un ejemplo


Convierte el texto en cursiva
Esto es un ejemplo


Subraya el texto
Esto es un ejemplo


Tacha el texto
Esto es un ejemplo
« Last Edit: February 04, 2017, 12:33:08 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #2 on: June 10, 2010, 00:29:18 AM »
Crea texto con un borde de color
Los tres atributos (red, 2, 50) en la etiqueta 'glow' son el color, intensidad y anchura respectivamente.

Esto es un ejemplo


Crea texto con sombra
Los dos atributos (red, left) en la etiqueta 'shadow' son el color y la dirección respectivamente.

Esto es un ejemplo


Crea texto en movimiento
No produce XHTML validado, pero también puede usarse con imágenes
Esto es un ejemplo
« Last Edit: February 04, 2017, 12:33:39 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #3 on: June 10, 2010, 00:29:40 AM »
Convierte a texto preformateado
(permite visualizar el texto tal y como se encuentre colocado entre las etiquetas)
Esto es un ejemplo


Alinea el texto a la izquierda. Asignado por defecto
Esto es un ejemplo


Alinea el texto al centro
Esto es un ejemplo


Aliena el texto a la derecha
Esto es un ejemplo
« Last Edit: February 04, 2017, 12:34:42 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #4 on: June 10, 2010, 00:30:19 AM »
Inserta una línea


Estas líneas, son dos ejemplos

« Last Edit: February 04, 2017, 12:35:04 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #5 on: June 10, 2010, 00:30:34 AM »
Modifica el tamaño del texto

tamaño = 8 pt
Esto es un ejemplo
tamaño= 14 pt
Esto es un ejemplo


Cambia la fuente del texto
Esto es un ejemplo

Hay fuentes que están incluidas en los ordenadores de forma universal (salvo excepciones).
Así todos podremos distinguirlas. Estas son:

Verdana, Times New Roman, Comic Sans MS, Arial, Courier New, Tahoma, Century, Autumn,
Lucida Console, Rockwell, Scibble, Trebuchet


Convierte el texto en fuente teletipo
Esto es un ejemplo


Convierte el texto en superíndice
Esto es un ejemplo


Convierte el texto en subíndice
Esto es un ejemplo
« Last Edit: February 04, 2017, 12:36:05 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #6 on: June 10, 2010, 00:47:40 AM »
Inserta un vídeo de YouTube

El botón del menú forma parte de una aplicación que nos permite visualizar este tipo de vídeos desde el mismo foro.
Para visualizarlo solo tienes que poner el enlace del vídeo (sin la s de https://), seleccionarlo, clicar el botón "YouTube" y una vez guardéis el post aparecerá como por arte de magia!

Por ejemplo, este vídeo de Javi en Boston 2016...

Este es el enlace: https://www.youtube.com/watch?v=7nrbg87qH9k, se quita la s: http://www.youtube.com/watch?v=7nrbg87qH9k, y con este enlace se utiliza el botón YouTube y voilá!

<a href="http://www.youtube.com/watch?v=7nrbg87qH9k" target="_blank">http://www.youtube.com/watch?v=7nrbg87qH9k</a>
« Last Edit: February 04, 2017, 12:41:17 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #7 on: June 10, 2010, 00:52:37 AM »
Oculta el texto que se incluye en su interior

MUY IMPORTANTE: Es estrictamente necesario utilizarla para cualquier spoiler durante las competiciones

Spoiler for Hiden:
Esto es un ejemplo
« Last Edit: February 04, 2017, 12:42:12 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #8 on: June 10, 2010, 00:53:00 AM »
Inserta una imagen
Para ello, lo que indicamos entre las etiquetas es la dirección o URL de la imagen

 
Si no sabes como localizar la URL de una imagen en la Web, consulta aquí:

http://patinajeartistico.es/foro/index.php?topic=455.0

Es posible modificar el tamaño de las imágenes que mostramos,
aunque lo conveniente es hacer más pequeña una imagen grande, ya que en el caso inverso se pierde calidad y queda algo borrosa.
Se utilizarán los comandos width (anchura) y height (altura), siempre deben aparecer los dos.


Por ejemplo: [ img width=300 height=37 ] URL IMAGEN [ / img ]



« Last Edit: February 04, 2017, 12:44:08 PM by Nat »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #9 on: June 10, 2010, 00:53:26 AM »


Crea como enlace el texto que hay incluido en su interior

http://www.patinajeartistico.es/


Puedes insertar el nombre de la web o su descripción entre las etiquetas
{url=enlace web}{/url}


Foro Patinaje Artístico Ariquitaun


También es muy útil una alternativa a este botón: insertar el enlace a una imagen.
Para ello debemos incluir la web a la que se dirija dentro de las etiquetas de imagen:
{url=enlace web}{/url}








Inserta un enlace directo para enviar un correo eléctrónico al destinatario especificado
{url=email@ariquitaun.es}email{/url}


Esto es un ejemplo




Inserta un enlace FTP
(File Transfer Protocol - Protocolo de transferencia de archivos)
Ideal para transferir grandes bloques de datos por la red
Permite enviar o recibir cualquier tipo de archivos hacia o desde un servidor.


ftp://estoesun/ejemplo


« Last Edit: March 02, 2013, 10:43:11 AM by maribelle »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #10 on: June 10, 2010, 00:53:52 AM »



Inserta una tabla


No hay resultados para la etiqueta 'tabla' por sí sola


Ten en cuenta el correcto anidamiento de las etiquetas, de tal modo que la etiqueta 'table' contenga las etiquetas 'tr' y que cada una contiene un número idéntico de etiquetas 'td'

Para que aparezca una tabla deben aparecer los tres códigos, es decir, una tabla de una celda (1 fila, 1 columna) como mínimo.
El orden es muy importante



{table}{tr}{td}esto es un ejemplo{/td}{/tr}{/table}
esto es un ejemplo


{table}{tr}{td}esto es un ejemplo{/td}{td}**{/td}{td}de 1 fila y 3 columnas{/td}{/tr}{/table}

esto es un ejemplo**de 1 fila y 3 columnas


{table}{tr}{td}esto es un ejemplo{/td}{/tr}{tr}{td}**{/td}{/tr}{tr}{td}de 3 filas y 1 columna{/td}{/tr}{/table}
esto es un ejemplo
**
de 3 filas y 1 columna


« Last Edit: March 02, 2013, 10:33:16 AM by maribelle »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #11 on: June 10, 2010, 00:54:11 AM »

Conserva el formato código y evita que el texto se procese como BBC o smileys a la hora de publicar

Code: [Select]
<?php phpinfo(); ?>



Cita el texto que hay en su interior

Quote
Esto es un ejemplo


Una opción a esta etiqueta es el atributo opcional 'author'


{quote author=Ariquitaun}Esto es un ejemplo{/quote}
Quote from: Ariquitaun
Esto es un ejemplo

« Last Edit: March 01, 2013, 20:40:50 PM by maribelle »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!  

adlagisa

  • PRESIDENTA Y GRAN CREADORA DEL ARIQUITAUN VILLAGE ARS MUSEUM
  • Obseso del patineo en estado absoluto
  • ******
  • Posts: 1255
  • Karma: 45
  • Gender: Female
  • PECHALATA FAN Nº1 ¡Canelízate!
  • Awards Premio Ariquitaun a la reina de la canela 2011
    • Design on Ice
Re: Tutorial: Enriquecer un post. Los botones del menú
« Reply #12 on: June 10, 2010, 00:54:28 AM »


Crea una lista para enumerar

  • esto
  • es
  • un
  • ejemplo

También puedes añadir tantos elementos como quieras, cada elemento debe estar insertado en las etiquetas correctas de apertura y cierre
Tienes varias opciones


  • circle
  • circle
  • [0]circle
  • disc
  • disc
  • square
  • square
  • square
                 



Crea una lista ya numerada
« Last Edit: March 02, 2013, 10:43:56 AM by maribelle »


firmas, iconos, fotografías, gifs, wallpapers... y mucho más en...
 D e s i g n   O n   I c e
  ¡Y no te quedes con las ganas!