¿Nuevo en la Wiki? Descubre como hacer Tu Firma Decente

Paso 1: Cosas Necesarias

Primero que nada, no necesitas saber nada de como funciona el HTML! Una Firma básica es fácil de hacer incluso para los que ni siquiera saben que es el HTML!

En primer lugar, necesitas un lugar donde puedas empezar a crear tu firma. Crea una página que se llame Usuario:TUNOMBRE/Firma. Este lugar será tu lienzo donde tú la crearás. Si quieres ver como luce haz clic en Previsualizar.

Esta es tu Base:

<span style="Propiedad1:variable; Propiedad2:variable; Propiedad3:variable;...">TEXTO</span>

¡¿Que significa esto?!

<span> Es uno de los elementos del HTML, que comienza el código de nuestra firma, y es el elemento que marca el final de la firma.

"style" es un atributo de tu firma.

Propiedades son tipos de letras, color de letras, bordes, fondos y todas las cosas

Recordatorio: Todas las propiedas tienen que poseer un nombre en inglés, ve bajando por este tutorial para que entiendas como.

Paso 2: Propiedades!

Font Face

Primero que nada debes elegir tu fuente favorita. No importa si es Times New Roman o cualquier otra, esta bien! Para añadir esta propiedad tienes que escribir:

<span style="font-family:Times New Roman;">Tu Texto</span>

Como puedes ver: <span> está en su lugar al comienzo, tras eso tienes que poner "style=" y la cosa que deseas cambiar. Al final coloca . No olvideas las";" entre cada una de las propiedades

Color de Fuente

Hay 2 maneras de agregar color.

1. Agregar el nombre del Color (en inglés)

Si añades:	Obtendrás:
<span style="color:red;">Natsu</span>	Natsu

2. Agregar los códigos hexadecimales

Si añades:	Obtendrás:
<span style="color:#ff0000;">Natsu</span>	Natsu

No olvides el "#" antes del número (si usas código Hexadecimal)

Text Decoration

Si quieres decorar tu texto usando un subrayado o un tachado, puedes usar:

Si Añades:	Obtendrás:
<span style="text-decoration:underline;">Natsu</span>	Natsu
<span style="text-decoration:line-through;">Natsu</span>	Natsu

También puedes mezclar ambos!:

<span style="text-decoration:underline line-through;">Natsu</span>

Se verá así!: Natsu

Como puedes notar, entre underlina y line-through no hay ningún signo de puntuación solo espacio!

Texto Abajo y Texto Arriba

Si quieres puedes añadir una imagen especial a tu firma, puedes añadir un texto sobre (superescrito o sup) o un texto debajo (subescrito o sub).

Si añades:	Obtendrás:
Natsu<sup>Dragneel</sup>	Natsu^Dragneel
Natsu<sub>Dragneel</sub>	Natsu_Dragneel

Paso 3: Fondo

Wow! Ahora tu texto luce genial! Sigue el fondo!

Añadir un fondo no trae nada nuevo. Puedes usar el nombre del color o el código hexadecimal como en el caso del color de la Fuente.

Si añades:	Obtendrás:
<span style="background-color:red;">Natsu</span>	Natsu
<span style="background-color:#BEBEBE;">Gajeel</span>	Gajeel

Paso 4: Borde

Básico

Ahora que tienes un borde es hora de enmarcarlo:

Si añades:	Obtendrás:
<span style="border:3px solid red;">Natsu</span>	Natsu
<span style="border:3px dotted red;">Natsu</span>	Natsu
<span style="border:3px dashed red;">Natsu</span>	Natsu
<span style="border:3px double red;">Natsu</span>	Natsu
<span style="border:3px groove red;">Natsu</span>	Natsu
<span style="border:3px ridge red;">Natsu</span>	Natsu
<span style="border:3px inset red;">Natsu</span>	Natsu
<span style="border:3px outset red;">Natsu</span>	Natsu

Como puedes ver, después de "border" las propiedades van (en orden) tamaño de tu borde (en px), tipo de borde y color. No uses signos de puntación entre estos 3!

Redondeando Esquinas

Si quieres ver las esquinas de los bordes un tanto más redondeadas, tienes que cambiar el radio del borde. No te preocupes solo tienes que darte la simple tarea de agregar:

border-radius

Si añades:	Obtendrás:
<span style="border:3px solid red; border-radius:1em">Natsu</span>	Natsu

Espera! No estás satisfecho? Quieres cambiar cada esquina de tus bordes! Hecho!

