Crear un footer o pie de página con Elementor Pro paso a paso

  • En este vídeo, te voy a enseñar cómo crear un Footer con Elementor Pro.
  • Lo primero que necesitas, es tener instalado Elementor y Elementor Pro. Este y otros muchos plugins premium para WordPress puedes descargarlos desde Llibrenetworks.com si te haces miembro. Tienes el link abajo, en la descripción del vídeo.
  • Bien, una vez instalados Elementor y Elementor Pro, en el menú lateral izquierdo de WordPress, debes ir a Plantillas, Añadir nueva.
  • Ahora, en tipo de plantilla, debes hacer clic en el desplegable y elegir Footer. A continuación, introduce un nombre a la plantilla. Por ejemplo, Footer Demo. Luego, haz clic en Crear Plantilla.
  • A continuación, podrás elegir entre algunas de las plantillas que ya vienen creadas en la versión Pro, o crear una desde cero. En esta ocasión, veremos cómo crear una desde cero.
  • Para ello, tan solo tienes que hacer clic en cerrar la pestaña, arriba a la derecha.
  • Ahora, el primer paso es definir la estructura que quieres que tenga el Footer.
  • Para ello, haz clic en el símbolo del más. En esta ocasión, definiremos una estructura de dos bloques.
  • Hacemos clic sobre la sección izquierda, y en el menú lateral izquierdo, arrastramos la opción de Sección interior para crear otra subdivisión en dos columnas, que utilizaremos para links de Preguntas Frecuentes, Política de Privacidad, etc.
  • Volvemos a hacer clic sobre el símbolo más de la columna izquierda, y en el menú lateral izquierdo, arrastramos la opción de Título.
  • Escribiremos algo como ¿Necesitas ayuda?
  • Lo alineamos al centro.
  • Luego, vamos a Estilo, y le cambiamos el color.
  • Y también cambiamos el tamaño de letra.
  • Por ejemplo, 22 píxeles.
  • Volvemos al menú lateral izquierdo, hacemos clic aquí para visualizar los módulos, y arrastramos la opción de Lista de Iconos.
  • En esta primera columna, vamos a poner 3 links típicos, como por ejemplo, Sobre Nosotros, Preguntas Frecuentes, y Contacto. Acuérdate de poner el link de tus páginas. Yo, como no las tengo creadas, las dejaré así.
  • Borramos los iconos.
  • Luego, vamos a estilo, y en el apartado de alineación, alineamos la columna al centro.
  • Ahora, vamos a crear una segunda columna para las páginas legales, como por ejemplo, Términos de Uso, Política de Privacidad, y Política de Cookies.
  • Para hacerlo más rápido, vamos a borrar la columna vacía y a duplicar la columna que ya hemos creado.
  • En el título, escribimos Legal. Y cambiamos los nombres de las páginas y los links.
  • Escribimos Términos de Uso, Política de Privacidad, y Política de Cookies.
  • Ahora, en la sección derecha, colocaremos un formulario de suscripción al Newsletter, algo que todo negocio online debería tener.
  • Hacemos clic sobre la sección, y en el menú lateral izquierdo, arrastramos la opción de Formulario.
  • Queremos un formulario de suscripción rápido, por lo que dejaremos solo el apartado para el email, una casilla para la política de privacidad y el botón de suscripción.
  • En el apartado de email, desmarcamos la opción de label, para que quede más bonito.
  • Añadimos una nueva sección para la política de privacidad, y en tipo, seleccionamos la opción de Aceptación.
  • La marcamos como Obligatoria, y pegamos el siguiente código, que dejaré en la descripción del vídeo.
  • Recuerda substituirlo con el link de tu página de privacidad.
  • Para cambiar el texto del botón, vamos a la pestaña Botón, y aquí, escribimos Suscríbete.
  • Ahora, vamos a cambiar el color del botón. Vamos a estilo, Botón, y colocaré el mismo color que en los títulos.
  • Hablando de títulos, vamos a añadir también un título a esta sección.
  • Duplicamos este título, y le ponemos un nuevo nombre, por ejemplo, Suscríbete al Newsletter.
  • Ahora, vamos a centrar toda la sección al medio, para que quede mejor.
  • Hacemos clic sobre la sección, y en Alineación Vertical, seleccionamos Medio.
  • Por último, vamos a añadir unos iconos de redes sociales.
  • Hacemos clic sobre el símbolo del más, y añadimos una nueva sección.
  • Ahora, volvemos a hacer clic sobre el símbolo del más, y en el menú lateral izquierdo, arrastramos la opción de Iconos Sociales.
  • Añadimos las opciones de Facebook, Twitter, YouTube, e Instagram.
  • Recuerda pegar aquí los links de tus redes sociales, si no, los iconos no funcionarán.
  • Seleccionamos una forma circular para los iconos.
  • Y en la pestaña estilo, le vamos a indicar un tamaño de, por ejemplo, 12 píxeles.
  • Para acabar, vamos a colocar un fondo de color al Footer.
  • Seleccionamos la sección, vamos a la pestaña estilo, seleccionamos tipo de fondo clásico, y en el selector de color configuramos el color que queramos.
  • Para esta ocasión, yo voy a pegar el código de color del amarillo de mi página web.
  • Hacemos lo mismo con la sección de las redes sociales. Vamos a la pestaña estilo, seleccionamos tipo de fondo clásico, y en el selector de color, configuramos el color que queramos.
  • Por último, vamos a configurar un relleno interior y unos márgenes a la zona del Footer.
  • Seleccionamos la sección, y vamos a la pestaña de Ajustes Avanzados.
  • En el apartado de margen, hacemos clic en este botón para deslinkar los valores.
  • Luego, seleccionamos el tipo de unidad E.M., y aplicamos 2 E.M. de margen superior.
  • Ahora, en la sección de Padding, hacemos lo mismo. Hacemos clic en el botón para deslinkar los valores, seleccionamos el tipo de unidad E.M., y aplicamos 2 E.M. de relleno superior e inferior.
  • Ahora, vamos a la sección de los iconos sociales y repetimos el proceso.
  • Hacemos clic en el botón para deslinkar los valores, seleccionamos el tipo de unidad E.M. y aplicamos 2 E.M. de relleno inferior.
  • El último paso es publicar el Footer. Hacemos clic en publicar, y seleccionamos que se muestre en toda la web, que es lo más común.
  • No obstante, si quieres puedes excluir el Footer de ciertas páginas.
  • Por ejemplo, en este caso vamos a excluir el Footer de los post.
  • Es decir, el Footer se mostrará en toda nuestra web, excepto en los post.
  • Ahora, guardamos y cerramos.
  • Y ahora, si vamos a la web, veremos que el Footer se muestra tal y como hemos configurado.
  • Espero que hayas aprendido a crear un Footer para tu página web con Elementor Pro. Ahora, te toca a ti experimentar.
  • Recuerda suscribirte, y visitar Llibrenetworks.com si quieres ahorrar dinero en plugins y temas premium para WordPress.