Últimas reseñas
La brújula dorada
❤❤❤❤
La forma del agua
❤❤❤❤❤
La forma del agua
❤❤❤❤
Ready Player One
❤❤❤❤
La hermana perla
❤❤❤❤
Reino de ladrones
❤❤❤❤❤
La ira y el amanecer
❤❤❤❤❤
Vértigo
❤❤❤❤

22/3/18

ABL | Diseño&Tutoriales: El calendario personalizado


¡Hola a todos, buscadores de lápices!

He perdido la cuenta de las veces que me habéis preguntado sobre este calendario que tengo en la barra lateral del blog, tanto por correo como por redes sociales y comentarios. La primera vez que alguien me consultó, hice un rudimentario tutorial para poder enviárselo por correo y, a partir de ese momento, compartí esos pasos con cada persona que me volvía a pedir que le echara una mano con el widget. Para que os hagáis idea, me he remontado a ese primer correo al que contesté y fue en abril de 2016. Ya iba siendo hora de hacer este tutorial, ¿no os parece?



A estas alturas podéis encontrar información sobre cómo crear vuestro calendario en otros blogs pero, debido a estas consultas que se dirigen directamente a mí, he decidido al fin traeros el tutorial de ¿Dónde está mi lápiz? para que siempre lo tengáis a mano en la página de Ayuda al Bloguero Literario junto a los demás de Diseño&Tutoriales.

Aunque al principio os asuste tanto código y que el tutorial sea bastante largo, no os preocupéis porque, como veréis en seguida, es muy fácil de personalizar y actualizar. A base de práctica podréis pillar el truco en seguida. El motivo de la extensión de esta entrada se debe a que quiero traeros un tutorial lo más completo posible, con diferentes opciones de personalización y las explicaciones necesarias para que no tengáis dudas.

Así que, a continuación, vamos a ver cómo crear vuestro calendario, personalizarlo y actualizarlo. Además, os adjuntaré algunos diseños por si os gustan u os sirven de inspiración. ¡Vamos a ello!


PASOS
Cómo crear el widget...

Este tutorial es de los sencillitos, porque no tendremos que meternos a trastear en el código HTML de la plantilla de nuestro blog, lo único que hay que hacer es ir al apartado de "Diseño", dentro del panel de control de Blogger.

Una vez ahí, hacemos click sobre "Añadir un gadget" (aclaración: gadget widget) en la barra lateral y escogemos el de "HTML/Javascript". Nos saldrá un cuadradito de texto y en "Contenido", pegáis el código de abajo.


Es decir:  Diseño → Agregar un gadget → HTML/Javascript → Pegar código de abajo.




CÓDIGO PARA PEGAR Y COPIAR
<div class="widget HTML" id="HTML17">
<div class="widget-content">
<table width="240px;" border="0" ;="" style="font-family:'Verdana'; text-align: center; font-size: 14px;">
<center>
<span style="color: #71bdcb; font-family: Verdana; font-size: large;">Mes 2018</span>
<tbody><tr>
<td><b>L</b></td>
<td><b>M</b></td>
<td><b>X</b></td>
<td><b>J</b></td>
<td><b>V</b></td>
<td><b>S</b></td>
<td><b>D</b></td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody></center></table>
</div>

<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?

blogID=3408178773454454465&amp;widgetType=HTML&amp;widgetId=HTML2&amp;action=e

ditWidget&amp;sectionId=sidebar-right-1" onclick="return 

_WidgetManager._PopupConfig(document.getElementById(&quot;HTML2&quot;));" 

target="configHTML2" title="Editar">
<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" 

width="18" />
</a>
</span>
</span>
<div class="clear"></div>
</div>



PASOS
Cómo personalizar el widget...

Si habéis seguido el primer paso, ya tenéis vuestro calendario creado. Pero claro, se trata de un modelo estándar, digamos que es solo el esqueleto del widget. Ahora es necesario personalizarlo para que podáis darle el estilo que más os guste según vuestras preferencias.


EN ESTE PUNTO, VOY A FACILITAROS DOS OPCIONES:


