Sección de texto

Utilice la sección Texto cuando desee mostrar un conjunto de texto en columnas. Puede agregar un Sección de texto a una página para vincular fácilmente diferentes páginas dentro del sitio web o para agregar enlaces con sus descripciones.

A medida que agregue los elementos de la lista a esta sección, se le aplicarán la configuración y el estilo que haya especificado. Esta sección será útil para mostrar el equipo, los diferentes productos que vende y para muchos otros propósitos.


En este artículo hablaremos de:

  1. ¿Qué es una sección de texto?
  2. Agregar una sección de texto
  3. Agregar y editar elementos de la lista
  4. Elementos de la lista de secuencias
  5. Eliminación de elementos de la lista
  6. Cambiar el diseño de la sección
  7. Administrar elementos
  8. Opciones de estilo
  9. El estilo carrusel
  10. Ejemplo vivo

Sección de texto

  • Si desea agregar algún texto o agregar un enlace en un texto sin imágenes, puede agregar una sección de texto.

Agregar una sección de texto

  • Se puede agregar una sección a una página. Puede agregar una sección a una página ya existente o crear una nueva página dentro de su sitio web.
  • En tu pagina, Haga clic en el azul + icono para agregar un Nueva sección a tu página.

  •  Ahora verá el categorías de sección en el panel izquierdo.
  • Elija el Contenido (1) opción y haga clic en el Texto pestaña (2) donde puede elegir diferentes diseños (3).

  • Elija cualquier diseño de sección y haga clic en él para agregarlo a su página.

Nota:

  1. Puede administrar el ancho de la sección desde el configuración de la sección y el ancho del contenido desde el estilo de contenido.
  2. Mantenga los títulos, subtítulos y descripciones breves y nítidas.
  3. En el campo de descripción, presione el botón entrar: botón para dar un salto de línea y el Shift + Enter para comenzar desde la siguiente línea.


Agregar y editar elementos de la lista

Agregar elemento de lista

Una vez que haya agregado la sección: 

  • Haga clic en el elemento Editar contenido (1) para abrir el panel de elementos de la lista.

  • Haga clic en el elemento Añadir artículo (2) botón para agregar un nuevo elemento de lista.
  • Tendrás la opción de Duplicar y eliminar (3) los elementos de la lista.


Editar elemento de la lista

Haga clic en el elemento de la lista que desea editar. Se abrirán las opciones de edición de elementos de la Lista en particular.

  • Agregue un Título (1), Subtítulo (2)y Descripción (3) del Artículo de Lista.
  • Es posible que no encuentre la opción de Subtítulo y Descripción en determinados elementos de la lista según el diseño que elija.
    Antes de añadir la descripción, compruebe este vídeo .

4. Acción al hacer clic

Puede personalizar el comportamiento de clic de elementos individuales en el Lista de texto Sección. A continuación se muestran las opciones disponibles:

  • Ir a un enlace
    Al seleccionar esta opción se abre el Creador de enlaces, lo que le permite agregar un hipervínculo a este elemento. El vínculo puede dirigir a los usuarios a otra página dentro de su sitio web o a una URL externa. Conozca más ¡Hola!  Creador de enlaces.
  • Abrir en Lightbox
    Esta opción muestra el elemento en una imagen ampliada. Lightbox Ver al hacer clic. En este modo, el Subtítulo  y  Descripción Los elementos asociados con el elemento no aparecerán en la vista de cuadrícula, pero serán visibles en el modo Lightbox.
  • No Acción
    Seleccione esta opción para que no se pueda hacer clic en el elemento. Cuando se selecciona, hacer clic en el elemento no activará ninguna acción.

5. Abrir enlace en nueva ventana: Configure el vínculo para que se abra en un nueva pestaña o en la misma pestaña. Esto sólo será visible cuando Ir a un enlace La opción está seleccionada debajo de Acción al hacer clic .

6. Botones y enlaces: Agrega cualquier tipo de Enlace al elemento de la lista. Puede agregar un botón, un enlace de imagen, un icono social o un enlace de texto. Más información.

