Landing Pages

Maak een landingspagina aan met een startsjabloon

Laatst bijgewerkt: oktober 19, 2020

Geldt voor:

Alle producten en plannen

Met een starterssjabloon kunt u snel en eenvoudig een landingspagina bouwen om een inhoudsaanbieding aan uw websitebezoekers te presenteren. Dit artikel behandelt hoe u een nieuwe landingspagina kunt maken, uw pagina-ontwerp kunt aanpassen en uw pagina kunt publiceren.

Let op: starterssjablonen niet ondersteunen slimme inhoud, aangepaste modules, personalisatie of toegang tot broncode in rijke tekstmodules. Deze sjablonen ondersteunen ook geen geavanceerde opties, zoals het verwisselen van sjablonen en toegang tot header HTML.

Om te leren hoe je een landingspagina kunt maken en publiceren in een video tutorial, bekijk de gratis HubSpot lessen van Academy:

Voordat u begint

Maak een landingspagina aan met een startsjabloon

Om een nieuwe landingspagina te maken met een startsjabloon:

  • ."}'>Navigeer in uw HubSpot account naar Marketing > Website > Landingspagina's.
  • ."}'>Klik rechtsboven op Create > Landing page.
  • ."}'>Klik in het linker zijbalk-menu op Al uw sjablonen.
  • Klik bovenin op de Filter op bron dropdown menu en selecteer Starten. ."}'>
  • ."}'>Ga met de muis over een sjabloon en klik op Preview in de rechterbovenhoek.

."}'>starter-template-create-page

  • ."}'>Om een pagina met dit sjabloon te maken, klikt u rechtsboven op Gebruik sjabloon.

."}'>Bewerk de inhoud van uw pagina

."}'>Startersjablonen bevatten modules, die blokken van de inhoud van de website zijn. Deze modules kunnen in horizontale rijen of verticale kolommen worden gerangschikt.

."}'>Rijen en kolommen kunnen worden gegroepeerd in delen van elementen. Door elementen te groeperen, kunt u achtergrondstijlen toepassen op een heel gebied van uw pagina. U kunt deze elementen ook slepen en neerzetten om de lay-out van uw landingspagina te herschikken.

."}'>Meer informatie over het bewerken van pagina-inhoud in een drag and drop gebied.

Lettertypes, kleuren en knoppen aanpassen

Om de standaardstijlen voor uw startsjabloon aan te passen, klikt u op het tabblad Ontwerp in het linkerpaneel. U kunt ook de achtergrondkleur of -afbeelding voor een specifieke rij, kolom of sectie van uw pagina aanpassen

.

edit-starter-theme-on-page

Typografie

Bewerk in de sectie Typografie de lettertypen en lettertypestijlen die op uw paginabody en koppen worden toegepast. Alle Google-lettertypen worden ondersteund.
  • Lichaamstekst: pas het lettertype, de lettergrootte en de letterkleur aan voor het hoofdgedeelte van uw pagina:
    • Klik op het vervolgkeuzemenu voor lichaamstekst om het lettertype te selecteren.
    • Klik op de pijltjestoetsen om de lettergrootte te selecteren.
    • Klik op de kleurbel om een kleur voor uw lettertype in te stellen. Om een aangepaste kleur in te stellen, klikt u op het tabblad Geavanceerd en voert u een hex-waarde in.
  • Koppen: pas het lettertype en de kleur aan voor elke tekst in uw modules met een koppenlabel.
    • Klik op het vervolgkeuzemenu Koppen om een lettertype te selecteren.
    • Klik op de kleurenbalk om een lettertypekleur te selecteren.
  • Linktekst: pas de lettertypes en kleuren aan die worden toegepast op de links op uw pagina.
    • Klik op het vervolgkeuzemenu Link tekst om een lettertype te selecteren.
    • Klik op de kleurenbalk om een link kleur te selecteren.
    • Klik op de styling buttons of het dropdown menu om de stijlen te selecteren die worden toegepast op uw linktekst, inclusief of u wilt dat uw links onderstreept worden op de pagina.
    • Om de manier waarop links worden weergegeven wanneer uw bezoekers met uw pagina communiceren aan te passen, kunt u de kleur en transparantie van de link aanpassen.
      • Link met de muis: pas de kleur en transparantie van de linktekst aan wanneer een bezoeker met de muis over de links op uw pagina gaat.
      • Actieve link kleur: pas de kleur en transparantie van de linktekst standaard aan, voordat er op de link wordt geklikt.
      • Bezochte link kleur: pas de kleur en transparantie van de linktekst aan nadat er door een bezoeker op is geklikt.

