SLIDER

¡Hola!

Mónica Lemos
¡Hola! Soy Mónicay quiero que empieces a crear tu blog o tu canal de youtube sin complicaciones. Aquí descubrirás cómo.
CONSEGUIR LO QUE QUIERES

NUNCA FUÉ TAN FÁCIL

Si quieres conseguir ciertos cambios en tu blog, renovar el diseño, arreglar algún problema, instalar alguna plantilla que te crea problemas...¡Puedo ayudarte! Envíame un e-mail a [email protected] y hablemos.

Suscríbete

¿Quieres asegurarte de que tus posts estén perfectos antes de ser publicados?
Te regalo una Check-List que te ayudará en esto.


Tutorial Blogger: Caja de texto HTML para que enlacen tu blog

Caja de texto HTML para que enlacen tu blog

Hace tiempo que no hago un post tutorial sobre trucos Blogger, pero como ves he estado cambiando bastante el diseño de mi blog y por eso tengo más recursos interesantes (por lo menos para mi lo han sido) y útiles para compartir.

CUADRO CON CÓDIGO HTML PARA QUE ENLACEN TU BLOG CON TU ICONO/IMAGEN 

Para realizar este paso tan genial que tantas veces había visto en otros blog estupendos, y que gracias a este recurso he enlazado blogs en el mío, he tenido que buscar bastante pero al final encontré un tutorial muy fácil y sencillo que quiero compartir contigo, para que sea más cómodo tenerlo a mano, y a mi me viene de apunte, al pelo¡¡

El tutorial es de Ciudad Blogger. Me encanta este espacio porque la verdad tiene muchas soluciones a dudas que se me plantean y además tienen una manera práctica de explicar, con lo cual resulta más sencillo realizar los pasos que necesitas para lograr aquello que quieres.

Bueno, en primer lugar explica que tienes que crear un widget HTML en el que pegar el siguiente código:



<center><textarea rows="3" cols="30" onclick="this.select();">&lt;a href=&quot;URL de tu blog&quot;&gt;&lt;img alt=&quot;Nombre de tu blog&quot; src=&quot;URL de la imagen&quot;/&gt;&lt;/a&gt;</textarea></center>



<center><a href="URL de tu blog"><img alt="Nombre de tu blog" src="URL de la imagen"/></a></center>

Después explica que si eliminamos onclick="this.select();" significará que el texto no se seleccionará todo con solo un click, pero es mejor no tocarlo.

También aclaran que con " el tamaño de rows (el alto) y el de cols (ancho)" podrás jugar con el tamaño del cuadro de texto HTML. Me gusta que den este tipo de información porque así vamos interiorizando conceptos y conocimientos, es genial no crees? :)

Pero si no quieres complicarte puedes dejar el código tal cual, porque tiene un tamaño bastante normal y cómodo.

Por último solo queda que sustituyas aquello que está en rojo por lo que corresponda. Eso si qué es importante, fijándote bien en no cometer errores.


CÓMO CONSEGUIR LA URL DE UNA IMAGEN

Para la Url de la imagen necesitas subir tus imágenes a un servidor de internet. Dropbox, es un buen ejemplo, pero personalmente yo suelo subirlas también a una entrada del blog que no se publicará nunca, porque me resulta más cómodo para hacerme con la URL de la imagen. Es cosa de cada una/o.

Luego tienes que darle click derecho sobre la imagen donde la tengas (servidor, blogger, Dropbox...) y "Copiar URL/dirección de imagen" y listo, estará copiado en el portapapeles. Lo pegas donde quieras, en este caso lo sustituyes por "URL de la imagen".


CÓMO INVERTIR EL ORDEN DE LA IMAGEN Y EL CUADRO

Resulta que Ciudad Blogger ha puesto el orden al revés de lo que yo quería, porque pone primero el cuadro de texto HTML y luego la imagen o icono del blog. En este caso os facilito el código para que quede el cuadro de texto HTML debajo de la imagen:

<center><a href="URL de tu blog"><img alt="Nombre de tu blog" src="URL de la imagen"/></a></center>

<center><textarea rows="3" cols="30" onclick="this.select();">&lt;a href=&quot;URL de tu blog&quot;&gt;&lt;img alt=&quot;Nombre de tu blog&quot; src=&quot;URL de la imagen&quot;/&gt;&lt;/a&gt;</textarea></center>


Para diferenciar el código de la imagen o icono del código del cuadro de texto html tan solo te tienes que fijar en los códigos <center> (abre un código) y </center> (cierra un código) que lo que hacen es centrar la imagen y el cuadro en el sidebar, o donde lo coloques. Si no lo quieres centrado ya sabes, eliminas esos códigos que abren y cierran y ya está.

Espero que me haya explicado bien, que me entendierais y que os haya resultado de ayuda¡¡ Si no te aclaras o hay algo que no te sale o no entiendes por favor déjame un comentario. También puedes comentar para lo que quieras, los comentarios son una de las buenas consecuencias de tener un blog.


4 comentarios

  1. Me gusta mucho la estética de tu blog Mónica, y estos tutoriales a mí me vienen de fábula. Gracias por compartir tu sabiduría ;)

    ResponderEliminar
    Respuestas
    1. Oh¡ muchas gracias Yolanda¡¡ :D me alegro de que te ayude¡¡
      gracias a ti por leerme :)

      Eliminar
  2. Oh, mi código es distinto. Me permite personalizar también el recuadro donde se encuentra el código.
    He de subir el código algún día al blog, jajajaja.

    Conseguiste centrar las etiquetas! ¿Me expliqué bien en el tutorial? ¿O lo encontraste lioso?

    PD: Cuando cambié la plantilla del blog, instalé de nuevo los iconos a pie de página. Lo hice siguiendo el tutorial que había publicado. Y tenía una cosa mal: me faltaba una barra en un codigo. Una así /
    Y ya sabes... se te olvida algo y todo a la mierda. Lo raro es que esa barra no la tenía cuando lo hice en mi plantilla, por eso no la puse. Pero en la nueva, al intentar hacerlo, me dio error. Así que a lo mejor el problema que tuviste fue ese.

    Mua!

    ResponderEliminar
    Respuestas
    1. Nere¡¡ pues si, yo quería algo sencillo y este me ha gustado. Pero súbe el tuyo que nada sobra¡¡
      Sí las centré, pero la verdad de la buena,(como buenas sincerosas que somos ;) solo vi por encima el código y vi el mítico < cente.. y luego cerrando con ' / ' y ya me dije "tonta" y me fuí al lío en cuanto tuve hueco, jaja, osea que ya sabía hacerlo, pero me lo recordaste¡¡
      Con respecto a tu postdata..jajajja, la verdad que no pienso tocar eso hasta que termine los exámenes¡¡ o el curso¡¡ qué se yo¡¡ jajajja, pero gracias, de todas formas cuando lo haga si necesito algo te digo :)

      Muchas gracias guapa¡ por comentar y fijarte en mis cosillas :P

      Eliminar

© Blogger Paso a Paso • Theme by Maira G. Adaptada por Mónica Lemos, autora de este blog.
Todas las imágenes son del banco de imágenes Unsplash.com o bien de mi propia autoría.
Si quieres puedes reclamar tu autoría - Contactar con la autora del blog.