7. Guardar: Después de realizar las personalizaciones, guarde los cambios.

8. Anulación del estilo de la tarjeta

Puede anular la configuración global del estilo de la tarjeta desde la sección Ajustes Personaliza la tarjeta de cada elemento individualmente en la sección Lista de imágenes. Esto te permite aplicar estilos únicos a diferentes elementos de la lista para una mejor personalización.

Más información Acerca de la opción Tarjetas en la sección dinámica.


Vea la edición de un elemento de la lista de texto en acción:


Elementos de la lista de secuencias

  • Puede arrastrar y soltar fácilmente los elementos de la lista para cambiar la secuencia.

Eliminar un elemento de la lista

Una vez que haya agregado un elemento de la lista, puede editarlo o eliminarlo.

  • Haga clic en el elemento Eliminar junto al elemento de la lista.
  • Haga clic en el elemento Eliminar botón en la ventana emergente de confirmación.
  • Guardar los cambios.

Nota:

Los elementos de la lista una vez eliminados no se pueden recuperar.


Diseño de sección

  • Haga clic en el elemento Contenido editado Botón (1).

  • Elija el Diseño (2) pestaña.
  • Seleccione cualquier diseño y Guardar (3) sus cambios.


Sección Administrar elementos de texto

La sección Lista de texto incluye una Pestaña Elementos que le permite administrar la visibilidad de varios elementos dentro de la sección con facilidad. Con simples interruptores, puede habilitar o deshabilitar elementos específicos sin tener que eliminar o modificar los elementos en sí.

  • Haga clic en el elemento  Contenido editado Botón (1).

  • Elija el Elementos (2) pestaña.
  • Después de realizar los cambios, presione el botón Guardar Botón (3).

Opciones de sección

  1. Mostrar título:Habilite o deshabilite la visibilidad del título para la sección Lista de texto.
  2. Mostrar Botones:Controla si los botones se muestran en el nivel de sección.

Opciones de artículos

  1. Mostrar título:Controla si se muestra el título.
  2. Mostrar subtítulo:Habilitar o deshabilitar subtítulos.
  3. Mostrar descripcion:Administrar la visibilidad de las descripciones de los artículos.
  4. Mostrar Botones:Decide si se deben mostrar los botones de elementos individuales.


Dale estilo a tu sección

  • Haga clic en el elemento Contenido editado Botón (1).

  • Elija el DE ESTILO RESORT (2) pestaña.
  • Cambie el estilo de los elementos de la lista y Guardar (3) sus cambios.


Tendrá varias opciones de estilo para esta sección: 

  1. Opciones de visualización
  2. Pantalla móvil
  3. Alineación
  4. Tamano del texto
  5. Espaciado
  6. Título de la sección
  7. Opciones de tarjeta
  8. Opciones de sombra
  9. Botones y enlaces

Opciones de visualización

  1. Elija Mostrar artículos in filas y columnas or carrusel 
    • Si ha elegido el filas y columnas opción, los elementos de la lista se organizarán en filas y columnas. En este caso, debe especificar el número de filas y columnas.
    • Si ha elegido el carrusel opción, los elementos de la lista se presentarán como una presentación de diapositivas. Conozca más.
  2. Configure  Número de columnas para la lista de texto. Puede elegir de 1 a 10 columnas.
  3. Especifica el Espacio entre columnas de los elementos de la lista.
  4. Especifica el Espacio entre filas de los elementos de la lista.

Si se selecciona la opción Carrusel en el Paso 1, verá las siguientes opciones adicionales:

  1. Habilitar desplazamiento suave:Permite el desplazamiento continuo de elementos dentro del carrusel para una experiencia fluida y visualmente atractiva.
  2. Deslizamiento automático:Rota automáticamente las diapositivas sin interacción del usuario.
  3. Mostrar el progreso de la reproducción automática:Muestra un indicador de progreso mientras la reproducción automática está activa para una mejor visibilidad.
  4. Retraso de reproducción automática:Establece el intervalo de tiempo entre cada transición de diapositiva cuando la reproducción automática está habilitada.
  5. Bucle de carrusel:Permite la repetición continua de diapositivas, de modo que el carrusel se reinicie sin problemas después de la última diapositiva.
  6. Controles de carrusel: Elegir el Controles de NavegaciónPuede elegir entre Sin controles, Flechas: Abajo al centro/Arriba a la derecha/Abajo a la derecha, Chevron, Puntos y Desplazamiento horizontal.


