¡¡Neko-chan volvió!! (? + [Pedidos] Tutorial: como poner una imagen con barra de retos en tu blog {100% Neko-chan}

Hi mis otakus  ¡¡he vuelto!!  no se si alguien no notó mi presencia, pero para los que se dieron cuenta que no estaba, he vuelto . He estado muy ocupada con los estudios porque ya dentro de 1 semana me dan las notas, he creo que he suspendido 4 o 5  tengo mucho miedito  entonces en estos últimos días he estado estudiando mucho para los últimos exámenes, que todavía me faltan 2, así que seguramente pronto vuelva a desaparecer 

Dejando mi vida a parte, por ask me pidieron que si podía hacer un tutorial sencillo de como poner una imagen y una barra de retos, así que yo he hecho MI PRIMER PROPIO TUTORIAL, así es, 100% Neko-chan . Para verlo tenéis que dar al botón 

Tutorial: como poner una barra de retos con imagen incluida

Primer paso: poner la imagen

Seguramente mucho sabréis como se pone una imagen ¿no? Pero los blogs novatos no, así que lo voy ha explicar 

1. Vamos a copiar imagen de cualquier reto que quieras (aquí os dejo los retos que tengo yo):

El nombre de tu blog en versión manga

El nombre de tu blog en versión anime

1. Después vamos Diseño, Añadir un gadget y buscamos HTML/Javascript y le damos.

1. Le damos a Formato RTF y pegamos la imagen.

1. Y quedará así:

1. Y por último damos a guardar y vemos como ha quedado.

Si ha quedado demasiado grande o demasiado pequeño lo único que tenéis que hacer es editar la imagen con el tamaño que queráis y cambiáis la imagen que teníais con la nueva.

Segundo paso: poner la barra de retos

• Primero copiamos este código:

<div style="background-color: white; border: 1px solid rgb(204, 46, 250); font-style: normal; font-weight: normal; height: 15px; width: 200px;"><div style="background: #FA5858; font-size: 8px; height: 15px; line-height: 8px; width: 4%;"><br /></div></div><span style="font-style: normal; font-weight: normal;color:#33cc00;">1 / 23 Animes. 4% Vistos! ^^</span>

• Una vez copiado vamos a Diseño, vamos al gadget donde estaba la imagen del reto y pegamos este código debajo del código de la imagen.

 

• Y quedará así:

• Le damos a guardar y listo.

Ahora para editarlo lo único que tenéis que hacer es esto::

Morado: color de la barra.

Rosa violeta: el color de las palabras que pone 1/23 Animes. 4% Vistos! ^^

Rojo: es el porcentaje que hará que la barra avance (si pones un número grande más larga será la barra y si pones uno más pequeño más pequeña será la barra.

Azul: los animes, mangas o cosas que hayas conseguido (podéis cambiar el nombre y cuando vayáis avanzando ponéis: 1/23 pasáis a 2/23 o cosas así). Podéis cambiar el Animes por el nombre que queráis.

Verde: el porcentaje que has hecho: cuando cambiéis el porcentaje también tenéis que cambiar este y poner el mismo número. También podéis cambiar el Vistos! ^^ por el nombre que queráis 

Aquí os dejo la página donde cojo los códigos de los colores:

http://html-color-codes.info/codigos-de-colores-hexadecimales/

¡¡Y aquí mi primer tutorial hecho!! . No se si me he explicado muy bien, ya que es mi primer tutorial hecho por mí, así que si lo usáis o queréis compartirlo, NO OLVIDÉIS DAR CRÉDITOS 

Y esto es todo, nos vemos