DocumentatieJourney Optimizer B2BJourney Optimizer B2B edition-documentatie

[Beta]{class="badge informative" title="Deze functie bevindt zich momenteel in een beperkte bètaversie"}

Formulierontwerp

Last update: Thu Nov 20 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

Gemaakt voor:

  • Gebruiker

Nadat u ​ een vorm ​ creeert, opent de visuele ontwerpruimte een ontwerp met een standaardbasisvormdefinitie. Klik in het deelvenster Summary​aan de rechterkant op Edit form​en gebruik de visuele ontwerpruimte om de formulieropmaak en veldcomponenten te definiëren.

​ heb toegang tot de vormenbibliotheek ​ {width="700" modal="regular"}

Velden

Formuliervelden worden gebruikt om persoonprofielgegevens vast te leggen die kunnen worden gebruikt om personen als doel in te stellen en deze te koppelen aan accounts en inkoopgroepen. Alle nieuwe formulieren beginnen met de volgende velden in één kolomindeling:

  • Voornaam
  • Achternaam
  • E-mailadres

Gebruik de hulpmiddelen van het gebiedsontwerp om de reeks gebieden en lay-out te construeren die u voor het verzamelen van de gegevens nodig hebt die u voor uw op rekening-gebaseerde marketing activiteiten wilt.

Veld toevoegen add-field

  1. Sleep in het deelvenster Components​aan de linkerkant de inhoudcomponent Field​en zet deze neer op het canvas.

    ​ voeg een gebiedscomponent aan de vorm ​ {width="700" modal="regular"} toe

  2. Klik op Select field attribute.

  3. Selecteer in het dialoogvenster Select field attribute​het selectievakje voor het personenprofielkenmerk dat u voor het veld wilt gebruiken en klik op Select.

    De ​ XDM bedrijfsschema's ​ bepalen de beschikbare attributen. Alle aangepaste velden die zijn gedefinieerd voor uw Journey Optimizer B2B edition-exemplaar, zijn ook beschikbaar. Gebruik het tekstvak Zoeken om de lijst op naam te filteren of klik op het pictogram Filter om de lijst op schema/gegevenstype te filteren.

    ​ voeg een gebiedscomponent aan de vorm ​ {width="700" modal="regular"} toe

    Op het canvas wordt het standaardveldlabel voor het geselecteerde kenmerk gevuld op het canvas. De Field details worden weergegeven in het deelvenster aan de rechterkant.

  4. Wijzig zo nodig de tekst van Label .

    Deze tekst wordt weergegeven naast het veld in het formulier. De standaardtekst wordt gevuld vanuit het veldkenmerk.

  5. Stel Field type in op basis van het type gegevens voor het veld:

    table 0-row-3 1-row-3 2-row-3 3-row-3 4-row-3 5-row-3 6-row-3 7-row-3 8-row-3 9-row-3 10-row-3 11-row-3 12-row-3 13-row-3 14-row-3
    Veldtype Gebruik Voorbeeld
    Checkbox Gebruik dit type zodat de bezoekers a waar (gecontroleerd) of vals (ongecontroleerd) waarde kunnen selecteren.
    Checkbox Group Gebruik dit type zodat de bezoekers a waar (gecontroleerd) of vals (ongecontroleerd) waarde voor veelvoudige punten kunnen selecteren.
    Currency Gebruik dit type om een zwevend veld toe te staan dat het standaardvalutatype vertegenwoordigt dat is geselecteerd voor de Journey Optimizer B2B edition-instantie.
    Date Met dit type beperkt u de invoer tot een datumnotatie en verschaft u een kalenderkiezer in het veld.
    Double
    Email Gebruik dit type om de toegang te beperken tot een indeling voor e-mailadressen.
    Number Gebruik dit type om het veld te beperken tot een numerieke waarde.
    Radio Group Gebruik dit type als bezoekers een van de opties mogen selecteren.
    Select Gebruik dit type als bezoekers een van de opties in een vervolgkeuzelijst mogen selecteren.
    Slider Gebruik dit type om bezoekers de mogelijkheid te geven een numerieke waarde in te stellen met een schuifregelaar.
    Telephone Gebruik dit type voor een veld voor telefoonnummerinvoer.
    Text Gebruik dit type voor een standaard tekstinvoerveld (tekenreeks).
    Textarea Gebruik dit type om langere tekstinvoer te ondersteunen.
    URL Gebruik dit type om tekstinvoer te beperken tot een URL, inclusief het standaard URL-protocol.

  6. Afhankelijk van het geselecteerde veldtype stelt u de andere opties in voor het invoeren en valideren van velden:

    ​ vastgestelde opties voor het gebied volgens het geselecteerde gebiedstype ​ {width="400" modal="regular"}

    • Placeholder - De plaatsaanduidingswaarde voor het veld die de bezoeker een voorbeeld geeft van wat er voor het veld wordt verwacht.

    • Instructions - Instructieve tekst waarmee de bezoeker het veld kan voltooien. Ga de tekst in die u als aanwijstekst voor het gebied wilt tonen.

      note tip
      TIP
      Instructies vs. placeholder tekst
      Gebruik deze twee eigenschappen om bezoekers te begeleiden bij het invullen van het veld. Instructietekst wordt weergegeven als knopinfo/pop-uptekst wanneer u de aanwijzer op het veld plaatst. Plaatsaanduidingstekst verschijnt gedimd binnen het gebied en verdwijnt als de bezoeker hun tekst in het gebied ingaat. U kunt beide methoden gebruiken, of slechts één.

    • Default value - Gebruik deze optie om een standaardwaarde voor het veld op te geven.

    • Validation message - Gebruik deze optie om een validatiebericht voor het veld op te geven. Dit bericht wordt weergegeven als de bezoeker een ongeldige waarde voor het veld invoert. Het Standard-bericht wordt standaard ingesteld. Kies Custom​en voer uw eigen bericht in.

    • Max lengte - ga het maximumaantal karakters in die in het gebied kunnen worden ingegaan.

  7. Stel de Field behaviors desgewenst in:

    • Vereist - selecteer checkbox om de gebiedsinput te maken die voor het voorleggen van de vorm wordt vereist.

    • laat inputmasker toe - selecteer checkbox om input van uw bezoeker te beperken gebruikend een inputmasker. U wilt bezoekers bijvoorbeeld wellicht telefoonnummers invoeren in een specifieke notatie. Voer in het dialoogvenster het masker in met 9 voor een willekeurig getal, a voor een willekeurige letter en * voor een van beide. Klik op Opslaan om het opgegeven invoermasker in te schakelen.

      ​ bepaal een inputmasker voor het gebied ​ {width="500" modal="regular"}

Veldstijl wijzigen field-styling

Selecteer de tab Styles in het rechterdeelvenster om de opmaak voor het geselecteerde veld te wijzigen.

  • Background - Schakel het selectievakje in om een achtergrondkleur voor het veld toe te passen. Wit is de standaardkleur. Klik op het vierkantje Background color om de kleurkiezer voor de pop-upkleur te openen en een kleur voor de achtergrond van het veld te kiezen.

    ​ plaats de achtergrondstijlen voor het vormgebied ​ {width="600" modal="regular"}

  • Label - De labelopmaak bepaalt de visuele kenmerken van de tekst die naast het veld wordt weergegeven. Kies een boven- of zijlabelweergave ten opzichte van het veld. U kunt de tekengrootte, regelhoogte, tekststijl en tekstuitlijning instellen. Klik op het vierkantje Font color om de kleurkiezer voor de pop-upkleur te openen en kies een kleur voor de labeltekst.

    ​ plaats de etiketstijlen voor het vormgebied ​ {width="600" modal="regular"}

  • Border - Klik op het vierkantje Border color om de kleurkiezer voor de pop-upkleur te openen en een kleur voor de rand te kiezen. U kunt een rand voor het veld definiëren, inclusief de kleur en lijnbreedte. Schakel het selectievakje uit om de weergegeven veldrand te verwijderen. U kunt ook de randgrootte (pixelbreedte), stijl en straalinstelling voor de hoeken wijzigen.

    ​ plaats de grensstijlen voor het vormgebied ​ {width="600" modal="regular"}

  • Size - Selecteer een formaatinstelling om de weergavebreedte voor het veld te bepalen. Kies Full width,Half width of Auto.

  • Margin - Stel marges (in pixels) in rond het veld. U kunt dezelfde marge op alle vier de zijden instellen of het selectievakje Different margin for each side inschakelen om de horizontale en verticale marges afzonderlijk in te stellen.

  • Padding - Stel opvulling (in pixels) in rond het veld. U kunt dezelfde marge op alle vier de zijden instellen of het selectievakje Different padding for each side inschakelen om de horizontale en verticale marges afzonderlijk in te stellen.

    ​ plaats de grootte, de marge, en het opvullen stijlen voor het vormgebied ​ {width="600" modal="regular"}

Velden opnieuw ordenen field-reorder

U kunt formuliervelden rechtstreeks in de visuele werkruimte verplaatsen. Klik het hulpmiddel van de Beweging op de juiste rand van het geselecteerde gebied en sleep het aan een nieuwe plaats.

Voeg structurele componenten aan het formulier toe en verplaats velden naar kolommen om ze te groeperen en de indeling te wijzigen. Klik het hulpmiddel van de Beweging op de linkerrand van de geselecteerde kolomcomponent en sleep het aan een nieuwe plaats binnen de vorm.

​ de gebieden van de beweging in de vorm en gebruik structurele componenten voor groepering en lay-out ​ {width="500"}

Een veld verwijderen of dupliceren field-delete-duplicate

Klik het pictogram van de Schrapping ( pictogram van de Schrapping ) in de toolbar of het juiste paneel om een geselecteerd gebied te schrappen. Klik op Delete in het bevestigingsdialoogvenster.

Klik het Dubbele pictogram ( Dupliceer pictogram ) in de toolbar of het juiste paneel om een geselecteerd gebied te dupliceren. Het nieuwe veld wordt net onder het oorspronkelijke veld weergegeven. Klik op Select field attribute om het kenmerk voor het veld in te stellen. Stel het veldtype, de details en de stijlen naar wens in.

​ schrapt en dupliceert pictogrammen voor vormgebieden ​ {width="600" modal="regular"}

Verzenden, knop

De verzendknop (voettekstveld) maakt standaard deel uit van het formulier en kan niet worden verwijderd. Selecteer de knop-/voettekstcomponent in het formulier om de tekst en opmaak voor de knop te wijzigen.

De knopinhoud bewerken button-content

Wijzig de tekst in het veld Content​terwijl de tab Button text​in het rechterdeelvenster wordt weergegeven. De knopgrootte wordt aangepast aan de lengte van de tekst.

​ Verandering de knooptekst in de vorm ​ {width="600" modal="regular"}

De verzendknop opmaken button-styles

Selecteer de tab Styles in het rechterdeelvenster om de opmaak voor de geselecteerde knop-/voettekstcomponent te wijzigen.

  • Background - Schakel het selectievakje in om een achtergrondkleur voor de knop toe te passen. Blauw is de standaardkleur. Klik op het vierkantje Background color om de kleurkiezer voor de pop-upkleur te openen en een kleur voor de achtergrond van de knop te kiezen.

    ​ plaats de achtergrondstijlen voor de vormknoop ​ {width="600" modal="regular"}

  • Label - De labelopmaak bepaalt de visuele kenmerken van de tekst in de knop. U kunt de tekengrootte, regelhoogte, tekststijl en tekstuitlijning instellen. Klik op het vierkantje Font color om de kleurkiezer voor de pop-upkleur te openen en kies een kleur voor de labeltekst.

  • Border - Klik op het vierkantje Border color om de kleurkiezer voor de pop-upkleur te openen en een kleur voor de rand te kiezen. U kunt een rand voor de knop definiëren, inclusief de kleur en lijnbreedte. Schakel het selectievakje uit om de weergegeven knoprand te verwijderen. U kunt ook de instelling voor de randgrootte (pixelbreedte), stijl en straal voor afgeronde hoeken wijzigen.

  • Size - Selecteer een grootte die de vertoningsbreedte voor de knoop plaatst te bepalen. Kies Full width,Half width of Auto. De opvulling wordt aangepast aan de instellingen voor grootte en uitlijning.

    ​ plaats het etiket, de grens, en de formaatstijlen voor de vormknoop ​ {width="600" modal="regular"}

  • Button Alignment - wanneer u a Halve breedte of Auto grootte voor de knoop kiest, plaats de groepering bij verlaten, recht, of centrum. De opvulling wordt aangepast aan de instellingen voor grootte en uitlijning.

  • Margin - Stel marges (in pixels) in rond het veld. U kunt dezelfde marge op alle vier de zijden instellen of het selectievakje Different margin for each side inschakelen om de horizontale en verticale marges afzonderlijk in te stellen.

  • Padding - Stel opvulling (in pixels) in rond het veld. U kunt dezelfde marge op alle vier de zijden instellen of het selectievakje Different padding for each side inschakelen om de horizontale en verticale marges afzonderlijk in te stellen. De opvulling wordt aangepast als u de instellingen voor grootte en uitlijning wijzigt.

    ​ plaats de groepering, de marge, en het opvullen stijlen voor de vormknoop ​ {width="600" modal="regular"}

Formulierstijl form-styling

U kunt stijlen voor het formuliergebied wijzigen wanneer u buiten de structuur- of formuliercomponenten klikt. De vormcomponenten (gebieden en knoop) erven de 1} stijlen van het Lichaam {bepaald de top-level stijlen, tenzij andere stijlen op het gebied of knoop/footer niveau worden bepaald.

​ plaats de top-level stijlen voor het vormlichaam ​ {width="600" modal="regular"}

CSS-stijlen

Nieuwe formulieren gebruiken de standaard-CSS voor opmaak. Als u de stijlen wilt wijzigen door de CSS te wijzigen, kunt u deze kopiëren en vervolgens gebruiken om een aangepaste CSS voor het formulier te definiëren.

Een aangepaste CSS voor het formulier definiëren :

  1. Klik op View CSS in het rechterdeelvenster om de CSS-code te bekijken.

    ​ plaats de achtergrondkleuren voor de vorm ​ {width="450" modal="regular"}

  2. Selecteer de CSS-code in het schuifvenster en kopieer deze naar het klembord.

  3. Klik op Close.

  4. (Optioneel) Plak de gekopieerde code in uw favoriete CSS-gereedschap en bewerk de CSS om de gewenste opmaak weer te geven.

  5. Klik op Add custom CSS in het rechterdeelvenster.

  6. Plak de CSS-code in het venster.

    ​ plaats de achtergrondkleuren voor de vorm ​ {width="450" modal="regular"}

    U kunt de geplakte tekst in dit venster bewerken.

  7. Klik op Save.

Handmatige stijl

Wijzig de instellingen in het rechtervenster om de weergave voor het hele formulier te definiëren.

  • Background color - Schakel het selectievakje in om een achtergrondkleur toe te passen rond het formuliergebied. Wit is de standaardkleur. Klik op het gekleurde vierkant om de kleurkiezer voor de pop-upkleur te openen en een kleur voor de achtergrond van het formulier te kiezen.

  • Viewport background - Schakel het selectievakje in om een achtergrondkleur toe te passen op alle formuliercomponenten. De standaardwaarde is geen kleur (overerven van de buitenste achtergrond). Klik op het kleurvakje om de kleurkiezer voor de pop-upkleur te openen en kies een kleur voor de structuurcomponenten van het formulier.

    ​ plaats de achtergrondkleuren voor de vorm ​ {width="600" modal="regular"}

  • Text - Kies een Font family voor het formulier, dat invloed heeft op de labels, de tip en de plaatsaanduidingstekst voor formuliervelden. Het heeft ook invloed op de standaardtekst van de verzendknop.

  • Size - Wijzig de grootte (breedte) van het formulier in pixels.

  • Margin - Stel marges (in pixels) in rond de formuliercomponenten. U kunt dezelfde marge op alle vier de zijden instellen of het selectievakje Different margin for each side inschakelen om de horizontale en verticale marges afzonderlijk in te stellen.

    ​ plaats de tekst, de grootte, en de marges voor de vorm ​ {width="600" modal="regular"}

recommendation-more-help
6ef00091-a233-4243-8773-0da8461f7ef0