Hoppa till innehåll
Observera: Översättningen av denna artikel är endast avsedd att underlätta för dig. Översättningen har skapats automatiskt med hjälp av en översättningsprogramvara och har eventuellt inte korrekturlästs. Den engelska versionen av denna artikel bör därför betraktas som den gällande versionen med den senaste informationen. Du kan komma åt den här.
Landing Pages

Redigera sidans innehåll i ett drag-och-släpp-område

Senast uppdaterad: november 2, 2021

Gäller för:

Alla produkter och planer

I sidredigeraren med drag och släpp kan användare omdisponera och tillämpa anpassade stilar på olika delar av en sida. Drag och släpp-redigering är tillgänglig för sidor som skapats med startmallar, vissa temamallar och kodade mallar med drag och släpp-områden.

Förstå redigeraren för dra och släpp

Drag-och-dropp-områden består av moduler, som är block av webbplatsens innehåll. Moduler kan ordnas i horisontella rader eller vertikala kolumner, som sedan kan grupperas i avsnitt.

Genom att skapa rader, kolumner och sektioner kan du ordna om eller tillämpa styling på flera moduler samtidigt. Läs mer om hur du anpassar stilar för innehåll som du drar och släpper.

  1. Modul: ett enskilt block av webbplatsens innehåll. Vissa moduler, som t.ex. moduler för rik text, kan innehålla flera olika typer av innehåll.
  2. Rad: en horisontell rad med moduler. Du kan tillämpa styling på en hel rad eller ändra dess position på en sida.
  3. Kolumn: en vertikal stapel av flera moduler. Du kan använda stil på en hel kolumn eller ändra dess position på en sida.
  4. Sektion: En grupp av flera rader eller kolumner som täcker hela sidans bredd. Du kan använda stil på en hel sektion eller ändra dess position på en sida.

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

Använd sektioner

I redigeringsverktyget Dra och släpp kan du skapa återanvändbara sidsektioner genom att dra moduler till en tom sektionslayout. Utvecklare kan också skapa dessa sektioner med hjälp av vår dokumentation för utvecklare. När sektionerna väl har skapats kan de användas på alla sidor som stöder drag- och släppredigering. Sparade sektioner som innehåller smarta regler kommer att använda dessa regler när de läggs till på en sida.

Observera följande:Inte mer än 25 återanvändbara sektioner kan sparas från drag- och släppredigeraren på en gång. Om du vill spara ett nytt återanvändbart avsnitt ska du ta bort ett befintligt återanvändbart avsnitt.

Skapa ett avsnitt

  • Navigera till ditt innehåll:

    • Webbplatssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Webbsida > Sidor på webbplatsen.
    • Landningssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Landningssidor.
  • Håll muspekaren över en sida och klicka påRedigera.
  • I innehållsredigeraren håller du muspekaren mellan två avsnitt och klickar på+-ikonen.

add-a-page-section

  • I den högra panelen klickar du på fliken Layouteroch väljer enlayout för avsnittet.

add-blank-layout-to-page

  • I innehållsredigeraren drar du enmodul över layouten och släpper den på plats. Upprepa för varje modul i avsnittet.

drag-and-drop-onto-layout

  • Håll muspekaren över avsnittet och klicka påikonen downCaratdown och välj sedanSave section (Spara avsnitt).

save-a-section

Observera:Befintliga sidsektioner och sektioner som skapas utan layout kan också sparas som återanvändbara sektioner.


  • I den högra panelen anger du ettnamn och en beskrivning för avsnittet och klickar sedan påSpara.

Lägg till ett avsnitt

  • Navigera till ditt innehåll:

    • Webbplatssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Webbsida > Sidor på webbplatsen.}
    • Landningssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Landningssidor.
  • Håll muspekaren över en sida och klicka påRedigera.
  • I innehållsredigeraren håller du muspekaren mellan två avsnitt och klickar på+-ikonen.

add-a-page-section

  • I den högra panelen håller du muspekaren över ett avsnitt och klickar på Välj. Sektioner som sparas från drag-och-släpp-redigeraren visas under Sparade sektioner, medan sektioner som skapats av utvecklare visas underTema-sektioner.
  • Om du lägger till ett sparat avsnitt som innehåller smarta regler kommer dessa regler att tillämpas på det nytillagda avsnittet. Dessa sektioner kommer att märkas som smarta.
  • Om du vill ta bort en sektion klickar du på +plus-ikonen för att lägga till en sektion, för sedan muspekaren över sektionen och klickar påikonen för borttagning av borttagning av borttagning. I dialogrutan klickar du påTa bort.

add-smart-section

Redigera rader, kolumner eller sektioner

  • I sidredigeraren håller du muspekaren över raden, kolumnen eller sektionen och cklickar du på redigera redigera ikonen.
  • Om du vill anpassa utfyllnad och marginaler runt raden, kolumnen eller avsnittet klickar du på Justering och avstånd i sidredigeraren.
  • Omdu vill redigera ett områdes bakgrund klickar du påBakgrund i redigeringsfältet för sidofältet och väljer ettstylingalternativ:.
    • Ingen:tar bort alla bakgrundsfärger eller bilder.
    • Färg:Ange en enda färg som bakgrund. Ange etthexadikalt värde ellerklicka påfärgväljarenoch välj enfärgoch ange sedan etttransparensvärde.
    • Bild: Ange en bild som bakgrund. Om du vill lägga till en ny bild klickar du påLadda uppför att lägga till en bild från din dator eller påBläddra bland bilderför att välja en bild från dinafiler.
    • Gradient: ställ in två färger som bleknar tillsammans som bakgrund. Klicka påRiktningrullgardinsmenyn och välj enGradientriktning. För varje färg anger du etthexadikalt värde ellerklickar påfärgväljarenoch väljer enfärgoch anger sedan etttransparensvärde.
edit-background-for-a-page-section
  • Om du vill göra en kopia av ett befintligt element håller du muspekaren över elementet och klickar påikonen duplicera ccclone.
  • Omdu vill ta bort ett element från sidan,för du muspekaren över elementet och klickar påikonendelete delete.

edit-column-icons

Lägg till och redigera moduler

  • Navigera till ditt innehåll:

    • Webbplatssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Webbsida > Sidor på webbplatsen.
    • Landningssidor: I ditt HubSpot-konto, navigera till Marknadsföring > Landningssidor.
  • Håll muspekaren över en sida och klicka påRedigera.
  • I innehållsredigeraren klickar du på modulen i sidebarredigeraren och drar den sedan på plats på sidan.
  • Om du vill justera bredden på en modul klickar du på den vertikala skiljeväggen mellan kolumnerna och drar den på plats.

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

  • Om du vill anpassa innehållet i en modul håller du muspekaren över modulen och klickar på en ikon:
    • Redigera Redigera modul: Redigera modulens innehåll.
    • clonduplicate Klona modul: gör en kopia av den här modulen på sidan.
    • delete Ta bort modul: ta bort den här modulen från sidan.

edit-module-icons