Knoppen

In de sectie Knoppen kunt u de manier waarop eenvoudige knoppen en formulieren op de pagina worden gestileerd, aanpassen.
  • Achtergrondkleur van de knoppen: pas de kleur aan die wordt toegepast op de achtergrond van uw knoppen.
    • Voer een hex-waarde in of klik op de kleurbel om een kleur te selecteren.
    • Voer een procentuele waarde in of klik op de pijltjestoetsen om de transparantie van de achtergrondkleur van uw knop in te stellen.
  • Knoptekstkleur: de kleur die wordt toegepast op de tekst van de knoppen op uw pagina.
    • Voer een hex-waarde in of klik op de kleurenbalk om de kleur voor de tekst te selecteren.
    • Voer een procentuele waarde in of klik op de pijltjestoetsen om de transparantie van de tekstkleur van uw knop in te stellen.
  • Knop-hoekradius: pas de vorm van uw formulierknoppen aan door een waarde in te voeren of de schuifregelaar te verslepen. Een hogere waarde betekent dat de knoppen op uw pagina rondere randen hebben. Een waarde van nul betekent dat uw knoppen rechthoekig zijn.

Let op: het is een goede gewoonte om consistente kleuren, lettertypen en stijlen te behouden op basis van de instellingen in het tabblad Design. Als u om een of andere reden de standaardstijlen voor een specifiek element op uw pagina wilt overschrijven, kunt u de standaardstijlen voor een module overschrijven in het tabblad Opties

aan de linkerkant.

Optimaliseer uw pagina voor zoekmachines

Klik in de topnavigatie op het tabblad Optimaliseren om naar de SEO-optimalisatietool te gaan. Hier kunt u aanbevelingen bekijken om de prestaties van uw content in zoekmachines te verbeteren

.

Bewerk uw pagina-instellingen

Klik op het tabblad Instellingen

om uw paginadetails aan te passen.
  • Interne paginanaam: de interne paginanaam is de naam die u hebt toegevoegd toen u de pagina voor het eerst aanmaakte en waarnaar wordt verwezen in het dashboard. Deze wordt niet getoond aan bezoekers.
  • Paginatitel: de titel die in het tabblad bovenaan uw webbrowser wordt weergegeven wanneer de pagina wordt geladen.
  • Pagina URL: de URL voor uw pagina verschijnt in de URL-balk van de browser wanneer bezoekers naar deze pagina navigeren. U kunt de Content slug voor uw pagina-URL aanpassen.
  • Metabeschrijving: de inhoud die in de zoekresultaten onder de paginatitel verschijnt.
  • Aanbevolen afbeelding: klik om deze aan te zetten voor een specifieke afbeelding wanneer uw pagina wordt gedeeld op sociale media. Klik op Uploaden om een afbeelding van uw computer te selecteren.

Previewen en publiceren van uw pagina

Voordat je pagina live gaat, klik je op Preview in de rechterbovenhoek van omte testen hoe je pagina op een mobiel apparaat verschijnt

. U kunt ook testen hoe gepersonaliseerde of slimme inhoud aan uw bezoekers zal verschijnen in de preview van de pagina.

Om de manier waarop de inhoud van je pagina op een mobiel apparaat verschijnt aan te passen, klik je op het mobiele ediEditvoor mobiel pictogramin delinkerbovenhoek.

Als u tevreden bent met de preview van uw pagina, klikt u op .Publiceer in de rechterbovenhoek.