Elementos: encabezado

Los niveles de encabezado establecen una jerarquía que organiza el contenido y ayuda a los motores de búsqueda a indexar cada página. Utilice el Encabezado tipo de contenido en Page Builder stage para agregar un contenedor de texto con un nivel de encabezado de H1 a H6 al escenario. El formato de los encabezados depende de la hoja de estilos asociada al tema actual.

El Encabezado de contenido en el campo Content ​se puede utilizar para añadir un encabezado H1 a la parte superior de la página. Sin embargo, el campo es un heredado del anterior Commerce y se proporciona para admitir contenido antiguo. Este campo no aprovecha las Page BuilderFunciones avanzadas de. Se recomienda dejar en blanco el campo Encabezado de contenido y utilizar la variable Page Builder Tipo de contenido de encabezado para agregar encabezados de cualquier nivel a la página.

El siguiente ejemplo muestra cómo aparecen el encabezado de contenido y el tipo de contenido de encabezado cuando se les aplica formato mediante la temática de Luma.

Niveles de encabezado y encabezado de contenido en la tienda

Puede arrastrar un encabezado desde Elementos de la sección Page Builder panel a una fila, columna o conjunto de pestañas del escenario. El nivel de encabezado y la alineación se pueden controlar desde la barra de herramientas del editor en el escenario o utilizando Configuración ( Icono de configuración {width="20"} ) control.

NOTE
Si está realizando cambios importantes en Page Builder contenido, se recomienda aumentar el Duración de sesión de administrador para evitar que se agote el tiempo de espera de la sesión mientras trabaja.

Editor de encabezado

Editor de encabezados con barra de herramientas

Cuadro de herramientas Contenedor de encabezado

Al igual que con todos los contenedores de contenido, la caja de herramientas aparece al pasar el ratón por encima del contenedor.

Cuadro de herramientas Contenedor de encabezado

Herramienta
Icono
Descripción
Mover
Icono Mover {width="25"}
Mueve el contenedor de encabezado a otro lugar válido de la página.
(etiqueta)
Encabezado
Identifica el contenedor actual como un encabezado.
Configuración
Icono de configuración {width="25"}
Abre la página Editar encabezado, donde puede cambiar las propiedades del contenedor.
Hide
Icono Ocultar {width="25"}
Oculta el contenedor del encabezado.
Mostrar
Mostrar icono {width="25"}
Muestra el contenedor de encabezados oculto.
Duplicar
Icono Duplicar {width="25"}
Realiza una copia del contenedor de encabezado.
Eliminar
Icono Eliminar {width="25"}
Elimina el contenedor de encabezado y su contenido del escenario.
NOTE
Los elementos ocultos se almacenan en la base de datos y son invisibles para los clientes. Sin embargo, estos elementos son visibles para los motores de búsqueda y otros bots que rastrean el sitio. También se devuelven como parte del contenido si se solicitan a través de una llamada de API con un atributo de invisibilidad, a menos que los elimine del escenario.

Añadir un encabezado

  1. En el Page Builder panel, expandir Elements y arrastre un Heading marcador de posición a una fila, columna o ficha establecida en el escenario.

    Arrastrar un encabezado al escenario {width="600" modal="regular"}

  2. En el editor, escriba el texto del encabezado sobre la etiqueta Edit Heading Text marcador.

    De forma predeterminada, al texto del encabezado se le asigna un tipo de encabezado de nivel dos (H2).

    Marcador de posición en el editor de encabezados {width="500" modal="regular"}

  3. En la barra de herramientas, elija el tipo de encabezado adecuado entre H1 y H6.

  4. Cambie la alineación si es necesario.

