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.

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

Senast uppdaterad: januari 20, 2023

Gäller för:

Alla produkter och planer

I sidredigeraren med drag och släpp kan användare ordna om 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 med 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

Organisera ditt innehåll

I redigeringsverktyget för sidofältet kan du se en översikt över sektioner, rader, kolumner och moduler i ditt innehåll. Därifrån kan du byta namn, redigera, klona, ta bort eller dölja dem:

  • Navigera till ditt innehåll:

    • Webbplatssidor: 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.
  • Klicka på fliken Innehåll i sidobladets redigeringsverktyg.
  • Du kan styra vilka sidelement som ska vara synliga i sidebarredigeraren:
    • Om du bara vill visa sidans avsnitt klickar du på Kolla in alla. Då fälls alla rader, kolumner och moduler ihop så att endast sektioner är synliga i sidebarredigeraren.
    • Om du vill se allt innehåll på sidan klickar du på Expandera allt. Då visas alla sektioner, rader, kolumner och moduler i sidobladet.
    • Om du vill visa ett enskilt sidelement eller en enskild behållare klickar du på + plus-tecknet bredvid dess namn.
    • Om du vill dölja ett element eller en behållare klickar du på -minustecknet bredvid dess namn.
  • Du kan också redigera, byta namn, klona, ta bort och dölja sidelement:
    • Om du vill redigera ett element klickar du på dess namn.
    • Om du vill byta namn på ett element klickar du på ellipsen tre punkter bredvid dess namn och väljer sedan Byt namn [element]. Ange ett namn för elementet i dialogrutan och klicka sedan på Spara.
    • Om du vill klona ett element klickar du på de tre ellipserna bredvid dess namn och väljer sedan Klona. Detta skapar en exakt kopia av det ursprungliga elementet intill det.
    • Om du vill ta bort ett element klickar du på de tre ellipserna bredvid dess namn och väljer sedan Ta bort.
    • Om du vill dölja en modul klickar du på de tre ellipserna bredvid dess namn och väljer sedan Dölja den här modulen. På så sätt döljs modulen i förhandsgranskningen av sidan, men inte i redigeringsverktyget för sidofältet. Om du vill visa en dold modul på sidan klickar du på ellipsen med tre punkter bredvid dess namn och väljer sedan Visa den här modulen.

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 sektioner 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 50 å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

Du kan spara ett avsnitt för att göra det återanvändbart på andra sidor som använder samma tema.

  • 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 Layouter och väljer en layout för avsnittet.

add-blank-layout-to-page

  • I innehållsredigeraren drar du en modul ö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 downCarat down och välj sedan Save 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 ett namn och en beskrivning för avsnittet och klickar sedan på Spara.

Lägg till eller ta bort 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 under Tema-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.
  • Om du vill redigera ett områdes bakgrund klickar du på Bakgrund i redigeringsfältet för sidofältet och väljer ett stylingalternativ: .
    • Ingen: ta bort alla bakgrundsfärger eller bilder.
    • Färg: Ange en enda färg som bakgrund. Ange ett hexadikalt värde eller klickafärgväljaren och välj en färg och ange sedan ett transparensvärde.
    • Bild: Ange en bild som bakgrund. Om du vill lägga till en ny bild klickar du på Ladda upp för att lägga till en bild från din dator ellerBläddra bland bilder för att välja en bild från dina filer.
    • 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 ett hexadikalt värde eller klickarfärgväljaren och väljer en färg och anger sedan ett transparensvä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åikonen delete 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 till sin position.

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

Hjälpte artikeln?
Detta formulär används endast för dokumentationsfeedback. Få reda på hur du får hjälp med HubSpot.