Creación de un sitio web personalizado: Uso avanzado del editor Elementor y del tema WoodMart (05)

En el número anterior se presentóIntroducción básica al editor ElementorEmparejado con el tema WoodMart, hoy vamos a sumergirnos en cómo utilizar el editor Elementor con el tema WoodMart para una personalización más avanzada del diseño de sitios web. Tanto si eres nuevo en el diseño como si tienes experiencia y buscas un diseño más refinado, este post te proporcionará pasos prácticos y consejos.

Pasos: Front-end del sitio → Editar con Elementor → deslizar al frente del pie de página.(o la adición de un módulo podría ser)

Como se muestra arriba, hay cuatro botones, a saber, Añadir, Archivo de plantilla, ai Build, Opciones de plantilla de tema

En general, el uso de la mayoría es la primera, la segunda plantilla de archivo, a menos que guarde un módulo, y luego quieren añadir a una ubicación determinada, pero esto pertenece a la configuración de alto nivel, el principiante en general no se puede utilizar, la tercera ai construir no se recomienda utilizar, el cuarto tema de plantillas, de acuerdo con el tema no es lo mismo, por supuesto, el contenido de los diferentes, lo anterior muestra el tema WoodMart

Cuando pulsamos en añadir nos aparecen las siguientes opciones

El estilo del contenedor mostrado arriba puede seleccionarse en función de la situación real.

Tienen una diferencia obvia es que Grid (rejilla) se requiere para establecer la primera para establecer la segunda cuadrícula, Flexbox (caja flexible) no es necesario, pero habrá una diferencia, es que si se agrega una caja flexible comenzó a seleccionar sólo el conjunto, no por separado, seleccione dos o tres, no puede seleccionar, a menos que vuelva a agregar, pero si se trata de una cuadrícula que puede cambiar entre múltiples formatos a ti mismo. La gente de acuerdo a la situación real para elegir

Después de añadir un contenedor, hay tres botones en la parte superior del contenedor: Añadir, Editar y Cerrar.

Anteriormente en el artículo se dijo que cualquier adición de contenedores también son capaces de añadir contenedores, excepto para el pie de página en la parte inferior de la página, que puede ser añadido.

El segundo es el editor, que tiene algunas opciones para la configuración del contenedor.

El tercero está cerrado, no hace falta decir más

Centrémonos en la segunda edición, como sigue

Los demás están enPrevious Previous post.¡Han introducido en no decir, como se muestra arriba, esta función no se utiliza generalmente por los principiantes, pero si desea contenedores más bella o ajustar la diversidad debe ser, de hecho, la traducción está escrito muy claramente, por lo que es fácil de entender, el cuadro rojo tiene un proyecto, hay una dirección a continuación, la imagen de arriba muestra hacia abajo, porque se agrega el contenedor está seleccionado es hacia abajo el otro son algunos de la orientación de la pantalla, vamos de acuerdo a la situación real para ajustar!

El estilo también está enArtículo anteriorPresentado, y no mucho más que decir aquí

Una de las características tácitas de la narrativa actual avanzada

¡Como se muestra arriba, con el fin de comprender mejor, yo uso la imagen china que decir, debería ser mejor para entender algunos de los chinos básicos han explicado las opciones, debemos ser "pegajosa" más confundido, porque la traducción es inexacta, de hecho, en el envase se puede optar por fijar la parte superior o la parte inferior, o el significado de no fijo!

¡Transformar: Contenedor (Contenedor) de algunos efectos especiales, vamos de acuerdo a la traducción de elegir, por lo general no tienen que moverse!

Contenedor punto de añadir, puede elegir el módulo, el lado izquierdo tendrá el contenedor (Layout), y la función básica (Basic), y elElementor Características de la versión PRO (Pro)

Las funciones básicas de cada tema son diferentes, si su sitio tiene otros plug-ins, también será en la función básica de la pantalla

¡Pero las funciones básicas para satisfacer su construcción básica de un sitio web, puede no ser lo suficientemente hermoso, y efectos de colores, entonces usted necesita para Pro versión de pago para lograr, es necesario añadir lo que el módulo, haga clic en el módulo que necesita para arrastrar al contenedor en el interior!

Descripción del módulo:

Pasos: front-end del sitio web → Editar con Elementor → Contenedor (Container) → Encabezado (Heading).

¡Encabezado: título, entendido como un gran título, la siguiente tabla, se puede establecer el título del texto (Título), así como el enlace (enlace) y el tamaño del título (HTML Tag), así como la dirección del título (Alineación), el título del color (Color del texto), el diseño de fuente (Tipografía) tamaño o estilo de fuente, tamaño y así sucesivamente!