1) NO QUIERO APRENDER EL CÓDIGO PARA PERSONALIZARLO

Para cambiar el aspecto del calendario es necesario entender cómo funciona el código. Os aseguro que no es difícil ni muchísimo menos y voy a ayudaros paso a paso. Sin embargo, si no estáis interesados en hacerlo vosotros mismos, por la razón que sea, más abajo os dejaré unos diseños ya configurados.

En el caso de que os guste alguno, solo tendríais que copiar ese código y sustituirlo por el del primer paso. En el caso de que hayáis creado ya el widget, claro; si no, usad directamente ese. Y ya podríais pasar al tercer paso: cómo actualizar el calendario.


2) QUIERO APRENDER EL CÓDIGO PARA PERSONALIZARLO

Obviamente, esta es la opción que os recomiendo, ya que así podréis crear vosotros mismos el diseño de vuestro calendario y adaptarlo al estilo y a los colores de vuestro blog.


IMPORTANTE: En este paso vamos a modificar únicamente las partes del código que aparezcan en color. NO tocaremos nada más, pues el resto de elementos no influyen en la personalización.


Este calendario de abajo es el resultado del código con el que estamos trabajando. Como veis, se trata de un modelo muy sencillito, por eso las opciones de configuración son tan escasas, pero servirá para que entendáis la base de su personalización y, a partir de ahí, podáis dar rienda suelta a vuestra imaginación. Sin más preámbulos, pasamos a ver cómo funciona el código.

Leed despacio y con atención y no tendréis ningún problema:

En la parte azulada está el diseño del calendario en sí. El «width="240px;"» es el ancho del wdiget, por lo que podéis aumentar o reducir el número según queráis hacerlo más o menos ancho, respectivamente, para que quede adaptado a vuestra barra lateral.

Por otro lado, «"font-family:'Verdana'» modifica el tipo de letra o fuente del calendario. Mientras que «text-align: center» provoca que el texto quede alineado en el centro (center = centro; left = izquierda; right = derecha). Y «font-size: 14px» es el tamaño del texto y que, de igual modo, puede modificarse para agrandar o reducir las letras y números.

Si, además, os gustaría cambiar el color del contenido, tenéis que sustituir este código azul por este:

<table width="240px;" border="0" ;="" style="color: #71bdcb; font-family:'Verdana'; text-align: center; font-size: 14px;">

Como veis, hemos añadido «color: #71bdcb» para personalizar el color de las letras y números del calendario. La idea es sustituir el «71bdcb» por otro la numeración que corresponda al color que buscáis (la # no hay que borrarla). En esta página web podréis obtener los códigos de los colores que os gusten, solo tenéis que escoger vuestro tono preferido y copiar el código numérico que tiene el símbolo #.


En la parte verde se encuentra el estilo del título que enuncia el mes y el año de ese calendario: Mes 2018. Podéis comprobar que es posible editar tanto su color como su tipo de letra y el tamaño (en este caso aparece como "large", pero se puede sustituir dicha palabra por números: 14px, 17px, 22px...). También podéis cambiar esta línea por una imagen.


<div class="widget HTML" id="HTML17">
<div class="widget-content">
<table width="240px;" border="0" ;="" style="font-family:'Verdana'; text-align: center; font-size: 14px;">
<center>
<span style="color: #71bdcb; font-family: Verdana; font-size: large;">Mes 2018</span>
<tbody><tr>
<td><b>L</b></td>
<td><b>M</b></td>
<td><b>X</b></td>
<td><b>J</b></td>
<td><b>V</b></td>
<td><b>S</b></td>
<td><b>D</b></td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody></center></table>
</div>

<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?

blogID=3408178773454454465&amp;widgetType=HTML&amp;widgetId=HTML2&amp;action=e

ditWidget&amp;sectionId=sidebar-right-1" onclick="return 

_WidgetManager._PopupConfig(document.getElementById(&quot;HTML2&quot;));" 

target="configHTML2" title="Editar">
<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" 

width="18" />
</a>
</span>
</span>
<div class="clear"></div>
</div>



