fbpx
Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on email
como crear un Footer personalizado con Elementor free y OceanWP
⏱ Tiempo de lectura: 3 min.

Cómo crear un Footer con Elementor Free y OceanWP

A veces los editores de pie de páginas de los temas son un poco limitados en tanto a diseño de estos, es por eso que buscaba una manera de hacerlos a través de elementor, pero me pedia tener activado Elementor Pro, por eso comencé a investigar como hacerlo con Elementor Free.

Hoy te explicare como diseñar un Footer (pie de página) usando Elementor Free y el tema OceanWP.
Índice de contenido

Cómo crear un Footer con Elementor Free y OceanWP

Un Footer o también llamado pie de página, se encuentra ubicado en la parte inferior de una página web, este normalmente suele diferenciarse muy bien del resto de la página.

En este va todo lo que en la web paso desapercibido, como las redes sociales, un formulario de contacto o también se agrega el copyright de la página web, pero tenemos que tener cuidado de cargarlo demasiado para así no confundir al usuario y no generar una mala experiencia.

Pero a la hora de diseñar uno, se vuelven muy básicas con los temas, y si queremos crear una muy atractiva con elementor, nos pide tener activado la versión Pro, pero muchos cuando iniciamos no tenemos el presupuesto para poder pagarnos uno, así que toca ser creativos.

Ahora si con esta pequeña pero efectiva introducción. ¡Comencemos!

Instalación del Plugin Ocean Extra

Este plugin es una maravilla, ya que no solo tiene esta opción de generar plantillas, sino también esconder el header y/o footer de una página en específico, como un montón de opciones extras que veremos cuando hablemos de él en otro post, ahora nos enfocaremos en crear una plantilla para un footer.

Una vez instalado el plugin, nos iremos al panel de control de WordPress y buscaremos Theme Panel > Mi Biblioteca.

Al ser la primera vez que lo instalas necesitas aceptar los términos del Plugin.

Creación de Plantilla

Cuando estemos dentro de Mi Biblioteca, haremos clic en Añadir nueva y nombraremos esta plantilla como Footer y finalmente le daremos clic en Editar con Elementor.

Gráfico de creación de plantilla para footer con elementor free.

Una vez acá, damos rienda suelta a nuestra creatividad y comenzamos a diseñar en Elementor nuestro footer como nos guste, recuerda lo primero que te explique a cerca del footer y no llenes de enlaces, que tendrá una mala experiencia nuestro visitante.

Luego de darle el visto bueno nuestro diseño daremos clic en publicar y regresaremos al Panel del WordPress

Configuración de footer en nuestro tema

Ahora viene la parte pesada, comenzaremos entrado a Apariencia > Personalizar.

Una vez adentro, primero desactivaremos el footer del tema en Pie Inferior (Footer Bottom), deshabilitaremos el cuadro «Habilitar Pie Inferior».

Gráfico de cómo desactivar el footer del tema.

Ahora colocaremos nuestra plantilla en Widgets de Pie de Página (Footer Widgets), si no se encuentra habilitado, lo activaremos e iremos a «Elige una plantilla» y colocaremos nuestra plantilla que creamos con el nombre de Footer.

Ya tenemos nuestra plantilla habilitada, pero este cuenta con un relleno en la parte superior e inferior, así que lo siguiente que haremos será quitarle el relleno (padding) generado de manera automática por el tema y lo colocaremos en 0.

Hecho todos los pasos le daremos publicar.

Gráfico del padding generado automáticamente en el widgets de footer.

¡Felicidades, ya tienes Footer personalizable!

¡Listo! ya tienes un footer personalizable y puedes crear las que te gusten.

Acá ya depende de ti y tu creatividad, diviértete practicando y agregale efectos hover para crear una experiencia de usuario única.

Espero que te haya ayudado mucho este post, si te quedo alguna duda o critica constructiva la caja de comentarios de abajo esta disponible para leerte.

De cualquier manera, eso seria todo por ahora, muchas gracias por leer y ¡CHAU CHAU!

Si te sirvió, compartelo:

Share on facebook
Share on whatsapp
Share on linkedin
Share on twitter
Share on pinterest
Share on email

Deja una respuesta

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

¿Amas elementor tanto como yo?

Suscríbete y demos el siguiente paso para esta relación con Elementor

Este sitio web utiliza cookies para proporcionar una mejor experiencia al usuario. Más información