DocumentatieCommercePage Builder

Elementen - kop

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Onderwerpen:

Gemaakt voor:

  • Beginner
  • tussenpersoon
  • Gebruiker

Met kopniveaus wordt een hiërarchie ingesteld die inhoud ordent en zoekprogramma's helpt elke pagina te indexeren. Gebruik het inhoudstype van de Kop in het Page Builder stadiumom een tekstcontainer met een kopniveau van H1 aan H6 aan het stadium toe te voegen. Koppen worden opgemaakt op basis van het stijlblad dat is gekoppeld aan het huidige thema.

Het gebied van de Kop van de Inhoudin de Content ​sectie kan worden gebruikt om een H1 rubriek aan de bovenkant van de pagina toe te voegen. Het veld is echter een verouderde versie van Commerce en wordt geleverd ter ondersteuning van oudere inhoud. In dit veld worden de geavanceerde functies van Page Builder niet benut. Het wordt aanbevolen het veld Inhoudskop leeg te laten en het inhoudstype Page Builder Koptekst te gebruiken om koppen van een willekeurig niveau aan de pagina toe te voegen.

In het volgende voorbeeld ziet u hoe de inhoudsopgave Kop inhoud en Kop worden weergegeven wanneer deze worden opgemaakt door het thema Luma.

Kop van de Inhoud en de kopniveaus op de storefront

U kunt een rubriek van de sectie van Elementen van het Page Builder paneel aan een rij, een kolom, of een lusjereeks op het stadium slepen. Het kopniveau en de groepering kunnen van de redacteurstoolbar op het stadium worden gecontroleerd, of door de controle van Montages te gebruiken ( pictogram van Montages {width="20"}).

NOTE
Als u significante veranderingen in Page Builder inhoud aanbrengt, adviseert men dat u het Levenslang van de Zitting Adminverhoogt om de zitting te verhinderen uit timing terwijl u werkt.

Kop-editor

Redacteur van de Kop met toolbar

Gereedschap Keuzerondje

Net als bij alle inhoudscontainers wordt de gereedschapset weergegeven wanneer u de muisaanwijzer op de container plaatst.

de containertoolbox van de Rubriek

Gereedschap
Pictogram
Beschrijving
Verplaatsen
pictogram van de Beweging {width="25"}
Hiermee verplaatst u de kopcontainer naar een andere geldige plaats op de pagina.
(label)
Kop
Identificeert de huidige container als een kop.
Instellingen
pictogram van Montages {width="25"}
Hiermee opent u de pagina Koptekst bewerken, waarin u de eigenschappen van de container kunt wijzigen.
Verbergen
het pictogram van de Huid {width="25"}
Hiermee verbergt u de container van de kop.
Tonen
toon pictogram {width="25"}
Hiermee wordt de verborgen kopcontainer weergegeven.
Dupliceren
Dupliceer pictogram {width="25"}
Hiermee maakt u een kopie van de kopcontainer.
Verwijderen
verwijder pictogram {width="25"}
Hiermee verwijdert u de kopcontainer en de inhoud ervan uit het werkgebied.
NOTE
Verborgen elementen worden opgeslagen in de database en onzichtbaar voor klanten. Deze elementen zijn echter zichtbaar voor zoekmachines en andere bots die uw site kruipen. Ze worden ook geretourneerd als onderdeel van de inhoud als ze worden opgevraagd via een API-aanroep met een kenmerk van onzichtbaarheid, tenzij u ze uit het werkgebied verwijdert.

Een kop toevoegen

  1. Vouw in het deelvenster Page Builder Elements uit en sleep een tijdelijke aanduiding Heading naar een rij, kolom of tabset in het werkgebied.

    slepend een rubriek aan het stadium {width="600" modal="regular"}

  2. Voer in de editor de koptekst in boven de tijdelijke aanduiding voor Edit Heading Text .

    Standaard wordt aan de koptekst een koptekst van niveau twee (H2) toegewezen.

    Placeholder in de koptekstredacteur {width="500" modal="regular"}

  3. Kies in de werkbalk het juiste koptype tussen H1 en H6.

  4. Wijzig indien nodig de uitlijning.