MODELOS DE CALENDARIOS PERSONALIZADOS

A continuación, os traigo tres modelos de calendarios, por si queréis darle un toque diferente o jugar más con su aspecto y diseño. Solo tenéis que escoger uno y copiar el código de la cajita de abajo.


MODELO #1

MODELO #2

MODELO #3



MODIFICAR LA LÍNEA DEL MODELO #1

En el primer caso, el elemento que se ha añadido es la línea que se encuentra bajo el mes y que correspondería a esta parte del código:

<div style="background: #71bdcb; padding-right: 4px; padding: 8px;">


MODIFICAR LOS CUADROS DE COLOR MODELO #2

El segundo modelo cuenta con unos pequeños cuadros en la línea que enuncia los días de la semana y cuyo color puede cambiarse a gusto del consumidor. Aquí el código y, en color, los apartados donde cambiar el color:

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">L</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">M</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">X</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">J</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">V</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">S</span></b></div>
</td>

<td><div style="background: #71bdcb; padding: 5px;">
<b><span style="color: #ffffff;">D</span></b></div>
</td>


MODIFICAR RECUADRO DE COLOR MODELO #3

Este es un ejemplo de cómo se puede alterar el aspecto del título que indica el mes y el año al que corresponde el calendario.

<div style="background: #71bdcb; padding-right: 8px; padding: 5px;">
<span style="color: #ffffff; font-family: Verdana; font-size: large;">Mes 2018</span></div>


¿QUIERES AÑADIR UNA LEYENDA?



Si queréis incluir un texto o una imagen donde se explique la leyenda de colores (que veremos más adelante, en el tercer paso sobre la actualización), podéis hacerlo sin problemas. Solo tenéis que saber en qué parte del código se debe introducir.



<div class="widget HTML" id="HTML17">
<div class="widget-content">
<table width="240px;" border="0" ;="" style="font-family:'Verdana'; text-align: center; font-size: 14px;">
<center>
<span style="color: #71bdcb; font-family: Verdana; font-size: large;">Mes 2018</span>
<tbody><tr>
<td><b>L</b></td>
<td><b>M</b></td>
<td><b>X</b></td>
<td><b>J</b></td>
<td><b>V</b></td>
<td><b>S</b></td>
<td><b>D</b></td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody></center></table>
</div>


AQUÍ ES DONDE SE DEBERÍA INCLUIR LA LEYENDA. EJEMPLO EN IMAGEN: 

<center><a href="#" target="_blank"><img src="https://s10.postimg.org/5h4ofc161/LEYENDAEJEMPLO.png" border="0" alt="Leyenda"/></a></center>

<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?

blogID=3408178773454454465&amp;widgetType=HTML&amp;widgetId=HTML2&amp;action=e

ditWidget&amp;sectionId=sidebar-right-1" onclick="return 

_WidgetManager._PopupConfig(document.getElementById(&quot;HTML2&quot;));" 

target="configHTML2" title="Editar">
<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" 

width="18" />
</a>
</span>
</span>
<div class="clear"></div>
</div>


PASOS

Cómo actualizar el widget...

Ya podemos entrar en el meollo del asunto. Este widget se configura y actualiza de forma manual, de modo que tendréis que actualizarlo vosotros mismos. Para que no se nos escape nada, vamos a dividir este apartado en dos pasos: 1) adaptar el calendario al mes actual; 2) indicar los días en los que se publican las entradas del blog.

Lo primero que tenéis que tener en cuenta es que, a partir de ahora, no vamos a tocar ninguna parte del código del widget a excepción de la que está destacada en rojo. 


<div class="widget HTML" id="HTML17">
<div class="widget-content">
<table width="240px;" border="0" ;="" style="font-family:'Verdana'; text-align: center; font-size: 14px;">
<center>
<span style="color: #71bdcb; font-family: Verdana; font-size: large;">Mes 2018</span>
<tbody><tr>
<td><b>L</b></td>
<td><b>M</b></td>
<td><b>X</b></td>
<td><b>J</b></td>
<td><b>V</b></td>
<td><b>S</b></td>
<td><b>D</b></td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody></center></table>
</div>

