page builder : elementor

17 Pages·2017·0.74 MB·Spanish

PAGE BUILDER : ELEMENTOR
(TALLER 3)
#TRIBUCAMP2018 @RAIOLANETWORKS
ÍNDICE
1. ¿Qué es un maquetador web?.
1.1 Ventajas y desventajas.
1.2 Maquetadores web para WP: Gratuitos.
1.3 Maquetadores web para WP: De pago.
2. ¿Qué es Elementor?.
3. Cómo descargar e instalar Elementor.
4. Interfaz de Elementor.
4.1 Configuración inicial.
4.2 Herramientas de diseño: Componentes básicos.
4.2.1 Secciones
4.2.2 Columnas
4.2.3 Widgets
5. Mis primeros pasos con Elementor: caso práctico
#TRIBUCAMP2018 @RAIOLANETWORKS
1. ¿QUÉ ES UN MAQUETADOR WEB?
Un maquetador web (también llamado “constructor” o
“page builder”) es una herramienta que permite construir
una web de manera rápida y fácil (a través de un sistema
drag&drop) mejorando la visualización de los contenidos y
ampliando funcionalidades del theme instalado.
Fig 1: Page Builder - Elementor
#TRIBUCAMP2018 @RAIOLANETWORKS
1. 1 VENTAJAS Y DESVENTAJAS
VENTAJAS DESVENTAJAS
1. No necesitas saber ni 1. Generan código
de programación ni de ineficiente.
CSS.
2. Shortcodes.
2. Fácil de usar
3. Relentizan tu web.
3. Ahorras tiempo.
4. Ahorras dinero.
#TRIBUCAMP2018 @RAIOLANETWORKS
1.2 GRATUITOS
Pagebuilder by SiteOrigin: Live Composer Site Builder: Elementor:
https://siteorigin.com/page-builder/ https://livecomposerplugin.com/ https://elementor.com/
Unyson by ThemeFusion:
https://es.wordpress.org/plugins/unyson/
#TRIBUCAMP2018 @RAIOLANETWORKS
1.3 PREMIUM (DE PAGO)
Visual Composer Fusion Builder de Avada Elementor PRO Divi Builder
visualcomposer.io avada.theme-fusion.com/fusion-builder-2/ elementor.com elegantthemes.com/plugins/divi-builder/
Themify Builder: Awesome Builder Thrive Architect Beaver Builder
themify.me/builder codecanyon.net/item/awesome-builder- thrivethemes.com/architect/ wpbeaverbuilder.com
drag-drop-page-builder/663958
#TRIBUCAMP2018 @RAIOLANETWORKS
2. ¿QUÉ ES ELEMENTOR? ( I )
Elementor es un maquetador web visual o “visual page
builder” para WordPress creado por Pojo.me. Permite
crear las páginas o entradas en WordPress de una manera
visual y en directo.
Página web: https://elementor.com
Disponible en varios idiomas: Entre ellos el español
Versión FREE y versión PRO (Premium)
#TRIBUCAMP2018 @RAIOLANETWORKS
2. ¿QUÉ ES ELEMENTOR? ( II )
Ventajas de Elementor con respecto a otros plugins:
• Diseñamos en vivo y en directo, tanto para desktop, tablet
como móvil.
• Facilidad de uso.
• Es rápido (su peso es menor que el de otros
maquetadores).
• Compatible con muchas plantillas.*
• Puedes crear plantillas y reutilizarlas.
*https://docs.elementor.com/article/78-themes
#TRIBUCAMP2018 @RAIOLANETWORKS
2.1 CÓMO DESCARGAR E INSTALAR ELEMENTOR
Podemos descargar la versión gratuita de Elementor
desde:
• Página web: https://elementor.com
Vamos a : Dashboard WordPress > Plugins > Añadir nuevo > Subir plugin > seleccionamos el archivo y pulsamos en instalar
• Desde el repositorio de plugins de WordPress
Vamos a : Dashboard WordPress > Plugins > Añadir nuevo > buscamos Elementor y lo instalamos.
#TRIBUCAMP2018 @RAIOLANETWORKS
2.2 INTERFAZ : CONFIGURACIÓN INICIAL
Mi biblioteca: Gestión de plantillas.
Ajustes: Gestión de ajustes generales
del plugin.
Herramientas: Control de versiones,
sincronización, modo mantenimiento...
Información del sistema: Recopila la
información sobre el sistema.
#TRIBUCAMP2018 @RAIOLANETWORKS