Variables

Una variable es, básicamente, un apodo para un valor determinado. Por ejemplo, si estoy trabajando en mi sitio y quiero que el texto esté en la fuente Roboto, puedo crear una variable llamada TextType y establecer el valor como Roboto. A lo largo de mi sitio, puedo configurar el texto para que use la variable TextType. Si bien podría lograr el mismo resultado simplemente configurando la fuente como Roboto, la ventaja de usar una variable es que si cambio de opinión y decido usar la fuente Arial en lugar de Roboto, simplemente puedo cambiar la variable TextType a Arial y el cambio tendrá efecto en todo el sitio.

Para crear una variable:

Actualmente, las variables se limitan a la familia de fuentes y al color del texto. En el siguiente ejemplo, crearemos una variable de familia de fuentes.

1. Abre el editor de elementor.
2. Arrastre un elemento de Párrafo al lienzo.
3. Haz clic en la pestaña Estilo.
   
4. Abra el campo Tipografía.
   
5. En el campo Familia de fuentes, haga clic en el icono de variable .
   
6. Si esta es la primera variable que crea, haga clic en Crear una variable. Si no es su primera variable, haga clic en el icono más en la ventana emergente de variables.
7. Asigne un nombre a su variable. En este caso, llamaremos a la variable Paragraph_text.
   
8. Introduzca Arial en el campo Valor.
   
9. Haz clic en Guardar.

Para editar una variable:

En este ejemplo, editaremos la variable que creamos anteriormente, cambiando el tipo de fuente a Roboto.

1. Abra el campo Tipografía como se describió anteriormente.
2. Pase el ratón sobre el campo Familia de fuentes.
3. Haga clic en el icono de variable.
   
4. Pase el ratón sobre la variable que desea editar.
5. Haga clic en el icono de lápiz junto al nombre de la variable.
   
6. Edite el nombre y/o el valor.
7. En este caso, cambiaremos el valor a Roboto.
   
8. Haga clic en Guardar.
   
   Donde se utilice la variable Paragraph_text en el sitio web, la fuente cambiará a Roboto.

Variables y clases

Las clases combinan una serie de estilos en una sola clase para ayudar a acelerar la creación del sitio. Para obtener más información sobre las clases, consulte Clases en Elementor. Las variables pueden formar parte de una clase.

En el siguiente ejemplo, crearemos una clase que incluye una variable.

1. Abre el editor de elementor.
2. Cree una variable llamada Paragraph_font con la familia de fuentes Roboto. Consulte Crear una variable arriba para obtener más detalles.
3. Arrastre un elemento de Encabezado al lienzo.
4. En la sección Estilo del elemento, cree una clase Heading_txt. Consulte Clases en Elementor para obtener más detalles.
   Asegúrese de que está editando la clase Heading_txt.
   
5. Abra el campo Tipografía.
   
6. Establezca el tamaño de fuente en 72 PX.
   
7. En Familia de fuentes, haga clic en el icono de variable y cree una variable llamada Heading_font y establezca la familia de fuentes en Arial.
   
8. Añada un segundo encabezado debajo del primero y asígnele la clase Heading_txt.
   
   Ambos encabezados deberían aparecer con una fuente Arial de 72 PX.
9. En el segundo encabezado, haga clic en la clase Heading_txt para que esté editando esta clase y cambie la familia de fuentes a la variable Paragraph_txt.
   
   Ambos encabezados ahora deberían mostrar la fuente Roboto, ya que la variable Paragraph_txt es parte de la clase Heading_txt.