Cómo usar Elementor: una guía para principiantes

Nuevo en el elemento? En esta publicación le mostraremos cómo usarlo. Como sugiere el título, este artículo está dedicado a los principiantes, a aquellos que son completamente nuevos en el elemento. Si ha estado usando Elementor durante algún tiempo, puede visitar esta página para encontrar algunos tutoriales intermedios para avanzar. Asumiremos que ha instalado y activado Elementary en su sitio web de WordPress. Si no ha hecho esto, puede descargar Elementor del director oficial de WordPress Plugins. O, si desea usar la versión Pro, puede descargarla desde el sitio web de Elementor.
contenido
Cómo usar el elemento: nociones introductorias
Edición de una sección, columna y widget
Edición de una sección
Edición de una columna
Edición de un widget
puntas
Trabajando con plantillas
Cómo usar una plantilla elemental
Cómo importar una plantilla elemental desde un archivo JSON
1. A través de la biblioteca de plantillas
2. A través del administrador de plantillas
Cómo crear una plantilla elemental
1. A través del editor de plantillas
2. A través del administrador de plantillas
conclusión
Cómo usar Element: Introductive Notion El Elementor es un complemento de generación de páginas que le permite crear una hermosa página en su sitio de WordPress sin tener que lidiar con CSS o HTML. Elementor viene con un editor visual Drag-by-Drop. Para crear una página, solo debe agregar los elementos de diseño (llamados widgets) desde el panel de widgets al área de lienzo. Elementor funciona tanto en la publicación como en la página.
Tres elementos que debe saber antes de comenzar a crear la primera página con Elementor:
Widget: el elemento de diseño real que usará para crear su página.
Columna: un contenedor más pequeño para colocar widgets. Sección: el contenedor más grande para alojamiento columnas y widgets.
Para comenzar a usar Elementor, simplemente cree una página (páginas -> Agregar nueva) o una nueva publicación (publicaciones -> Agregar nuevo). Dale a tu página/publica un título como de costumbre y haga clic en el botón Editar con Elementor. Esto abrirá el editor primario.

Antes de comenzar a crear la página, primero puede configurar el aspecto de la página. Para hacer esto, haga clic en el icono de la rueda en la esquina inferior izquierda del panel del widget (panel a la izquierda). Establezca el aspecto de la página en la página de la página del bloque de configuración general.

Puede seleccionar un aspecto de acuerdo con el concepto de diseño que desea crear. Por ejemplo, si desea crear una página de ancho completo, puede seleccionar la opción de ancho Elementer. Una vez que haya terminado de configurar la página, agregue una nueva sección haciendo clic en el botón Plus en el área de lienzo. Cuando agrega una nueva sección, puede seleccionar una estructura de columna. Hay doce estructuras de columnas ofrecidas por el elemento.

Una vez que la sección y las columnas estén listas, puede comenzar a agregar widgets. Hay más de noventa widgets ofrecidos por la primaria que puede encontrar en el panel de widgets. Para agregar uno, tírelo del panel de widget en una columna en el área de lienzo.

Edición de una sección, columna y un widget Después de agregar una sección, columna o widget, puede editarla a través del panel de widgets. Edición de una sección Para editar la sección, debe transformar la sección que desea editar en una forma de edición haciendo clic en el mango de la sección. Una vez que la sección se transforma en un modo de edición, puede acceder al panel de widgets para editar la sección. Hay tres pestañas con las que puede trabajar (apariencia, estilo y avanzado). Cada pestaña consta de varios bloques y cada bloque contiene varias opciones de configuración.

Tomemos un ejemplo. Supongamos que desea agregar un divisor en forma. Para hacer esto, vaya a la pestaña de estilo y abra el bloque de divisor de forma. Establezca la ubicación del divisor del formulario (superior o botón) y seleccione un divisor de formulario que desee. Después de seleccionar un divisor en forma, puede establecer el color, el ancho y la altura.

Si desea establecer los rellenos y los bordes, puede abrir el bloque avanzado desde la pestaña avanzada.

Edición de una columna y la sección, debe convertir una columna en un modo de edición antes de poder editarla. Haga clic en el mango de la columna para convertir una columna en un modo de edición.

También hay tres pestañas con las que puede trabajar: apariencia, estilo y avanzado. Para establecer el ancho de la columna, puede establecer el valor en la opción del ancho de la columna en el aspecto de la pestaña de aspecto. O puede tirar del separador en el área de lienzo.

Para cambiar el color de fondo, puede bloquear el fondo en la pestaña de estilo. Editar un widget primero convierta un widget en una forma de edición antes de comenzar a editarlo. Haga clic en el mango del widget para convertir un widget en un modo de edición. La configuración disponible en un panel de widget puede variar según el widget que edite. Por ejemplo, el widget de formulario tiene los siguientes bloques en la pestaña de contenido.

Mientras que el widget del botón solo tiene un bloque en la pestaña de contenido.

Para dar estilo a un widget, puede acceder a la pestaña de estilo. Nuevamente, los bloques y las opciones de estilo disponibles en la pestaña Estilo son variadas según el widget que edite. Cuantos más componentes, más componentes, más bloques y opciones de estilo ofrecen.