Pantalla móvil

  1. Establecer el número de Columnas de cuadrícula para dispositivos móviles. Puede configurarlo en un máximo de 3 columnas.
  2. Definir el Espaciado entre cuadrículas (en píxeles).

Diseño de columnas específico del dispositivo según la configuración de Studio:


Alineación

  • Alineación de contenido: Alinea el contenido horizontalmente en la Lista de texto. Puedes configurarlo para que quede alineado a la izquierda, a la derecha o al centro.


Tamaño del texto

  1. Haga clic en el elemento  Cambiar estilo de texto botón para visitar el Diseño sección y administre sus tamaños y estilos de fuente. 
  2. Configure Título estilo de fuente para los elementos de la lista de la sección.
  3. Configure Subtítulo estilo de fuente para los elementos de la lista de la sección.
  4. Establecer el valor predeterminado Descripción estilo de fuente para los elementos de la lista de la sección.
    También verifique: Estilo de texto del sitio web.
  5. Habilitar esta opción para animar cualquier número Presente en el Título y Subtítulo campos. Cuando se activa, los valores numéricos aparecerán con una animación de conteo dinámica, lo que los hace más atractivos visualmente.


Espaciado

  1. Especifica el Ancho del contenido para los elementos de la lista.
  2. Especifica el Espacio debajo del título de la sección en píxeles
  3. Especifica el Espacio debajo de los títulos de los elementos de la lista (en %).
  4. Especifica el Espacio debajo de los subtítulos de los elementos de la lista (en %).


Título de la sección

  1. Alinear horizontalmente El texto del título de la sección. Puede configurarlo a la izquierda, al centro o a la derecha.
  2. Habilitar/Deshabilitar el Divisor entre el título de la sección y el contenido de la sección.
  3. Configure  Grosor del divisor (en píxeles).
  4. Especifica el Color del divisor del selector de color.
  5. Elija un Estilo divisor desde el desplegable.
  6. Configure Ancho del titular para definir qué tan ancho aparecerá el título de la sección, comenzando desde un mínimo del 50%.


Opciones de tarjeta


Opciones de sombra

  1. Mostrar – Elija mostrar la sombra detrás de los elementos de la lista siempre o solo al pasar el mouse por encima.
  2. DE ESTILO RESORT – Elija entre los ajustes preestablecidos existentes o cree una sombra personalizada.
    En caso de que haya elegido la opción Personalizada, visite este Generador de sombras de caja para crear una sombra personalizada. Finalmente, copie y pegue el caja sombra CSS.
  3. En caso de que haya elegido la opción de preajustes, entonces Elija estilos de sombra desde el desplegable.

Nota:

La configuración de estilo se aplicará a todos los elementos de la sección. No se pueden modificar para cada elemento de la lista individualmente.


Botones y enlaces


El estilo carrusel

El estilo Carrusel muestra los elementos de la lista como una presentación de diapositivas, es decir, los elementos de la lista se alternarán entre sí.

Vea cómo funciona el estilo carrusel: 


Mostrar elemento de lista de texto como Tarjeta

  • Cuando usted elige mostrar tarjeta sobre su lista de texto, los elementos de la lista tendrán un fondo con el color de la tarjeta que haya especificado en el Diseño .
    Ver también: Colores y espaciado del sitio web.

Echa un vistazo: 


Aquí hay una lista de texto en vivo: 

Ver un sitio de demostración en vivo. 


¿No encuentras lo que buscas?

Póngase en contacto con un Experto Pixpa.