caja de suscripción en tus entradas

Poner caja de suscripción en tus entradas o donde quieras Tutorial Blogger

poner-caja-suscripcion-entradas-posts

De nuevo estamos aquí con un tutorial extra respondiendo a peticiones que me habéis hecho, y este tutorial completa el anterior, sobre cómo personalizar la caja de suscripción de Feed Burner para poder crear los estilos que más te gusten y después poder colocar la caja de suscripción en tus entradas o en tu sidebar.  

Esto último es lo que hoy nos ocupa. Vamos a añadir caja de suscripción en tus entradas, al final de todas tus entradas a partir de este momento, de forma automática, sin que tengas que hacer nada más que lo que hoy hagas, y también vamos a ver cómo añadirlo en tu sidebar o en entradas separadas, y en el pie de página de tu blog.  

Como ves tenemos muchas y variadas opciones para poder incrustar nuestro formulario de suscripción en el blog, de manera que según cómo sea el diseño de nuestro blog se ajuste más a nuestra interfaz, o parte visual de él.  

Personalmente creo que lo que más resultados trae es la caja de suscripción que nos encontramos al final de cada entrada, o debajo de nuestra cabecera, o slider, si es que lo tenemos, así que si no sabes cual elegir, te recomiendo alguna de estas dos opciones. Sin olvidar nunca el Sidebar / barra lateral de nuestro blog, ya que ahí tendrán que encontrar siempre los detalles importantes y básicos de nuestro blog.

Añadir caja de suscripción al final de las futuras entradas

En WordPress lo tendremos que hacer a mano insertando un bloque HTML y pegando el código que nos proporcionan. Hay opciones mucho mejores pero son de pago.

Para añadir nuestro formulario de suscripción al final de las entradas lo tenemos muy fácil. No tiene porqué ser el de Feedburner, puede ser también el de Mailerlite.

En Blogger seguiremos los siguientes pasos.

Desde nuestro panel de control de Blogger, en nuestro blog:

1- Ir a Configuración

2- Ir a Entradas, Comentarios y elementos compartidos

3- Hacer click en Añadir donde pone Plantilla de las entradas, aquí, mira:

añadir-caja-suscripcion-final-de-entradas

4- Se nos abre una caja de texto donde tenemos que copiar el código que hemos trabajado en el tutorial anterior.  

5- Nos vamos a la parte derecha superior donde encontramos Guardar Configuración y ya lo tendríamos listo.   

En nuestras próximas entradas tendremos la caja de suscripción que nos aparecería por defecto. ¡Magnífico! Ya no tendremos que volver a añadir el código ni hacer nada más, siempre nos saldrá la caja de suscripción cuando creemos una nueva entrada.

Añadir caja de suscripción en las entradas ya publicadas, en borrador o programadas.

En el paso anterior hemos adelantado mucho trabajo, pero ¿Qué pasa con las antiguas entradas?

En este paso vamos a ver cómo modificarlo. Es muy sencillo pero nos llevará más tiempo.

1- Vamos a la entrada en la que queramos añadir el formulario de suscripción.
2- Arriba a la izquierda en el editor le damos a HTML que está junto a redactar. Es simplemente tu entrada en código HTML.
3- No toques nada más y al final de todo haz 2 Enter y pega el código que hayas elegido para la caja de suscripción.
4- Dale a Actualizar, Programar o Guardar, según sea una entrada publicada, programada, o en borrador, respectivamente, y listo!!

Añadir caja de suscripción en todas las entradas publicadas presentes y futuras.

Esta es la opción más fácil si tenemos mucho contenido antiguo en el que queremos añadir la caja de suscripción, pero no significa que sea la más adecuada.    Esta opción no incluye la caja de suscripción en la entrada, si no en el blog, pero la vamos a colocar después de cada entrada.    Puede que sea la mejor opción o puede que no. Si dentro de un tiempo quieres modificar en algunas entradas la caja de suscripción, porque tienes diferentes listas de suscripción, porque tienes grupos de personas interesadas en diferentes temáticas que tu blog trabaja, esta opción no te la recomiendo.   Sin embargo si no vas a cambiar tu método de Newsletter o envío de post al e-mail, ni tampoco el diseño de esta caja para diferentes entradas, puede ser la mejor opción.

Paso a paso te explico cómo hacerlo:

1- Vamos a Tema

2- Copia de seguridad

crear copia de seguridad de plantilla en blogger
crear copia de seguridad de plantilla en blogger

3- Volvemos a ese menú y esta vez le damos a Editar HTML

4- Buscamos en plantilla el siguiente código (si no sabes cómo mira este vídeo) <div class=’post-footer’>

nos interesa el segundo (en el vídeo de este post encontrarás cómo saber cual es el que te interesa)

5- Justo después, debajo, pegamos el código de nuestra caja de suscripción.

6- Guardamos plantilla y listo!

Añadir caja de suscripción en nuestro sidebar / columna lateral del blog

1- Vamos a Diseño

2- Añadir Gadget en la columna lateral del blog

3- Elegimos HTML / Javascript 

4- Podemos ponerle título si queremos y si no dejarlo así, pero en el cuadro grande de texto debemos pegar el código de la caja de suscripción que hayamos elegido.

5- Guardamos.

6- Movemos el gadget a la posición que queramos.

Añadir caja de suscripción debajo de nuestra cabecera / Slider o al pie de página

1- Vamos a realizar todos los pasos anteriores y en el último paso vamos a arrastrarlo hasta debajo de nuestra cabecera, o hasta el Footer, o pie de página.