<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?

blogID=3408178773454454465&amp;widgetType=HTML&amp;widgetId=HTML2&amp;action=e

ditWidget&amp;sectionId=sidebar-right-1" onclick="return 

_WidgetManager._PopupConfig(document.getElementById(&quot;HTML2&quot;));" 

target="configHTML2" title="Editar">
<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" 

width="18" />
</a>
</span>
</span>
<div class="clear"></div>
</div>



ADAPTAR EL CALENDARIO AL MES

Se trata de los días del mes, cuya estructura y orden habrá que cambiar cada nuevo inicio de mes. Echemos un vistazo.

<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>

La clave está en entender el modelo de código. En este caso, diferenciamos entre: <tr> y <td>; el primero hace referencia a las semanas y el segundo a los días. En el código de arriba, nos encontramos ante la primera semana de un mes que comienza en lunes. Para que comprendáis esto, vamos a ver cómo sería el código de un mes cuyo primer día cayese en jueves.

<tr>
<td></td>
<td></td>
<td></td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>

Los números seguirían este orden en el resto de semanas, entendidas como el conjunto de este código. Se deja un espacio vacío en el recuadro en el que no haya día. Así que solo hay que saber qué día de la semana empieza el mes que toca para colocar el día 1 bien y, a partir de ahí, seguir con el resto de días. 

Si se acaba el código y quedan días por poner, solo habría que copiar esta estructura y situarla justo debajo de la que se nos ha quedado corta ese mes. Si quedan huecos, se dejan en blanco. Como sería el caso: 

<tr>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td>29</td>
<td>30</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

¡No os olvidéis de cambiar el título de 'Mes 2018' por el nombre del mes que toque!



ACTUALIZAR EL CALENDARIO

Cada vez que queráis introducir una entrada en el calendario, estos serán los pasos que habrá que seguir. En primer lugar, el código que representa a tu entrada y que hay que sustituir por el día con el que se corresponda es este:

<a href="ENLACE-DE-LA-ENTRADA" ;="" style="TEXT-DECORATION: NONE"><div style="BACKGROUND-COLOR:#f15c7b;COLOR:#ffffff;" title="TÍTULO-DE-LA-ENTRADA">DÍA-DEL-MES</div></a>

ENLACE-DE-LA-ENTRADA | El enlace de la entrada.
BACKGROUND-COLOR:#f15c7b;COLOR:#ffffff | En el primer 'color' va el código de color del fondo de ese recuadro, y en el segundo va el color del número.
TÍTULO-DE-LA-ENTRADA | El título de la entrada, ejemplo: "Chachi booktag"
DÍA-DEL-MES | Se pone el día del mes que toca y que se ha reemplazado al poner el código.


Como ejemplo, la primera semana de este mes de enero en la que se han publicado dos entradas quedaría así:

<tr>
<td><a href="www.blablabalbala.com" ;="" style="TEXT-DECORATION: NONE"><div style="BACKGROUND-COLOR:#f15c7b;COLOR:#ffffff;" title="Booktag">1</div></a></td>
<td>2</td>
<td>3</td>
<td><a href="www.blabalbalbal.com" ;="" style="TEXT-DECORATION: NONE"><div style="BACKGROUND-COLOR:#f15c7b;COLOR:#ffffff;" title="Reseña: Cazadores de sombras #1">4</div></a></td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>




¿Qué te ha parecido este tutorial? 
Puedes dejar en los comentarios cualquier duda que tengas.
O alguna sugerencia para la siguiente entrada. :)
¡Hasta la próxima!

