widget son los bloques de construcción clave de un sitio, lo que le permite agregar y gestionar contenido de manera efectiva. Sirven como elementos esenciales que mejoran tanto la funcionalidad como el diseño de su sitio web. Al incorporar varios tipos de widget, puede crear una experiencia de usuario dinámica y atractiva.
Existen varios métodos para agregar widget. A continuación se explica cómo puede agregar widget:
Para agregar widget de la biblioteca widget :
-
En el panel lateral, haga clic en widget para abrir la biblioteca widget.
-
widget se pueden buscar usando la barra de búsqueda en la parte superior o desplazar por las diferentes secciones de la biblioteca.
-
-
Haga clic y arrastre el widget a la ubicación que desee en el sitio. Aparece un indicador de ubicación azul.
-
El widget aparece en la ubicación que muestra el indicador de ubicación azul.
Cuando arrastre un widget a su sitio, observe el texto en el indicador azul de colocación:
-
Insertar aquí. El widget se agregará a una fila o columna existente.
-
Insertar en nueva fila. Se agregará una nueva fila y el widget se colocará dentro de ella.
-
Insertar en nueva columna. Se agregará una nueva columna y el widget se colocará dentro de ella.
Para agregar widget del lienzo:
-
Haga clic con el botón derecho del mouse en cualquier widget y seleccione agregar widget a continuación en el menú contextual para agregar widget inmediatamente debajo del widget actual.
-
Si está haciendo clic con el botón derecho en una columna, haga clic en agregar y seleccione agregar widget a continuación
(Relevante para el modo Tradicional, Flex y Editor 2.0)
-
-
Seleccione una de las cuatro widget más populares o haga clic en Más widget para abrir el menú completo. Luego de agregar el widget, puedes editarlo como de costumbre.
Puede personalizar widget para ajustar el contenido, la apariencia y el diseño de su sitio. La edición widget te permite tener un mayor control sobre las características que tiene tu sitio y cómo se comportan estas características.
La mayoría widget tienen un área para su contenido, así como para su diseño.
La mayoría de los widget en el editor tienen opciones de diseño que le permiten personalizar la apariencia del widgetpara su sitio. No todos widget tienen las mismas opciones. Por ejemplo, algunas widget no te permiten editar el espaciado interno, otras no te permiten cambiar el espaciado externo.
Las siguientes son configuraciones de diseño comunes.
Las opciones de diseño suelen ser específicas de determinados widget. Para seleccionar entre el conjunto de opciones de diseño disponibles para ese widget, haga clic en el diseño que aparece en el Editor de diseño (o haga clic en la flecha pequeña junto a él) para abrir el menú Seleccionar diseño. Para cambiar el diseño seleccionado, haga clic en el diseño que desea usar en su lugar y se actualizará en el widget.
Ejemplo de sección de diseño en la pestaña Diseño :
-
Color. Haga clic en el ícono de color redondo a la derecha del nombre de la configuración para abrir el selector de color y cambiar el color.
-
Borde. Cambie el ancho del borde empleando el control deslizante o el cuadro de texto. Haga clic en el icono de engranaje (
) para más opciones.
-
Fondo. Emplee una imagen de fondo o color para este widget mediante el cuadro de diálogo Elegir y colocar imágenes o una URL de video.
-
Ancho y alto. Emplee el control deslizante o el cuadro de texto para cambiar la cantidad de pixeles.
-
Esquinas redondeadas. Aumente o disminuya el redondeo de las esquinas de un widget. Haga clic en el icono de engranaje (
-
Sombras. Activa o desactiva una sombra para este widget.
-
Texto. Establezca varios aspectos del texto, como la familia de fuentes, el peso de la fuente, etc.
widget que incorporen un botón ofrecerán la posibilidad de seleccionar si el botón hereda el estilo de botón principal o secundario definido en el panel del tema. Además, puede elegir entre los diferentes diseños de botones, realizar ediciones en el estilo del botón (ancho, alto) y el texto del botón (fuente, tamaño del texto), y ajustar el interior y el espaciado externo.
Cualquier cambio que realice dentro del editor de diseño anulará los estilos establecido en el nivel del botón del tema. Si necesita volver al estilo del botón del tema, haga clic en Restablecer estilo del tema.
-
Si se hacen cambios en el botón (que anularán los estilos establecidos en el nivel del botón del tema), aparecerá un cuadro de indicador en el estilo del botón Principal o Secundario.
-
Si se hace clic en el estilo del botón que no tiene el cuadro indicador, se restablecerá el botón al estilo establecido en el nivel del botón del tema.
Cambia el espaciado interno (espaciado dentro de los bordes del widget) y el espaciado externo (espaciado fuera de los bordes widget). Cada número en el cuadro exterior establece el espaciado externo para su propio lado (arriba, abajo, izquierda o derecha), y cada número en el cuadro interior establece el espaciado interno para su propio lado (arriba, abajo, izquierda o derecha).
Para obtener información detallada, consulte Exterior y espaciado interno
Las animaciones de entrada le permiten animar widget y widget de página cuando se cargan por primera vez en su sitio. El movimiento y la interactividad hacen que su sitio sea más memorable y pueden enfatizar las secciones en las que desea que los visitantes se concentren, como un número de teléfono o un botón de contacto.
Además, puedes controlar dónde comienza y termina la animación en la pantalla empleando la configuración de Desplazamiento .
Para agregar una animación:
-
Vaya a la sección Animación .
-
Seleccione un disparador ( Entrada o Desplazamiento) y una animación.
-
(Opcional) Personaliza la animación (por ejemplo, la dirección desde donde ingresará).
Ejemplo de configuración de animación:
Para restablecer la animación, haga clic en Restablecer valores predeterminados.
Si emplea una animación de desplazamiento, puede hacer clic en Pausar animación () en el panel lateral para pausar todas las animaciones mientras estás en el modo de edición. Las animaciones seguirán activas en el modo de vista previa y en el sitio en tiempo real.
Nota
Las animaciones configuradas para escritorio y tablet están vinculadas y serán las mismas. Sin embargo, la versión móvil es independiente, y las animaciones configuradas para escritorio o tablet no se aplicarán.
Tenga en cuenta lo siguiente al añadir animaciones:
-
Demasiadas animaciones pueden desorientar o distraer a los usuarios, así que úselas con moderación.
-
Al eliminar una animación, recuerde que las animaciones se pueden aplicar a filas y widget, por lo que es posible que la animación que está viendo se agregó en algún lugar inesperado.
Para eliminar animaciones:
Nota
Si un elemento no tiene animación, se podría aplicar a uno de los contenedores en los que se encuentra el elemento. Se recomienda verificar todos los contenedores para detectar posibles animaciones.
Establezca si el widget está alineado a la izquierda, a la derecha o al centro de su área.
Algunos widget comportar de manera muy diferente en diferentes puntos de vista. Verifique la forma en que se muestra su widget en cada vista luego de agregarla para cerciorar de que se muestre correctamente.
Para establecer la alineación, haga clic con el botón derecho en el widget y, a continuación, haga clic en un icono Alinear a la izquierda, Alinear al centro o Alinear a la derecha .
Un widget se puede copiar y pegar en otra ubicación. La opción de pegar solo aparece si tiene un widget que se copió.
Haga clic con el botón derecho en el widget y, a continuación, haga clic en Copiar o Pegar.
Advertencia
No recomendamos copiar y pegar formularios de contacto, ya que esto generalmente genera problemas en el formulario de contacto duplicado.
Use la función ocultar en dispositivo para cambiar su contenido dependiendo del dispositivo que utiliza el visitante para ingresar a su sitio web. Por ejemplo, muestre un widget Clic para llamar a usuarios de dispositivos móviles o un Formulario de contacto para usuarios de equipos de escritorio.
widget ocultas por la función Ocultar en el dispositivo no se eliminan.
Haga clic con el botón derecho en el widget, haga clic en Ocultar en dispositivo, seleccione un dispositivo .
Si aparece un icono de ojo () está presente en el panel lateral, esto indica que hay elementos ocultos en el dispositivo que estás editando actualmente. Para ver los elementos ocultos, haga clic en el icono del Ojo.
Los enlaces de anclaje le permiten enviar a los visitantes a una sección específica de la página, lo que les facilita ir de un lugar a otro en una página más larga o a una sección específica a la que desea hacer referencia. Para obtener más información sobre los anclajes, consulte Acciones y opciones del lienzo.
Haga clic con el botón derecho en el widget y, a continuación, haga clic en Establecer como anclaje.