Instalación de Elementor

¿Aún no conoces Elementor? Pues no te preocupes. A partir de este momento vas a comenzar a experimentar una nueva forma de diseñar sitios web realmente profesionales, de una manera muy sencilla y agradable.

Elementor es un plugin. No tiene más historias. Su principal función es como Editor de Contenidos. Pero no cualquier editor ya que de esos hay muchos por ahí.

Un potente editor de contenidos con el cual seremos capaces de crear sitios web realmente impresionantes. Algo que quizás nunca hayas visto. Pues a partir de ahora lo vas a hacer.

En esta entrada, Elementor Page Builder, puedes encontrar una breve reseña de la historia de Elementor y de lo que ha llegado a ser hoy en día en el "mundo WordPress".

Instalación de Elementor
Reproducir video acerca de Instalación de Elementor
Índice del contenido
    Add a header to begin generating the table of contents

    1. Vamos a instalar Elementor

    Por si aún no lo sabes, Elementor se distribuye en 2 presentaciones:

    • El plugin Elementor (Lite) es la versión gratuita y viene con una serie de opciones básicas para comenzar. Se puede instalar desde el repositorio de plugins de WordPress.
    • Elementor PRO. Es la versión profesional que incluye el resto de funciones PREMIUM con las cuales se logran crear diseños web muy profesionales. A partir del capítulo 06 comenzaremos a trabajar en este curso con la versión PRO.
    Elementor Page Builder

    Si aún no tienes Elementor PRO este es el momento perfecto para que te hagas con este fantástico editor de contenidos.

    Va a ser parte importante de este curso. Desarrollaremos muchas lecciones con este plugin para que aprendas a utilizarlo en su totalidad y sacar el máximo provecho para el desarrollo de sitios web 100% profesionales.

    Para instalar Elementor es necesario haber instalado WordPress. Si necesitas afinar tus conocimientos sobre WordPress para compatibilizarlos con Elementor, aquí tienes el curso de WordPress.

    https://es.wordpress.org/plugins/elementor/

    Para instalar el plugin:

    1. Dirígete al apartado Plugins >> Añadir nuevo.
    2. En el campo de búsqueda escribe Elementor.
    3. Haz clic en Instalar ahora y seguidamente en Activar.

    Ahora nos aparece Elementor como parte del menú principal de WordPress con una serie de opciones para configurar el plugin.

    Anuncio publicitario

    2. Configuración de Elementor

    En realidad Elementor no necesita mucha configuración para comenzar a utilizarlo. Dependerá mayormente del tema WordPress con el que estemos trabajando.

    A continuación, vamos a ver algunas de las opciones más relevantes de este plugin:

    2.1 Ajustes

    Dirígete al apartado Elementor >> Ajustes. En la pestaña General podemos ver las siguientes opciones:

    • Tipos de contenido. Por defecto, WordPress habilita las páginas y las entradas y Elementor las reconoce. Al estar activadas estas casillas, podremos editar tanto páginas como entradas con Elementor.
    • Desactivar colores y fuentes por defecto. Elementor viene con unos colores y fuentes por defecto cuando lo instalamos. Si marcamos estas casillas, Elementor heredará las fuentes y colores del tema que estemos utilizando.

    En futuras lecciones vamos a instalar el tema oficial de Elementor, Hello Theme, que se integra perfectamente con Elementor PRO y veremos como sacar provecho a las fuentes y colores con Elementor.

    En la pestaña Avanzado, cambiamos la opción Cargar compatibilidad con Font Awesome 4 por  y hacemos clic en Guardar cambios. De esta manera nos aseguramos que se muestren correctamente todos los iconos que utilicemos con Elementor.

    Las opciones por defecto de la pestaña Estilo son suficientes para trabajar con Elementor sin complicaciones.

    Cargar compatibilidad con Font Awesome en Elementor
    Cargar compatibilidad con Font Awesome en Elementor

    En este apartado, cuando instalamos Elementor PRO, se activa una pestaña llamada Integraciones.

    En esta pestaña podremos indicar claves y APIs de algunas de las aplicaciones más conocidas como reCAPTCHA (para evitar el SPAM en los formularios), Facebook SDK (para integrar comentarios o botones de Facebook en nuestro sitio web) o Mailchimp (para los newsletters), entre otras.

    Todas estas aplicaciones se pueden integrar con Elementor de una manera muy sencilla sin necesidad de instalar plugins adicionales. Esta pestaña la conoceremos más adelante cuanto comencemos a trabajar con Elementor PRO.

    En la lección, integraciones en Elementor, veremos como se configuran y cómo funcionan los widgets y aplicaciones asociados a las integraciones.

    2.2 Herramientas

    Aunque en este apartado no hay que hacer nada de momento para configurar Elementor, es muy importante que lo tengas en cuenta ya que te podrá ayudar a solventar algunos fallos que se presenten en un futuro.

    I. General

    • Regenerar CSS. Permite cargar nuevamente los archivos CSS que crea Elementor si alguna parte de nuestro sitio web no se visualiza correctamente.
    • Sincronizar la biblioteca. Aunque la biblioteca se suele actualizar de forma automática, puede que alguna vez necesitemos hacerlo de forma manual por si alguna plantilla no carga correctamente.
    • Modo seguro. El modo seguro nos permite diagnosticar problemas cargando solo el editor, sin cargar el tema ni ningún otro plugin.
    • Barra de depuración. La barra de depuración añade un menú a la barra de administración que lista todas las plantillas que se están usando en la página que se está mostrando.
    Herramientas en Elementor: General
    Herramientas en Elementor: General

    II. Reemplazar URL

    Este es una de las funciones más importantes que ofrece Elementor y se suele utilizar cuando migramos nuestro sitio web de dominio o activamos el cretificado SSL (HTTP → HTTPS).

    Lo que hace esta herramienta es modificar todas las URLs antiguas por las URLs nuevas en la base de datos de manera que vuelva a funcionar todo correctamente con Elementor.

    Herramientas en Elementor: Remplazar URL
    Herramientas en Elementor: Remplazar URL

    III. Control de versiones

    En esta pestaña, Elementor nos ofrece la opción de reinstalar una versión "estable" del plugin anterior a la que estamos usando por si esta presenta algún problema de funcionamiento.

    Al instalar Elementor PRO, también nos ofrece la opción para este plugin.

    Herramientas en Elementor: Control de versiones
    Herramientas en Elementor: Control de versiones

    IV. Modo de mantenimiento

    El modo de mantenimiento nos permite configurar la típica página de "Sitio web en construcción".

    Ofrece 2 opciones:

    • Próximamente. Podemos crear una página indicándole a nuestros usuarios que nuestro sitio web está en construcción y en breve estará listo. Es una opción muy útil cuando trabajamos con nuestro sitio web online y no queremos que nadie vea lo que estamos haciendo.
    • Mantenimiento. Esta opción es más utilizada cuando ya tenemos un sitio web en producción y estamos realizando un rediseño.

    Para poner en marcha esta opción tenemos que crear previamente una Plantilla. En la lección, plantillas con Elementor, veremos que son las plantillas y cómo crearlas con Elementor.

    Herramientas en Elementor: Modo de mantenimiento
    Herramientas en Elementor: Modo de mantenimiento

    3. Gestor de perfiles

    En el apartado Elementor >> Gestor de perfiles, el plugin ofrece la opción de limitar el acceso según los perfiles que hayamos creado en nuestro sitio web.

    Esto es muy útil, si por ejemplo, tenemos un periódico digital y no queremos que algunos redactores tengan acceso a ciertos apartados de Elementor pero si al contenido.

    En la entrada, perfiles en WordPress, puedes encontrar información actualizada sobre la creación y gestión de usuarios y perfiles en un sitio web.

    Gestor de perfiles en Elementor
    Gestor de perfiles en Elementor

    4. Información del sistema

    En este apartado, Elementor nos ofrece un resumen de todos los detalles técnicos de nuestro sitio web como datos del servidor, temas y plugins instalados entre otros.

    5. Resto de opciones

    Los apartados fuentes personalizadas e iconos personalizados solo están disponibles con Elementor PRO. En futuras lecciones veremos cómo añadir fuentes e iconos personalizados, a nuestro sitio web, con Elementor.

    Anuncio publicitario

    6. Conclusión

    Ahora que ya has instalado Elementor y conoces a "grosso modo" lo que es capaz de hacer, comenzamos este fantástico curso con buen pié y con muchos ánimos.

    Nuevamente te recuerdo que vas a necesitar la versión PRO de Elementor. La puedes conseguir haciendo clic en este enlace: Elementor PRO, para aprovechar todo el contenido del curso.

    ¿Te ha gustado?

    Te estaría muy agradecido si pudieras valorar esta entrada y compartirla en tus redes sociales. De esta manera me animas a continuar trabajando en este proyecto y ayudas a otras personas que desean aprender.

    (16 votos, promedio: 4.9 de 5)

    Facebook
    Twitter
    WhatsApp
    Telegram
    Email

    ¿Me invitas un café?

    Todo el contenido que puedes encontrar en este sitio web es gratis y siempre lo será pero, mantenerlo, requiere de muchos cafés y muuuuchas horas . Si te gusta mi trabajo y te está ayudando, considera invitarme un café para apoyarme y apoyar este proyecto. ¡Te invito un café!.

    Suscríbete y aprende WordPress desde cero

    No me gusta el SPAM y se que a ti tampoco. Sólo recibirás información útil sobre WordPress.

    Al enviar, confirmas que has leído y aceptas la política de privacidad. Conoce nuestro compromiso con tu privacidad.

    Comparte tu experiencia

    Deja un comentario si tienes alguna duda o cuéntanos cómo ha sido tu experiencia.

    Suscríbete!
    Avísame sobre

    3 Comentarios
    Inline Feedbacks
    Ver todos los comentarios

    No he acabado el curso ,pero, vas por buen camino.

    Hola amigo, pero que buen tutorial has hecho :). Maestro, te queria consultar si tienes en la web los pasos para poder usar elementor pro en localhost (xampp). Te lo agradeceria mucho, ya que llevo mucho buscando en la web esta info.

    Hola Chris, gracias por tu comentario. Has llegado al lugar indicado. Estoy comenzando a desarrollar un curso de WordPress en Local donde usaremos el programa Local (olvídate de XAMPP). Esta semana sale a la luz las primeras lecciones con vídeos incluidos. No olvides suscribirte al blog para que estés al tanto de las novedades y a mi canal de YouTube que comienza esta semana https://www.youtube.com/channel/UChE9lmpc71kQLF-W5HG-mMg?sub_confirmation=1. Saludos!

    3
    0
    ¿Dejas un comentario? Gracias!x

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Suscribirte a la lista de correos electrónicos.
    • Derechos: Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en legal@cursowordpress.com, así como el derecho a presentar una reclamación ante una autoridad de control.
    • Destinatarios: Los datos no se cederán a terceros salvo en los casos en que exista una obligación legal.
    • Información adicional: En mi política de privacidad encontrarás información adicional sobre la recopilación y el uso de su información personal incluida información sobre acceso, conservación, rectificación, eliminación, seguridad y otros temas.

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Moderar y responder comentarios de usuarios.
    • Derechos: Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en legal@cursowordpress.com, así como el derecho a presentar una reclamación ante una autoridad de control.
    • Destinatarios: Los datos no se cederán a terceros salvo en los casos en que exista una obligación legal.
    • Información adicional: En mi política de privacidad encontrarás información adicional sobre la recopilación y el uso de su información personal incluida información sobre acceso, conservación, rectificación, eliminación, seguridad y otros temas.