Más

    Cómo crear diseños personalizados de WordPress con Elementor

    - Advertisement -

    ¿Quieres crear tus propios diseños de página personalizados en WordPress?

    Elementor es un creador de páginas de WordPress del tipo arrastrar y soltar que le permite diseñar fácilmente diseños personalizados de WordPress sin tener ningún conocimiento de codificación.

    En este artículo, le mostraremos cómo crear fácilmente diseños personalizados de WordPress con Elementor con solo unos pocos clics.

    Cómo crear diseños personalizados de WordPress con Elementor
    ¿Por qué y cuándo necesita diseños personalizados de WordPress?

    Muchos temas de WordPress gratuitos y premium vienen con múltiples opciones de diseño para diferentes tipos de páginas. Sin embargo, a veces ninguno de estos diseños cumplirá con sus requisitos.

    Si sabe codificar en PHP, HTML y CSS, puede crear sus propias plantillas de página o incluso crear un tema secundario para su sitio. Sin embargo, la mayoría de los usuarios de WordPress no son desarrolladores, por lo que esta opción no les funciona.

    ¿No sería fantástico si pudieras diseñar diseños de página usando una interfaz de arrastrar y soltar?

    Esto es exactamente lo que hace Elementor. Es un complemento de creación de páginas de WordPress de arrastrar y soltar que le permite crear fácilmente sus propios diseños personalizados de WordPress sin conocimientos de codificación.

    Tiene una interfaz de usuario intuitiva que le permite crear diseños personalizados con una vista previa en vivo. Viene con muchos módulos listos para usar para todo tipo de elementos de diseño web.

    Elementor tiene varias plantillas diseñadas profesionalmente que puedes cargar y usar instantáneamente como punto de partida. Funciona con todos los temas de WordPress compatibles con los estándares y es compatible con todos los complementos populares de WordPress.

    Dicho esto, echemos un vistazo a cómo crear diseños personalizados de WordPress con Elementor.

    Comenzando con Elementor

    Primero, deberá comprar el complemento Elementor Pro. Es la versión paga del complemento gratuito Elementor y le brinda acceso a funciones adicionales y 1 año de soporte.

    A continuación, deberá instalar y activar el complemento Elementor. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

    Tras la activación, debe visitar el Elementor » Configuración página para configurar los ajustes del complemento.

    Habilite Elementor para diferentes publicacionesHabilite Elementor para diferentes publicaciones

    Aquí puedes habilitar Elementor para diferentes tipos de publicaciones. De forma predeterminada, está habilitado para sus publicaciones y páginas de WordPress. Si tiene tipos de publicaciones personalizadas en su sitio, también aparecerán aquí y también podrá habilitarlas.

    Puede excluir o incluir roles de usuario que pueden usar Elementor al escribir publicaciones o páginas. De forma predeterminada, el creador de páginas está habilitado solo para administradores.

    Luego, no olvide hacer clic en el botón ‘Guardar cambios’ para almacenar su configuración.

    Creación de diseños personalizados de WordPress con Elementor

    Primero, debe crear una nueva página o publicar en su sitio de WordPress. En la pantalla de edición de publicaciones, verá el nuevo botón ‘Editar con Elementor’.

    Editar con ElementorEditar con Elementor

    Al hacer clic en él, se iniciará la interfaz de usuario de Elementor, donde podrá editar su página utilizando el creador de páginas de arrastrar y soltar de Elementor.

    Puedes agregar secciones y crear tu página desde cero, o puedes elegir una plantilla.

    Editar una página con ElementorEditar una página con Elementor

    Las plantillas le brindan una forma rápida y sencilla de comenzar. Elementor viene con varias plantillas diseñadas profesionalmente que puedes personalizar tanto como quieras.

    Comencemos con una plantilla haciendo clic en el botón ‘Agregar plantilla’.

    Esto abrirá una ventana emergente donde podrá ver las diferentes plantillas que están disponibles. Debes buscar una plantilla que sea similar a la que deseas para el diseño de tu página.

    En nuestro ejemplo, estamos analizando plantillas de 404 páginas.

    Seleccione una plantilla en ElementorSeleccione una plantilla en Elementor

    Ahora, debe hacer clic para seleccionar la plantilla que le guste y luego hacer clic en el botón ‘Insertar’ para agregarla a su página.

    Elementor ahora cargará la plantilla por usted.

    Ahora puede comenzar a editar la plantilla para adaptarla a sus necesidades. Simplemente apunte y haga clic en cualquier elemento para seleccionarlo, y Elementor le mostrará su configuración en la columna de la izquierda.

    Señala cualquier elemento y edítaloSeñala cualquier elemento y edítalo

    Cómo funcionan los diseños de Elementor

    Ahora, hablemos de cómo funcionan los diseños de Elementor.

    Los diseños de Elementor se crean utilizando secciones, columnas y widgets. Las secciones son como filas o bloques que colocas en tu página.

    Cada sección puede tener varias columnas y cada sección y columna puede tener sus propios estilos, colores, contenido, etc.

    Puede agregar cualquier cosa en sus columnas y secciones usando los widgets de Elementor. Estos widgets son diferentes tipos de bloques de contenido que puedes colocar en tus secciones de Elementor.

    Simplemente seleccione un widget y suéltelo en su sección o columna. Hay un amplio conjunto de widgets disponibles que cubren todos los elementos populares de diseño web que se te ocurran.

    Agregar bloques al diseñoAgregar bloques al diseño

    Puede agregar imágenes, texto, encabezados, galerías de imágenes, videos, mapas, íconos, testimonios, controles deslizantes, carruseles y mucho más.

    También puede agregar widgets predeterminados de WordPress e incluso widgets creados por otros complementos de WordPress en su sitio. Por ejemplo, si está utilizando Formularios WP para crear diferentes formularios para su sitio, puede usar su widget en Elementor.

    Una vez que haya terminado de editar, puede hacer clic en la flecha al lado del botón «Publicar» para ver diferentes opciones de guardado.

    Haga clic en las opciones de guardarHaga clic en las opciones de guardar

    Nota: Guardar un diseño de página no publicará la página en su sitio de WordPress, pero la guardará.

    Ahora puede obtener una vista previa de su página o ir al panel de WordPress.

    Esto lo llevará de regreso al editor de publicaciones de WordPress. Ahora puede guardar su página de WordPress o publicarla en su sitio web.

    Actualizar o publicar página editada con ElementorActualizar o publicar página editada con Elementor
    Creando tus propias plantillas en Elementor

    Elementor le permite guardar sus propios diseños personalizados como plantillas. De esta manera, puedes reutilizar tus propias plantillas para crear nuevas páginas aún más rápido en el futuro.

    Simplemente edite la página que desea guardar como plantilla con Elementor.

    En la interfaz del generador de Elementor, haga clic en la flecha al lado del botón «Publicar». Ahora verás más opciones para guardar tu publicación. Simplemente haga clic en la opción «Guardar como plantilla».

    Opción Guardar como plantilla en ElementorOpción Guardar como plantilla en Elementor

    Esto abrirá una ventana emergente donde deberá proporcionar un nombre para su plantilla.

    Después de ingresar el nombre, haga clic en el botón «Guardar».

    Guarde su página en la bibliotecaGuarde su página en la biblioteca

    La próxima vez que cree un diseño de página personalizado, podrá seleccionarlo en la pestaña «Mis plantillas».

    Todo lo que tiene que hacer es hacer clic en el botón ‘Insertar’ para su diseño de página personalizado.

    Ver diseño de página en la bibliotecaVer diseño de página en la biblioteca

    También puedes exportar esta plantilla y usarla en otros sitios de WordPress usando Elementor.

    Simplemente haga clic en el ícono de 3 puntos y luego haga clic en la opción ‘Exportar’.

    Exportar plantilla de diseño de páginaExportar plantilla de diseño de página

    Desde aquí, puede descargar la plantilla a su computadora.

    Alternativas de Elementor para crear diseños personalizados

    Además de Elementor, existen otros creadores de páginas de destino y sitios web que le permiten crear diseños personalizados para su sitio.

    Estas son algunas de las mejores alternativas de Elementor que puede utilizar:

    • SemillaProd es el mejor creador de sitios web de WordPress de arrastrar y soltar que le permite crear diseños personalizados para sus páginas de destino. Hay más de 300 plantillas de temas o páginas de destino para elegir. SeedProd también ofrece toneladas de opciones de personalización y bloques para crear páginas impresionantes. Para obtener más detalles, puede ver nuestra revisión completa de SeedProd.
    • Divi es un tema visual y un creador de páginas. Lleva más de 14 años en la industria y ofrece diferentes funciones para crear diseños de WordPress, incluida una biblioteca de diseños. Hay muchas opciones de personalización en el generador visual y no es necesario editar ningún código.
    • Prosperar arquitecto es un creador de páginas potente y apto para principiantes que puedes utilizar para crear hermosos diseños. Viene con más de 352 plantillas y muchas opciones de personalización. Puede utilizar su generador visual de interfaz para editar cualquier elemento de la página. Para obtener más detalles, consulte nuestra revisión de Thrive Architect.
    • Beaver Builder es otro creador de páginas popular de arrastrar y soltar para WordPress. Es fácil de usar y puede configurar fácilmente diseños para páginas y publicaciones utilizando Beaver Builder. También ofrece plantillas prediseñadas para páginas de destino, pero no hay tantas como SeedProd o Divi.

    Esperamos que este artículo te haya ayudado a aprender cómo crear diseños personalizados de WordPress con Elementor. Es posible que también desee ver nuestra comparación experta de Elementor, Divi y SeedProd y nuestras selecciones del mejor software de diseño web.

    Si te gustó este artículo, suscríbete a nuestro Canal de Youtube para tutoriales en vídeo de WordPress. También puedes encontrarnos en Gorjeo y Facebook.


    Fuente: Cómo crear diseños personalizados de WordPress con Elementor

    Populares

    Más de esta categoría

    DEJA UNA RESPUESTA

    Por favor ingrese su comentario!
    Por favor ingrese su nombre aquí

    Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.