Doorgaan naar artikel
Let op: De Nederlandse vertaling van dit artikel is alleen bedoeld voor het gemak. De vertaling wordt automatisch gemaakt via een vertaalsoftware en is mogelijk niet proefgelezen. Daarom moet de Engelse versie van dit artikel worden beschouwd als de meest recente versie met de meest recente informatie. U kunt het hier raadplegen.
Landing Pages

Bewerk pagina-inhoud in een gebied met slepen en neerzetten

Laatst bijgewerkt: september 28, 2021

Geldt voor:

Alle producten en plannen

In de pagina-editor met slepen en neerzetten kunnen gebruikers de verschillende secties van een pagina herschikken en aangepaste stijlen toepassen. Bewerken met slepen en neerzetten is beschikbaar voor pagina's die zijn gemaakt met startsjablonen, sommige themasjablonen en gecodeerde sjablonen met gebieden voor slepen en neerzetten.

De editor voor slepen en neerzetten begrijpen

Drag-and-drop gebieden zijn opgebouwd uit modules, dat zijn blokken met website-inhoud. Modules kunnen worden gerangschikt in horizontale rijen of verticale kolommen, die vervolgens kunnen worden gegroepeerd in secties.

Door rijen, kolommen en secties te maken, kunt u meerdere modules in één keer herschikken of een andere stijl geven. Meer informatie over het aanpassen van stijlen voor inhoud met slepen en neerzetten.

  1. Module: een afzonderlijk blok website-inhoud. Sommige modules, zoals rijke tekst modules, kunnen meerdere soorten inhoud bevatten.
  2. Rij: een horizontale rij van modules. U kunt de vormgeving van een hele rij toepassen of de positie ervan op een pagina wijzigen.
  3. Kolom: een verticale stapel van meerdere modules. U kunt de vormgeving van een hele kolom toepassen of de positie ervan op een pagina herschikken.
  4. Sectie: een groep van meerdere rijen of kolommen die de volledige breedte van de pagina beslaat. U kunt de vormgeving van een volledige sectie toepassen of de positie ervan op een pagina herschikken.

edit-drag-and-drop-areas-in-page-editor

Secties gebruiken

In de sleep-en neerzet-editor kunt u herbruikbare pagina-secties maken door modules naar een lege sectie-indeling te slepen. Ontwikkelaars kunnen deze secties ook maken met behulp van onze documentatie voor ontwikkelaars. Eenmaal aangemaakt, kunnen secties gebruikt worden op elke pagina die drag-and-drop editing ondersteunt. Opgeslagen secties die slimme regels bevatten zullen deze regels gebruiken wanneer ze aan een pagina worden toegevoegd.

Let op:er kunnen niet meer dan 25 herbruikbare secties tegelijk worden opgeslagen vanuit de drag-and-drop editor. Om een nieuwe herbruikbare sectie op te slaan, verwijdert u een bestaande herbruikbare sectie.

Een sectie aanmaken

  • Navigeer naar uw inhoud:

    • Website Pagina's: { local.navWebsitePages }}
    • Landingspagina's: { local.navLandingPages }}
  • Ga met de muis over een pagina en klik opBewerken.
  • Ga in de inhoudseditor tussen twee secties staan en klik op het +plus icoon.

add-a-page-section

  • Klik in het rechterpaneel op het tabblad Lay-outsen selecteer eenlay-out voor uw sectie.

add-blank-layout-to-page

  • Sleep in de inhoudseditor eenmodule over de lay-out en zet hem op zijn plaats. Herhaal dit voor elke module van uw sectie.

drag-and-drop-onto-layout

  • Beweeg de muis over de sectie en klik op het omlaagCaratomlaag icoon, selecteer danSectie opslaan.

save-a-section

Let op:bestaande pagina-secties en secties die zonder lay-out zijn gemaakt, kunnen ook als herbruikbare secties worden opgeslagen.


  • Voer in het rechterpaneel eennaam en beschrijving voor uw sectie in en klik dan opOpslaan.

Een sectie toevoegen

  • Navigeer naar uw inhoud:

    • Website Pagina's: { local.navWebsitePages }}
    • Landingspagina's: { local.navLandingPages }}
  • Ga met de muis over een pagina en klik opBewerken.
  • Beweeg in de inhoudseditor met de muis over twee secties en klik op het +plus icoon.

add-a-page-section

  • In het rechter paneel, beweeg met de muis over een sectie en klik op Selecteren. Secties die zijn opgeslagen met de sleep-en neerzet-editor verschijnen onder Opgeslagen secties, terwijl secties die zijn gemaakt door ontwikkelaars verschijnen onderThema secties.
  • Het toevoegen van een opgeslagen sectie die slimme regels bevat zal deze regels toepassen op de nieuw toegevoegde sectie. Deze secties zullen worden gelabeld als Smart.
  • Om een sectie te verwijderen, klik op het +plus icoon voor het toevoegen van een sectie, ga dan met de muis over de sectie en klik op het Verwijderenicoon. In het dialoogvenster klikt u opVerwijderen.

add-smart-section

Rijen, kolommen of secties bewerken

  • Beweeg in de pagina-editor met de muis over de rij, kolom of sectie en cklik op het pictogram bewerken bewerken pictogram.
  • Om de vulling en marges rond de rij, kolom of sectie aan te passen, klik op Uitlijning en spatiëring in de zijbalk editor.
  • Om de achtergrond van een gebied te bewerken, klikt u opAchtergrond in de zijbalkeditor en selecteert u eenstylingoptie:
    • Geen:verwijder alle achtergrondkleuren of afbeeldingen.
    • Kleur:stel een enkele kleur in als achtergrond. Voer eenhex-waardein ofklik op dekleurkiezeren selecteer eenkleur,voer vervolgens eentransparantiewaarde in.
    • Afbeelding: stel een afbeelding in als achtergrond. Om een nieuwe afbeelding toe te voegen, klikt u opUploadenom een afbeelding van uw computer toe te voegen, of klikt u opAfbeeldingen zoekenom een afbeelding uit uwbestanden te selecteren.
    • Kleurverloop: stel twee kleuren in die in elkaar overvloeien als achtergrond. Klik op hetRichtingkeuzemenu en selecteer eenKleurverloop richting. Voer voor elke kleur eenhex-waardein,of klik op dekleurkiezeren selecteer eenkleur,voer vervolgens eentransparantiewaarde in.
edit-background-for-a-page-section
  • Om een kopie te maken van een bestaand element, ga met de muis over het element en klik op het dupliceren cccloneicoon.
  • Omeen element van de pagina te verwijderen,ga met de muis overhet element en klik op het pictogramVerwijderen verwijderen.

edit-column-icons

Modules toevoegen en bewerken

  • Navigeer naar uw inhoud:

    • Website Pagina's: Navigeer in uw HubSpot-account naar Marketing > Website > Websitepagina's.
    • Landingspagina's: { local.navLandingPages }}
  • Ga met de muis over een pagina en klik opBewerken.
  • Klik in de inhoudseditor op de module in de zijbalkeditor en sleep deze op zijn plaats op de pagina.
  • Als u de breedte van een module wilt aanpassen, klikt u op de verticale scheidingslijn tussen de kolommen en sleept u deze naar de juiste positie.

adjust-column-size-in-drag-and-drop-editor

  • Om de inhoud van een module aan te passen, gaat u met de muis over de module en klikt u op een pictogram:
    • bewerken Module bewerken: bewerk de inhoud van de module
    • clonduplicate Module klonen: een kopie van deze module op de pagina maken.
    • delete Verwijder module: verwijder deze module van de pagina.

edit-module-icons