Editar configuración de encabezado

  1. Pase el ratón sobre el contenedor de encabezados para mostrar el cuadro de herramientas y elegir Configuración ( Icono de configuración {width="20"} ) icono.

    Encabezado, caja de herramientas {width="500" modal="regular"}

  2. Actualice el contenido del encabezado (Heading Type y Heading Text) si es necesario.

    También puede actualizar este contenido en el editor de encabezados.

  3. Actualice el Advanced ​ajustes según sea necesario.

    • Para controlar el posicionamiento del encabezado dentro del contenedor principal, elija una Alignment:

      table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
      Opción Descripción
      Default Aplica la configuración predeterminada de alineación especificada en la hoja de estilos de la temática actual.
      Left Alinea la lista a lo largo del borde izquierdo del contenedor principal, con margen para cualquier relleno que se especifique.
      Center Alinea la lista en el centro del contenedor principal, con margen para cualquier relleno que se especifique.
      Right Alinea el bloque a lo largo del borde derecho del contenedor principal, con margen para cualquier relleno que se especifique.
    • Configure las variables Border estilo aplicado a los cuatro lados del contenedor de encabezado:

      table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
      Opción Descripción
      Default Aplica el estilo de borde predeterminado especificado por la hoja de estilos asociada.
      None No proporciona ninguna indicación visible de los bordes del contenedor.
      Dotted El borde del contenedor aparece como una línea de puntos.
      Dashed El borde del contenedor aparece como una línea discontinua.
      Solid El borde del contenedor aparece como una línea sólida.
      Double El borde del contenedor aparece como una línea doble.
      Groove El borde del contenedor aparece como una línea ranurada.
      Ridge El borde del contenedor aparece como una línea discontinua.
      Inset El borde del contenedor aparece como una línea de margen.
      Outset El borde del contenedor aparece como una línea de inicio.
    • Si establece un estilo de borde distinto de None, complete las opciones de visualización de bordes:

      table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
      Opción Descripción
      Border Color Especifique el color seleccionando una muestra, haciendo clic en el selector de color o introduciendo un nombre de color válido o un valor hexadecimal equivalente.
      Border Width Introduzca el número de píxeles de la anchura de la línea del borde.
      Border Radius Introduzca el número de píxeles para definir el tamaño del radio que se utiliza para redondear cada esquina del borde.
    • (Opcional) Especifique los nombres de CSS classes de la hoja de estilos actual para aplicarla al contenedor.

      Separe los distintos nombres de clase con un espacio.

    • Introduzca valores, en píxeles, para Margins and Padding para determinar los márgenes externos y el relleno interno del contenedor de encabezado.

      Introduzca los valores correspondientes en el diagrama.

      table 0-row-2 1-row-2 2-row-2 layout-auto
      Área del contenedor Descripción
      Margins Cantidad de espacio en blanco que se aplica al borde exterior de todos los lados del contenedor. Opciones: Top / Right / Bottom / Left
      Padding Cantidad de espacio en blanco que se aplica al borde interior de todos los lados del contenedor. Opciones: Top / Right / Bottom / Left
  4. Cuando termine, haga clic en Save para aplicar la configuración de y volver a Page Builder workspace.

Duplicación de un encabezado

Para un encabezado con formato y con una configuración específica, es más eficaz duplicarlo, en lugar de empezar de nuevo con un nuevo marcador de posición.

  1. Pase el ratón sobre el contenedor de encabezados para mostrar el cuadro de herramientas y elegir Duplicar ( Icono Duplicar {width="20"} ) icono.

    El duplicado aparece justo debajo del original.

    Duplicación de un contenedor de encabezado {width="500" modal="regular"}

  2. Pase el ratón sobre el nuevo contenedor de encabezados para mostrar el cuadro de herramientas y elegir Mover ( Icono Mover {width="20"} ) icono.

    Mover un encabezado {width="500" modal="regular"}

  3. Seleccione y arrastre el encabezado hasta que la guía roja marque la nueva posición.

    Los bordes superior e inferior de cada contenedor aparecen como líneas discontinuas mientras se mueve el encabezado.

    Mover el encabezado duplicado a su posición {width="500" modal="regular"}

  4. Si desea cambiar el nivel de encabezado, haga clic en el texto del encabezado y elija el nuevo nivel en la barra de herramientas del editor.

    Elección de un nuevo nivel de encabezado {width="500" modal="regular"}

recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d