- 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.