Tomemos un ejemplo. Supongamos que desea cambiar el color del texto y la tipografía del botón. Haga clic en el botón Widget Widget y vaya a la pestaña Estilo del panel de widgets. Para cambiar la tipografía (tamaño de fuente, estilo de fuente y familia), haga clic en el icono del lápiz en la opción de impresión. Mientras establezca el color del texto, haga clic en el selector de color en la opción Color de texto.

puntas

Para que sea más fácil saltar entre secciones, columnas y widgets, puede usar la función Navigator. Desde el navegador, también puede convertir una sección, columna o widget en modo de edición, haciendo clic en él. La función Navigator es bastante útil si crea una página compleja que consta de varias secciones y docenas de widgets. Puede activar el navegador haciendo clic en el icono de sándwich en la parte inferior del panel de widgets.

Una vez que haya terminado de editar la página, puede publicarla haciendo clic en el botón de publicación en la parte inferior del panel de widgets. También puede obtener una vista previa de la página haciendo clic en el icono de los ojos. Puede seleccionar un tipo de dispositivo que desee obtener una vista previa haciendo clic en el icono del dispositivo junto al icono del ojo. Para guardar la página como un boceto, haga clic en el icono de flecha junto al botón de publicación y seleccione la salvación de boceto.

Para volver al tablero de WordPress, puede hacer clic en las tres líneas en la esquina superior izquierda en el panel de widgets y hacer clic en el botón Salir a Tableau.
Trabajando con plantillas, además de crear una página desde cero, también puede crear una página a partir de una plantilla. Elementor ofrece muchas plantillas prefabricadas que puede usar. Hay nueve tipos de plantillas ofrecidas por el elemento:

Plantilla de página

Plantilla de sección

Plantilla emergente

Mostrar Encabezado
Plantilla de sótano
Una sola plantilla
Plantilla de archivo
Plantilla de producto única
Plantilla de archivo de productos
Cómo usar una plantilla elemental en el área de tela de Elementor, verá dos botones: el botón más y un botón con un icono de carpeta. Haga clic en el botón con el icono de la carpeta para abrir la biblioteca de plantillas Elementor. Busque una plantilla que desee usar. Una vez encontrado, cruce el mouse en la plantilla y haga clic en el botón Insertar. La plantilla se cargará en el lienzo elemental.
Además de usar las plantillas ofrecidas por el elemento, también puede usar una plantilla de una fuente de terceros. Elementor permite a sus usuarios exportar una plantilla a un archivo externo en formato JSON. Cómo importar una plantilla elemental de un archivo JSON Hay dos formas de importar un elemento desde un archivo JSON. 1. A través de la biblioteca de plantillas, abra la biblioteca de plantillas haciendo clic en el icono de carpeta en el área de lienzo. Una vez abierto, haga clic en el icono de flecha seguido del botón Seleccionar archivo para seleccionar el archivo JSON que desea importar. Puede encontrar la plantilla que acaba de importar en mis plantillas en la biblioteca de plantillas. Recarga la plantilla haciendo clic en el icono de recarga si la plantilla que acaba de importar no aparece. Pase el mouse sobre una plantilla y haga clic en el botón Insertar para cargarlo en el lienzo Elementer
2. A través de las plantillas desde el tablero de WordPress, vaya a plantillas -> plantillas guardadas. Haga clic en el botón Importar plantillas seguido del botón Elija el archivo para seleccionar el archivo JSON y haga clic en el botón Importar ahora para importarlo.
Cómo crear una plantilla elemental También hay dos formas de crear una plantilla elemental. 1. A través del editor de plantillas después de haber terminado de crear una página, haga clic en el icono de flecha junto al botón de publicación en la parte inferior del panel de widgets y seleccione rescate como plantilla.
Dé un nombre de plantilla y haga clic en el botón Guardar.

Después de hacer clic en el botón Guardar arriba, se le dirigirá a las plantillas de mis plantillas en la biblioteca de plantillas. Haga clic en el icono de tres puntos en una plantilla y seleccione Exportar para exportarlo a un archivo JSON.2. A través de las plantillas en el tablero de WordPress, vaya a plantillas -> plantillas guardadas. Haga clic en el botón Agregar nuevo en la parte superior para crear una nueva plantilla. En la ventana de diálogo que aparece, seleccione el tipo de plantilla que desea crear, proporcione un nombre a la plantilla y haga clic en el botón Crear plantilla. Se le dirigirá al editor elemental para crear la plantilla.

Después de haber terminado de crear su plantilla, haga clic en el botón de publicación en la parte inferior del panel de widgets. Para acceder a la plantilla que acaba de crear, puede acceder a plantillas -> plantillas guardadas. Pase el mouse sobre una plantilla y haga clic en el enlace de plantilla de exportación para exportarlo a un archivo JSON.

La conclusión del tutorial anterior es el uso básico del elemento. Puede usar Elementor además de la simple creación de una página web. También puede usar Elementor para crear un encabezado personalizado, un sótano personalizado, una plantilla de publicación única personalizada, un producto único personalizado (si usa WoCommerce), etc. Incluso puede usar Elementor para crear ventanas emergentes. Tenemos algunos elementos separados a los que puede consultar.

Cómo crear un encabezado personalizado con Elementor

Cómo crear un sótano personalizado con Elementor

Cómo crear una plantilla post -poste única con elemento con elemento

Cómo crear una página de producto única con Elementor