Pasos: Front-end del sitio → Editar con Elementor → Contenedor (Container) → Editor de texto.

Editor de texto: editor de texto (si el texto es más recomendable utilizar este, como la introducción de algunos productos, la introducción de la empresa, etc) el siguiente cuadro, el contenido del texto, la separación de texto (Columnas), puede ser interpretado como el texto de todo el contenedor para ocupar el número de espacios entre columnas (si usted no tiene que configurar la separación de texto, no es necesario ajustar)

Como se muestra arriba, también hay un estilo de editor de texto que le permite ajustar el esquema de color, la orientación del texto, el color del título del texto, la disposición del texto, la alineación del contenido, el ancho del contenido, etc.

Pasos: Front-end del sitio → Editar con Elementor → Contenedor (Container) → Editor de texto.

imagen:Fotos

Choose lmage: elige una imagen, puedes optar por subirla desde la mediateca de la web o localmente

Resolución de la imagen: el tamaño de la resolución de la imagen, puede elegir entre una gama muy amplia de resoluciones.

Leyenda: título, puede mostrarse o no mostrarse

Enlace: enlace, puede mostrar un enlace personalizado o un enlace multimedia

¡Como se muestra arriba, Alineación (posición de la imagen) Anchura (anchura de la imagen), Anchura máxima (anchura máxima de la imagen), Altura (altura de la imagen) Normal (estado por defecto), Hover (estado hover, estado clic del ratón) dos estados diferentes se pueden ajustar, y el otro de acuerdo con la traducción de la comprensión en la línea!

Pasos: Contenedor (Container) → seleccionar el diseño de dos columnas → cuadrícula de selección de imágenes en forma de seleccionar dos columnas.

Si quieres conseguir el efecto que se muestra arriba, tienes que utilizar la función Avanzada de la imagen.Tenga en cuenta que se trata de la imagen, no del contenedor.¡Si necesita establecer el valor de desplazamiento en el Margen (marco exterior) en la siguiente figura, pero por favor desconecte los símbolos del enlace, si no se desconecta entonces las cuatro direcciones se cambian juntos, como la figura anterior, un sesgo a la izquierda hacia abajo, un sesgo a la derecha hacia arriba, en la dirección correspondiente para establecer el valor en la línea!

Por supuesto hay una forma sencilla que es hacer una foto de este tipo de inserción directa, será más sencillo que mi método, elegimos según necesidad

Pasos: Front-end del sitio → Editar con Elementor → Contenedor (Container) → Botón.

¡Botón: botón, puede saltar al botón de enlace, es una característica esencial, y hermoso!

Tipo, generalmente el predeterminado, también puede elegir otros

Texto (nombre del botón), escriba según proceda

Botón de enlace para saltar a un enlace

Icono (icono), puede establecer el icono o ningún icono, dependiendo de la situación real para ajustar el

Botón lD (ID de botón), por lo general no es necesario configurar el

Posición: la dirección del botón

Tipografía: disposición de los botones

Color del texto: color del texto
Tipo de fondo
Color

Normal: Por defecto
Hover: Hover

Dos estados diferentes se ajustan por separado

Pasos: front-end del sitio web → Editar con Elementor → Contenedor (Container) → Espaciador (Spacer).

Espaciador. Se puede entender como el espacio entre el desenfoque o contenedor superior e inferior

Pasos: front-end del sitio web → Editar con Elementor → Contenedor (Container) → Divisor (Divider).

Divisor.

¡Puede establecer la anchura y el color, así como la altura, la diferencia entre él y el espaciador (Spacer) es que la función será un poco más potente, la función de espaciador (Spacer) es sólo un espacio, como se muestra a continuación, el efecto de dividir la línea (Divider) no será el mismo!

Más módulos

Vídeo: Inserción de vídeo

Google Maps: inserción de mapas

icono: icono

Estos ajustes son relativamente sencillos de configurar, por lo que puedes configurarlos según la traducción

En este número, hemos hablado de las características básicas del editor Elementor y algunas experiencias compartidas, a través del tutorial de hoy, esperamos que pueda dominar la aplicación avanzada del editor Elementor con el tema WoodMart, con el fin de crear un sitio web hermoso y con todas las funciones. En la próxima entrega, presentaremos las características de la versión de pago de Elementor, ¡así que permanezca atento para obtener más consejos profesionales y orientación en profundidad!

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: [email protected]
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres