Pas de grootte van je CTA (legacy) aan met behulp van de ingebouwde opties voor de grootte en aangepaste CSS. Wanneer je je afbeelding uploadt voor een CTA met afbeelding, wil je misschien rekening houden met retina-optimalisatie.
Om je CTA verder aan te passen, leer je hoe je aangepaste stijlen toevoegt aan je CTA (legacy) met CSS. Als je je CTA toevoegt aan een e-mail of sjabloon, leer dan hoe je je CTA kunt centreren (legacy).
De grootte van je CTA (legacy) bewerken
Je kunt de grootte van je CTA handmatig aanpassen of aangepaste CSS gebruiken om automatisch de breedte van de container of module van de CTA te vullen. Als u
een
afbeelding CTA
insluit op uw niet-HubSpot site, moet u mogelijk extra CSS-declaraties (zoals width: 100%;) toepassen in uw stylesheet om de afbeelding CTA responsief te maken.
Om de grootte van je knop CTA aan te passen:
- Klik linksboven op het vervolgkeuzemenu en selecteer CTA's (Legacy).
- Beweeg de muis over een CTA en klik op Acties > Bewerken.
- Klik in het schuifpaneel op Geavanceerde opties.
- Om het formaat van uw aangepaste CTA handmatig aan te passen:
- Schakel het selectievakje Aanpassen aan tekst uit. Dit verwijdert de automatische aanpassing van de grootte.
- Voer in het gedeelte Knopvulling de waarden voor de grootte in voor de velden Knopbreedte en Knophoogte.
- Klik op Volgende >.
- Klik op Opslaan. Klik vervolgens op Voltooien.
- Om je aangepaste CTA de volledige breedte van de container of module te laten vullen:
- Schakel het selectievakje Formaat automatisch uit.
- Voer in het veld Aangepaste CSS je aangepaste CSS in.
- Stel de breedte in op width: 100%;
- Klik op Volgende >.
- Klik op Opslaan. Klik vervolgens op Voltooien.
Wat is retina-optimalisatie?
Retina optimalisatie zorgt ervoor dat de afbeelding van je CTA scherper wordt weergegeven op je websitepagina's en in e-mails als je ontvangers de CTA bekijken in moderne versies van Apple Mail en iOS mail; dit wordt niet ondersteund door Outlook of webmaildiensten zoals Gmail.
Retina optimalisatie wordt ondersteund als je een afbeelding uploadt die minstens twee keer zo groot is als de CTA, net zoals retina ondersteuning werkt voor alle afbeeldingen op het internet. Houd ook rekening met het volgende:
- Als je een CTA maakt van 400px bij 100px, moet de geüploade afbeelding 800px bij 200px zijn om een @2x pixeldichtheid te ondersteunen.
- CTA's ondersteunen het optellen tot een 4x versie. Als je bijvoorbeeld een CTA maakt van 400px bij 100px, kun je een afbeelding van 1600px bij 400px uploaden.
- De CTA wordt automatisch weergegeven op je website met een srcset attribuut dat de 1x, 2x, 3x en 4x versie weergeeft waar beschikbaar.
- Als de afbeelding wordt geüpload in de grootte waarin de CTA wordt weergegeven, wordt retina niet ondersteund. Bijvoorbeeld, als een afbeelding van 400px bij 100px wordt geüpload voor een CTA van 400px bij 100px