Como en el ejemplo anterior tienes que añadirlo, no con una variable, con 4!

Si añades:	Obtendrás:
<span style="border:3px solid red; border-radius_2em 1em 1em 0em">Natsu</span>	Natsu

Cada número representa una parte diferente del marco, si quieres ponerle nombre, serían estos: border-radius:top-left top-right bottom-right bottom-left

Paso 5: Ajustar el Texto!

Ahora tienes bordes y fondo. Pero si lo que realizaste provoca que tu texto este un poco pegado al marco. Tienes que añadir algunos paddings!

Si añades:	Obtendrás:
<span style="padding-left:7px; border:3px solid red; border-radius:2em 1em 1em 0em}}"> Natsu</span>	Natsu

Paso 6: Imágenes!

Quieres añadir una imagen? No hay problema! Añadir una imagen es como hacerlo en un artículo

Si añades:	Obtendrás:
[[File:Chibi_Pantherlily.png\|120px\|Lily]]

Pero en firmas no está permitido poner imágenes más grandes a 35px, como puedes hacer esto sin hacer que pierda alguna de sus cualidades? Simple! En lugar de 125px agregas 0x35px

Si añades:	Obtendrás:
[[File:Chibi_Pantherlily.png\|0x35px\|Lily]]

Obviamente también puedes añadir un link a cualquier parte de Wikia:

Si añades:	Obtendrás:
[[File:Chibi_Pantherlily.png\|120px\|Lily\|link=Pantherlily]]

Paso 1: Creación

Ahora es el momento de poner todo junto!!

Por ejemplo, yo soy ShadowLightning y quiero que mi firma verde con bordes Amarillos punteados, con fuente Viner Hand ITC, con la letra color Roja, con un lado redondeado y con Levy en ella:

1. Primero pongo mi nombre que es Ivan con el fondo, la fuente y el borde en ella

Si añades:	Obtendrás:
<span style="background-color:Green; border:3px dotted Yellow;">[[User:ShadowLightning\|Ivan]]</span>	Ivan

2. Entonces redondearé algunas esquinas

Si añades:	Obtendrás:
<span style="background-color:Green; border:3px dotted Yellow; border-radius:1em 0em 0em 1em;">[[User:ShadowLightning\|Ivan]]</span>	Ivan

3. No se ve bien, agrego algunos paddings

Si añades:	Obtendrás:
<span style="padding-left:6px;background-color:Green; border:3px dotted Yellow; border-radius:1em 0em 0em 1em;">[[User:ShadowLightning\|Ivan]]</span>	Ivan

4. Cambió la letra. MIRA QUE LA ESTOY COLOCANDO AL JUSTAMENTE DESPUÉS DEL TEXTO!

Si añades:	Obtendrás:
<span style="padding-left:6px;background-color:Green; border:3px dotted Yellow; border-radius:1em 0em 0em 1em;">[[User:ShadowLightning\|<span style= "font-size:15px; font-family: Viner Hand ITC; color: Red">ShadowLightning</span>''']]</span>	Ivan

5. Al Final agrego a Levy

Si añades:	Obtendrás:
<span style="padding-left:6px; background-color:Green; border:3px dotted Yellow;border-radius:1em 0em 0em 1em">[[User:ShadowLightning\|<span style= "font-size:15px; font-family: Viner Hand ITC; color: Red">Ivan</span>]][[File:Levy_wektor.png\|0x35px]]</span>	Ivan

Recuerda! Si quieres modificar tu texto, pon tu <span></span> con la información, justo después del texto que quieres cambiar

Paso 8: Ir a la página!

Tienes tú código, que sigue? Pondré todo en puntos

Tienes que haber creado una subpágina en tu página de usuario. Puedes hacer esto yendo a tu página de usuario y añadiendo /Firma1 al final del url. Después de eso pon todo el código ahí.
Crea otra subpágina que diga /Firma, ahí agrega.
```
{{Usuario:TUNOMBRE/Firma1}}
```
Sálvalo!
Ve a Mis Preferencias, marca Usar Wiki Texto en mi firma y añade:
```
{{SUBST:Usuario:TUNOMBRE/Firma}}{{SUBST:#time: H:i,n/j/Y}}
```
Sálvalo!
Cuando añados tus opinios, comentarios, etc. Añade 3 "~" en lugar de 4, o se duplicará a tiempo parcial y Fecha.

Blog Traducido por BlackQuimera08. Este Blog proviene de Help:Customizing your Signature