2- Guardamos disposición y listo!!

Qué fácil ¿Verdad?

Vídeo tutorial añadir caja de suscripción a blog

Si no te resulta sencillo y si quieres completar toda esta info, te aconsejo que realices el tutorial paso a paso con el vídeo 🙂 Si es que… más fácil no te lo puedo dejar 😉

¿Qué te ha parecido? Si tienes algún tipo de duda por favor deja un comentario y la resolvemos 😉

El próximo tutorial vamos a ver cómo añadir la suscripción con un botón directo.

Comparte

CONSIGUE

LA VIDA QUE DESEAS

GRACIAS A UN NEGOCIO ONLINE RENTABLE

Disfruta de mi curso gratuito “Cómo tener un Negocio Online Rentable no solo económicamente”, en el que comparto las áreas más importantes a trabajar para conseguir la vida que deseas con tu Emprendimiento Online.

Interacciones con los lectores

17 comentarios

  1. María Coll (Cazadores de Libros)

    ¡Holaaaa!
    Perfecto el tutorial y super bien explicado como siempre^^

    Lo único que me funciona todo, excepto lo de ponerlo tanto en las antiguas entradas como en las nuevas. Al añadir el código en la plantilla me sale este error "Error al analizar XML, línea 1870, columna 28: Element type "span" must be followed by either attribute specifications, ">" or "/>"." Y no hay manera de solucionarlo (igual es porque ya anteriormente lo he colocado en las entradas nuevas en configuración…) puede ser…

    Te dejo el blog donde lo intenté por si quieres echarle un vistazo y así me puedes decir un poco mejor donde está el error (que seguro es mío pero soy incapaz de encontrarlo x'D) http://pruebaskrazybookobsession.blogspot.com.es/

    Muchas gracias por el tutorial^^
    Besos!!

    • Mónica Lemos

      Hola María, muchísimas gracias 😍
      Ese aviso te explica donde está concretamente el error.

      Tienes que fijarte, después de poner el código y darle a guardar, cuando te sale el aviso, donde se ha colocado el cursor del ratón. Allí es donde falta algo o está mal escrito.

      El cursor se sitúa en la línea y columna que te indica en el aviso.

      Me da que te falta algún cierre de etiqueta, tal como te cuenta, en la etiqueta "span"
      Fíjate bien donde lo has puesto y también en que todo estea bien escrito.

      Revisa el código de la caja y también mira bien donde lo pegas en la plantilla. Luego nos comentas a ver qué tal.
      Espero que se solucione.
      Muaaack!

    • María Coll (Cazadores de Libros)

      Error solucionado!! Lo hice tal y como dijiste y me fijé simplemente en donde había ido a parar el cursor después del error y me faltaba tan solo un simbolito de '>'. Pero ahora tengo otro problema del que no sé como salir, pues no me da error ni nada /_. Resulta que en el blog justo arriba de cada cajita de suscripción de las entradas me sale una parte del código, exactamente esto : (courier new" , "courier" , monospace;") y ya no sé como hacer para que no me salga D: ¿Puedes ayudarme con eso por favor?

      Muchas gracias de nuevo, más con la santa paciencia que tienes x'D
      Besos^^

  2. Sandra M

    Hola Mónica!!
    Muchas gracias por el tutorial! Aunque para instalarlo en el html hay que cambiar todas las comillas, a mí por lo menos me ha dado error y al final lo he puesto en lo de la configuración 😀
    Besos guapa <33

    • Mónica Lemos

      Hola Sandra! Si? Pues como has visto en el tutorial del vídeo lo he puesto tal cual y no me ha dado error pero sí que es cierto que me tiene ocurrido lo de las comillas en otras situaciones… Sospecho que es al usar Word o writer, ¿usas bloc de notas o Word? Alomejor es eso.. No sé!
      Muchas gracias solete! 😉

    • Sandra M

      Lo añadí directamente del que tengo en el sidebar, pero intentaré ponerlo en otro momento que tenga más tiempo libre. Pero vamos, que no es la primera vez que me pasa con algún otro código. A veces blogger se vuelve rebelde 😛
      Gracias a ti por todo! <3

    • Mónica Lemos

      Hola Jhaldrén, muchísimas gracias!!! De eso se trata , de que podáis transmitir vuestra esencia!! 🙂

      Síii, lo tengo pendiente!! Pero son tantas cosas!! jeje, poco a poco. Hacer una plantilla responsive siempre es lo más acertado 😉 veremos todo poco a poco 🙂

      Muack!

  3. Jenn Madaly

    Necesito ayuda con la caja de comentarios 🙁
    Desde ayer ya no me aparece y he buscado en la configuración pero no hay nada mas que la ubicación del comentario y esta con la opción insertados… 🙁

    • Mónica Lemos

      Hola Jenn, lo siento mucho, vaya faena!
      Si se siguen los pasos que indico no debería ocurrir ningún problema, y por lo que me cuentas no tengo mucha info para poder ayudarte!
      Si has hecho antes de nada una copia dde seguridad puedes volver a reestablecerla.

      Suerte y ánimo

  4. Entre2

    Increíble muchas gracias. Eres una veterana en este tema, te felicito y agradezco por compartirlo. aún estoy tratando de colocarlo a mi blog. Me gustaría modificar mi franja de abajo donde tengo mis imágenes de instagram, si puedes ayudarme con esto te lo agradecería, ya que modifique el código y no se como arreglarlo. Un abrazo.

Deja tu comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *