Pagina-inhoud bewerken in een drag-and-drop gebied

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

De sleep-en neerzet-editor begrijpen

Drag and drop gebieden zijn samengesteld uit modules, die blokken van website-inhoud zijn. 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 tegelijk herschikken of van styling voorzien. Meer informatie over het aanpassen van stijlen voor drag and drop content.

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

Uw inhoud organiseren

In de zijbalkeditor ziet u een overzicht van de secties, rijen, kolommen en modules in uw inhoud. Van daaruit kunt u ze hernoemen, bewerken, klonen, verwijderen of verbergen:

• Navigeer naar uw inhoud:

  • Website Pagina's: Navigeer in uw HubSpot-account naar Marketing > Website > Websitepagina's.
  • Landingspagina's: Navigeer in uw HubSpot-account naar Marketing > Landingspagina's.
• Ga met de muis over een pagina en klik op Bewerken.
• Klik in de zijbalkeditor op het tabblad Inhoud .
• U kunt bepalen welke pagina-elementen zichtbaar zijn in de zijbalk-editor:
  • Om alleen de secties van uw pagina te bekijken, klikt u op Alles samenvouwen. Hierdoor worden alle rijen, kolommen en modules samengevouwen zodat alleen de secties zichtbaar zijn in de sidebar editor.
  • Om alle inhoud van uw pagina te zien, klikt u op Alles uitbreiden. Hierdoor worden alle secties, rijen, kolommen en modules in de sidebar-editor weergegeven.
  • Als u een afzonderlijk pagina-element of container wilt bekijken, klikt u op het plusteken naast de naam ervan.
  • Om een element of container te verbergen, klikt u op het minteken naast de naam.
• U kunt ook pagina-elementen bewerken, hernoemen, klonen, verwijderen en verbergen:
  • Klik op de naam om een element te bewerken.
  • Om de naam van een element te wijzigen, klikt u op de drie puntjes naast de naam en selecteert u Rename [element]. In het dialoogvenster voert u een naam in voor het element en vervolgens klikt u op Opslaan.
  • Om een element te klonen, klikt u op de drie puntjes naast de naam en selecteert u Kloon. Dit maakt een exacte kopie van het oorspronkelijke element naast het element.
  • Om een element te verwijderen, klikt u op de drie puntjes naast de naam en selecteert u Verwijderen.
  • Om een module te verbergen, klikt u op de drie punt jes naast de naam en selecteert u Deze module verbergen. Hierdoor wordt de module in het voorbeeld van de pagina verborgen, maar niet in de zijbalkeditor. Om een verborgen module op de pagina weer te geven, klikt u op de drie punt jes naast de naam en selecteert u Toon deze module.

Secties gebruiken

In de sleep-en neerzet-editor kunt u herbruikbare paginasecties maken door modules naar een lege sectielay-out te slepen. Ontwikkelaars kunnen deze secties ook maken met behulp van onze documentatie voor ontwikkelaars. Eenmaal gemaakt, kunnen secties worden gebruikt op elke pagina die slepen en neerzetten 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 50 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 maken

U kunt een sectie opslaan om deze herbruikbaar te maken op andere pagina's met hetzelfde thema.

• Navigeer naar uw inhoud:

  • Website Pagina's: Navigeer in uw HubSpot-account naar Marketing > Website > Websitepagina's.
  • Landingspagina's: Navigeer in uw HubSpot-account naar Marketing > Landingspagina's.
• Ga met de muis over een pagina en klik op Bewerken.
• Ga in de inhoudseditor met de muis tussen twee secties staan en klik op hetplus-pictogram.

• Klik in het rechterpaneel op het tabblad Lay-outs en selecteer een lay-out voor uw sectie.

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

• Ga met de muis over de sectie en klik op het icoontje met de pijl naar beneden en selecteer vervolgens Sectie opslaan.

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

• Voer in het rechterpaneel een naam en beschrijving in voor uw sectie en klik op Opslaan.

Een sectie toevoegen of verwijderen

• Navigeer naar uw inhoud:

  • Website Pagina's: Navigeer in uw HubSpot-account naar Marketing > Website > Websitepagina's.
  • Landingspagina's: Navigeer in uw HubSpot-account naar Marketing > Landingspagina's.
• Ga met de muis over een pagina en klik op Bewerken.
• Ga in de inhoudseditor met de muis over twee secties en klik op hetplus-pictogram.

• Ga in het rechterpaneel met de muis over een sectie en klik op Selecteren. Secties die zijn opgeslagen vanuit de sleep-en neerzet-editor verschijnen onder Opgeslagen secties, terwijl secties die zijn gemaakt door ontwikkelaars verschijnen onder Themesecties.
• Door een opgeslagen sectie toe te voegen die slimme regels bevat, worden die regels toegepast op de nieuw toegevoegde sectie. Deze secties krijgen het label Smart.
• Om een sectie te verwijderen, klik je op het + plus pictogram voor het toevoegen van een sectie, dan zweef je over de sectie en klik je op het verwijder pictogram. Klik in het dialoogvenster op Verwijderen.

Rijen, kolommen of secties bewerken

• Ga in de pagina-editor met de muis over de rij, kolom of sectie en cklik op het bewerken bewerken pictogram.
• Als u de vulling en marges rond de rij, kolom of sectie wilt aanpassen, klikt u op Uitlijning en spatiëring in de zijbalkeditor.
• Om de achtergrond van een gebied te bewerken, klikt u op Achtergrond in de zijbalkeditor en selecteert u een stylingoptie:
  • Geen: verwijder alle achtergrondkleuren of -afbeeldingen.
  • Kleur: stel een enkele kleur in als achtergrond. Voer een hexadecimale waarde in of klik op de kleurenkiezer en selecteer een kleur, voer vervolgens een transparantiewaarde in.
  • Om een nieuwe afbeelding toe te voegen, klikt u op Upload om een afbeelding van uw computer toe te voegen, of op Browse images om een afbeelding uit uw bestanden te selecteren.
  • Verloop: stel twee in elkaar overlopende kleuren in als achtergrond. Klik op hetRichtingdropdown menu en selecteer eenRichting verloop. Voer voor elke kleur een hexadecimale waarde in, of klik op de kleurenkiezer en selecteer een kleur, voer vervolgens een transparantiewaarde in.

• Om een kopie te maken van een bestaand element, ga met de muis over het element en klik op hetpictogram dupliceren ccclone.
• Om een element van de pagina te verwijderen, ga met de muisover het element en klik op hetpictogram Verwijderen .

Modules toevoegen en bewerken

• Navigeer naar uw inhoud:

  • Website Pagina's: Navigeer in uw HubSpot-account naar Marketing > Website > Websitepagina's.
  • Landingspagina's: Navigeer in uw HubSpot-account naar Marketing > Landingspagina's.
• Ga met de muis over een pagina en klik op Bewerken.
• Klik in de inhoudseditor op de module en sleep deze in positie op de pagina.
• Om de breedte van een module aan te passen, klikt u op de verticale scheiding tussen de kolommen en sleept u deze in positie.

• Om de inhoud van een module aan te passen, gaat u met de muis over de module en klikt u op een pictogram:

• • module bewerken : de inhoud van de module bewerken
  • kloon module: maak een kopie van deze module op de pagina.
  • verwijderen Module verwijderen: verwijder deze module van de pagina.