Clase 05.

WORDPRESS
Elementor - Primera Parte
RECUERDA PONER A GRABAR LA
CLASE
 ● Instalar Elementor.
● Conocer el editor.
OBJETIVOS DE LA CLASE ● Crear páginas de Elementor.
Instalación y configuración de
Elementor
¿Qué es Elementor?
Es un generador de sitios web.
Elementor permite a los usuarios
de WordPress crear y editar sitios
web mediante el uso de la
técnica de arrastrar y soltar,
con un modo de respuesta
incorporado, es decir viendo
cambios en vivo y directo.
 ¿Por qué usar Elementor?
● Es uno de los plugins más sencillos de manejar.
● Puedes crear una página web sin lanzar una línea de
código.
● Elementor es uno de los page builders de WordPress o
maquetadores visuales más famosos a la fecha.
● Es veloz y ágil para armar tu página.
● Puedes ver los cambios en vivo, en el front.
 ¿Por qué usar Elementor?
● Fácil para migrar.
● La versión gratuita de Elementor te da 40 plantillas y 30
widgets básicos. Los widgets gratuitos incluyen
características geniales como carruseles de imágenes y
elementos HTML personalizados.
Instalar Elementor
Ir a Plugins -> Añadir Nuevo -> Buscar: Elementor.
Salteamos los settings predefinidos.
Configurar Elementor
Ir a Elementor -> Ajustes-> General
 Elementos de Configuración
● Pestaña General:
○ Tipos de contenido: Son los tipos de contenido (entradas y páginas)
donde se puede utilizar el plugin.
○ Desactivar colores por defecto: Con Elementor puedes configurar una
paleta de colores "base" para utilizarlos en tu sitio web: color primario y
secundario, color del texto y color de los enlaces, como se hace con los
temas.
○ Desactivar fuentes por defecto: Elementor cuenta con una extensa
librería de fuentes, incluyendo las fuentes de Google, para configurar las
fuentes predeterminadas del sitio web.
 Elementos de Configuración
● Pestaña Estilo:
○ En Elementor 3 se integraron los estilos en el editor, permitiendo mayor control.

1 2 3
 Elementos de Configuración
● Pestaña Avanzado:
○ La pestaña de avanzado no se modifica debido a que altera las
configuraciones de accesos a los archivos de Elementor.
○ Métodos de impresión de CSS: Donde guardamos el código CSS
generado. Lo recomendable es en un fichero externo.
○ Cambio del método de carga del editor: Por defecto dejamos en
Desactivar, pero lo podemos activar cuando no nos carga el editor de
Elementor.
 Elementos de Configuración
● Pestaña Avanzado:
○ Controladores de edición: Activando esta opción, simplemente con
pasar el cursor por un widget se desplegarán las opciones del mismo. Tu
decides cual es la opción más cómoda para ti.
○ Activar subidas de SVG: Si activamos esta opción, Elementor nos
permitirá subir ficheros tipo SVG
(http://multimedia.uoc.edu/blogs/labeines/es/introduccio/format-svg-i-ex
portacio-des-de-diferents-programes/). Recomendamos no activarla por
motivos de seguridad.
○ Cargar compatibilidad con Font Awesome 4: Si usas este tipo de
iconos, activa esta opción.
 Instalar Elementor
Vamos a instalar y configurar Elementor
Tiempo: 15 minutos
Editor de Elementor
 1

2
Una vez instalado y configurado Elementor, podemos comenzar a editar
nuestras páginas y entradas.
 3

Así se verá el esquema principal

Componentes de
Elementor
Elementor cuenta con varios elementos en la versión
gratuita y más en en la versión Pro.

Con los elementos de la versión gratuita se puede

maquetar una página web. Entre los básicos están:

● Cuadro de imagen
● Cuadro de texto
● Secciones
● Imágenes
● Galería de imágenes

Curso de Elementor #5. Elementos generales

 ☕
BREAK
¡5/10 MINUTOS Y VOLVEMOS!
Si adquiriste un servicio de talento,
recordá chequear tu correo de
spam, no deseado, publicidad y/o
social.
En caso de no haberlo recibido, escribinos a [email protected]

¡5/10 MINUTOS Y VOLVEMOS!

Páginas de Elementor
Crear una página
Vamos a maquetar una página
 CREAR UNA PÁGINA
Maquetar una página con Elementor
Tiempo: 15 minutos
¿PREGUNTAS?
 ¡MUCHAS GRACIAS!
Resumen de lo visto en esta clase:
- Instalar Elementor.
- Conocer el editor.
- Crear páginas de Elementor.
OPINA Y VALORA ESTA CLASE
#DEMOCRATIZANDOLAEDUCACIÓN