Koptekstinstellingen bewerken

  1. Beweeg over de koptekstcontainer om toolbox te tonen en de pictogram van Montages te kiezen ( pictogram van Montages {width="20"}).

    Toolbox van de Rubriek {width="500" modal="regular"}

  2. Werk indien nodig de kopinhoud bij (Heading Type en Heading Text).

    U kunt deze inhoud ook bijwerken in de kopteksteditor.

  3. Werk de instellingen van Advanced ​naar wens bij.

    • Kies een Alignment als u de positie van de kop in de bovenliggende container wilt bepalen:

      table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
      Optie Beschrijving
      Default Hiermee past u de standaardinstelling voor uitlijning toe die is opgegeven in het stijlblad van het huidige thema.
      Left Hiermee lijnt u de lijst uit langs de linkerrand van de bovenliggende container, waarbij rekening wordt gehouden met de opgegeven opvulling.
      Center Hiermee lijnt u de lijst in het midden van de bovenliggende container uit, rekening houdend met de opgegeven opvulling.
      Right Hiermee lijnt u het blok uit langs de rechterrand van de bovenliggende container, waarbij rekening wordt gehouden met de opgegeven opvulling.

    • Stel de stijl Border in die op alle vier zijden van de kopcontainer wordt toegepast:

      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
      Optie Beschrijving
      Default Past de standaardrandstijl toe die door het bijbehorende stijlblad wordt gespecificeerd.
      None Geeft geen zichtbare indicatie van de containerranden.
      Dotted De containerrand wordt weergegeven als een stippellijn.
      Dashed De containerrand wordt weergegeven als een onderbroken lijn.
      Solid De containerrand wordt weergegeven als een effen lijn.
      Double De containerrand wordt weergegeven als een dubbele lijn.
      Groove De containerrand wordt weergegeven als een gegroefde lijn.
      Ridge De containerrand wordt weergegeven als een afgeronde lijn.
      Inset De containerrand wordt weergegeven als een inzetlijn.
      Outset De containerrand wordt weergegeven als een omtreklijn.

    • Als u een andere randstijl dan None instelt, voert u de weergaveopties voor de rand in:

      table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
      Optie Beschrijving
      Border Color Geef de kleur op door een staal te kiezen, op de kleurkiezer te klikken of door een geldige kleurnaam of een gelijkwaardige hexadecimale waarde in te voeren.
      Border Width Voer het aantal pixels in voor de lijnbreedte van de rand.
      Border Radius Voer het aantal pixels in om de grootte te bepalen van de straal die wordt gebruikt om elke hoek van de rand te afronden.

    • (Optioneel) Geef de namen van CSS classes op uit de huidige stijlpagina die u op de container wilt toepassen.

      Scheid meerdere klassennamen met een spatie.

    • Voer in pixels waarden in voor de Margins and Padding om de buitenste marges en de binnenopvulling van de kopcontainer te bepalen.

      Voer de overeenkomende waarden in het diagram in.

      table 0-row-2 1-row-2 2-row-2 layout-auto
      Containergebied Beschrijving
      Margins De hoeveelheid lege ruimte die wordt toegepast op de buitenrand van alle zijden van de container. Opties: Top / Right / Bottom / Left
      Padding De hoeveelheid lege ruimte die wordt toegepast op de binnenrand van alle zijden van de container. Opties: Top / Right / Bottom / Left

  4. Klik na afloop op Save om de instellingen toe te passen en terug te keren naar de werkruimte van Page Builder .

Een kop dupliceren

Voor een opgemaakte kop met specifieke instellingen is het efficiënter om de kop te dupliceren in plaats van opnieuw te beginnen met een nieuwe plaatsaanduiding.

  1. Beweeg over de koptekstcontainer om toolbox te tonen en te kiezen dupliceert ( Dupliceer pictogram {width="20"}) pictogram.

    Het duplicaat wordt net onder het origineel weergegeven.

    Duplicerend een koptekstcontainer {width="500" modal="regular"}

  2. Beweeg over de nieuwe koptekstcontainer om toolbox te tonen en de Beweging te kiezen ( pictogram van de Beweging {width="20"}) pictogram.

    Bewegend een rubriek {width="500" modal="regular"}

  3. Selecteer en sleep de kop totdat de rode hulplijn de nieuwe positie markeert.

    De boven- en onderrand van elke container worden weergegeven als onderbroken lijnen terwijl de kop wordt verplaatst.

    Bewegend de gedupliceerde rubriek in positie {width="500" modal="regular"}

  4. Als u het kopniveau wilt wijzigen, klikt u op de koptekst en kiest u het nieuwe niveau in de editor-werkbalk.

    Kiekend een nieuw kopniveau {width="500" modal="regular"}

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