15 comentarios:

  1. ¡Hola! Ya te sigo :D ¿Podrias seguirme de vuelta en mi blog? Aqui te dejo el link https://elcolibriliterario1.blogspot.mx/

    ResponderEliminar
  2. Holaaaa tengo que verlo con más calma que yo soy pésima con esto de los códigos.
    Gracias
    un bes❤️

    ResponderEliminar
  3. Mil gracias por el tutorial, desde hace tiempo estoy pensando en poner un calendario de entradas pero soy terrible con el código HTML y tu entrada es tan detallada y lo haz simplificado todo de una manera súper entendible. Gracias =)

    ResponderEliminar
  4. Muy útil este tutorial, lo explicas minuciosamente y de maravilla. Voy a implementarlo en mi blog (sé que me costará) pero el que tengo no me gusta mucho.
    ¡Mil gracias!

    ResponderEliminar
  5. Hola Alex!!

    Madre del amor de todos los nifflers! Qué currada para hacer un puñetero calendario. Pero qué currada! A mi sinceramente el html me estresa. Yo soy más de 'publico X día' y entrada sorpresa (libro, peli, serie, o niffler) pero que vamos, que se agradece un montón que alguien te explique como se mete el calendario en los gadgets, porqué por lo menos, yo no tenía ni la más remota idea de ello. Gracias por compartirlo!

    Un besote enooorme!! ♥

    ResponderEliminar
  6. Me viene de perlas el tutorial, yo tenía ya un código, pero no me quedaba del todo bien y ya en base al tuyo noté cuáles eran los errores, sin duda voy a ocupar uno y te pondré en los créditos ;)

    Pero antes ¿No hay alguna forma de que funcione como archivo del blog y cambie automáticamente? Agradecería resolvieras esa duda que tengo.

    Besos!!!

    ResponderEliminar
    Respuestas
    1. ¡Hola, Paola!
      Este método para crear un calendario no permite la actualización automática, que yo sepa. Sin embargo, sí hay otra forma de crear un calendario para que registre automáticamente las entradas de cada día. Si estás interesada, puedo traeros otro tutorial sobre ese modelo. :)

      Eliminar
    2. ¡Por favor! Estaría muy agradecida, pues mira que estoy hecha un lío con todo esto.
      Muchas gracias ♥

      Eliminar
    3. Si por favor, nos harías un favor enorme ♥ Haz el tuto

      Eliminar
  7. Hola, Alex, muy útil este tutorial, gracias. Aunque de momento no creo agregar este elemento a mi blog. Sin embargo, podrías traernos un tutorial para poner la flecha o imagen para subir en la página por favor, lo he buscado varias veces pero no me funciona.

    Besos!!

    ResponderEliminar
  8. Hola!!
    Me encanto tu tutorial. Muchas gracias por tomarte tiempo para explicarnos.
    Me tarde pero pude aplicarlo (soy mala con estas cosas hasta que le agarro lo mano). Lo único que no pude es el tema de las leyendas.. coloco el código y me aparece como el ejemplo: reseñas y secciones, pero no entiendo como cambiar los nombres o agregarles otros xD
    Muy conforme igualmente. Los veía en muchos blogs y quería uno!!
    Besos y hermoso tu blog. :)

    ResponderEliminar
  9. Qué genia que sos. Muchas gracias por compartir esto! Siempre quise saber cómo se hacían. Quizás en algún momento me anime a poner uno en el blog, gracias a vos ♥
    Un besote!

    ResponderEliminar
  10. Wooow estoy cambiando mi Blog y este calendario le dará el toque que necesito mucha s gracias por este tutorial tan bien hecho 🤗

    ResponderEliminar
  11. ¡Buenas! Estos tutoriales me dan la vida, muchas veces me imagino que hacer algo es súper complicado, pero después al leer los tutoriales me parecen súper sencillos, y cuando intento aplicarlos, otra vez, súper complicados. ¡La vida!

    Te seguía hace muchísimo, pero no sé por qué, mi blog borró todos los blogs a los que seguía y tengo que empezar de cero. ¡Enhorabuena por tus casi casi casi 2.000 seguidores! Yo he sido tu seguidora número 1.999. ¡un besito! Mo-

    ResponderEliminar
  12. Hola!
    Me encanta tu blog, no sólo por las reseñas, también por tus iniciativas y por compartir tus conocimientos con nosotros jajajaja
    Mil gracias por los tutoriales, llevo desde que empecé con el blog buscando como hacerlo y era un lío! Muchísimas gracias por enseñarlo tan bien, de verdad :D

    ResponderEliminar