Liquid Mode for Mobile Web -allekirjoitustoiminto

Päivitetty viimeksi 11. kesäkuuta 2025

Johdanto

Liquid Mode -allekirjoitustoiminto parantaa dokumenttiesi näyttöä vastaanottajan laitteen tyypin mukaan. Näin sinun tarvitsee nipistää ja zoomata entistä vähemmän, ja voit helposti keskittyä täytettäviin kenttiin.

Liquid Modea tukevat sopimukset luodaan niin, että vastaanottajan käytettävissä on kaksi näkymää:

  1. PDF-näkymä, joka luodaan käyttämällä kaikkia lähetetyssä HTML-tiedostossa olevia esimääritettyjä tyylitietoja. Tämä vastaa sopimuksen ladattavissa olevaa allekirjoitettua versiota – aivan kuin PDF-näkymä, jonka Adobe Acrobat Sign luo kaikille sopimuksille
  2. Liquid Mode -näkymä, joka juoksuttaa HTML-dokumentin syötteen uudelleen ja joka on optimoitu pienikokoisille näytöille. Liquid Mode -näkymä tarjoaa hyvin kuratoidun käyttökokemuksen, joka ohittaa alkuperäisessä HTML-dokumentissa määritetyn tyylin.

Käyttöliittymässä vastaanottaja voi vaihtaa dokumentin Liquid Mode -näkymän ja perinteisen PDF-näkymän välillä. Samalla käyttöliittymän kautta voidaan hankkia samat juridisesti sitovat allekirjoitukset kuin mihin olet tottunut.

 

Liquid Modea tukevat sopimukset luodaan käyttämällä lähdesisältönä yhtä HTML-tiedostoa.

Lähetetyn HTML-dokumentin HTML- ja lomakekenttärakenteisiin liittyy muutamia rajoituksia. Kiinnitä huomiota erityisesti seuraaviin asioihin:

  • Sopimus on luotava käyttämällä yhtä HTML-dokumenttia (vain yhtä tiedostoa).
    • Jos sopimuksen luontiin käytetään useita dokumentteja, luodaan vain PDF-näkymä.
  • HTML-dokumentissa ei saa olla JavaScript. <script>-tägejä ei saa käyttää tekstiin sisäisenä JavaScriptinä, viittauksina ulkoisiin JavaScript-tiedostoihin tai HTML-tunnisteiden määritteissä
    • Jos HTML-dokumentista löytyy JavaScriptiä, Acrobat Sign luo vain PDF-näkymän
  • HTML-dokumentin <body>-osassa voi käyttää vain tuettuja HTML-tunnisteita, jotka on kerrottu Tuetut HTML-tunnisteet -osiossa
    • Jos HTML-dokumentin leipätekstissä on HTML-tunnisteita, joita ei tueta, Acrobat Sign luo vain PDF-näkymän

Koska Liquid Mode -näkymä tarjoaa hyvin kuratoidun käyttökokemuksen, HTML-tiedostossa määritetty CSS ohitetaan (VAIN Liquid Mode -näkymässä), ja Liquid Mode -näkymään vaikuttavat vain tuettujen HTML-tagien määritteet. PDF-näkymässä ei kuitenkaan ole tällaisia rajoituksia. Acrobat Sign käyttää koko sitä määritteiden kirjoa, joka tuetuille tageille on olemassa ja HTML-dokumentissa määritettyä CSS:ää PDF-näkymän luontiin.

Adobe Acrobat Sign -tekstitageja käytetään HTML-dokumentin lomakekenttien määrittämiseen.

Liquid Mode -työnkulku

Muistiinpano

Jos Liquid Mode -toiminto on otettu käyttöön, mutta Liquid Mode -näkymää ei jostakin syystä voi luoda, sopimus luodaan vain PDF-näkymällä.

Lähettäjälle lähetetyssä vahvistussähköpostiviestissä on lueteltu syyt, miksi Liquid Mode -näkymää ei voitu luoda.

Liquid Modea tuetaan tällä hetkellä matkapuhelinlaitteissa, ja muiden laitteiden tuki on kehitteillä.


Liquid Modea tukevien sopimusten ottaminen käyttöön ja lähettäminen

Varmista, että Liquid Mode on otettu käyttöön Acrobat Signin Hallinta-valikossa:

  • Valitse Lähetysasetukset > Liquid Mode.
    • Asetusta voidaan muuttaa tili- tai ryhmätasolla
Siirry Liquid Moden säätimiin.

Lähetä yksi HTML-tiedosto jollakin seuraavista tavoista:

Lähetä HTML-dokumentti


Tuetut HTML-tagit

HTML-dokumentissa EI SAA olla JavaScript-rakenteita, jotta sopimus voidaan luoda Liquid Mode -näkymässä. 

HTML-dokumentin leipätekstissä voidaan käyttää vain seuraavia tageja:

Luokka

HTML-tagit

Liquid Mode -näkymään vaikuttavat määritteet

Rajoitukset

Otsikot

<h1>, <h2>, <h3>, <h4>, <h5>, <h6>

EI OLE

 

Sisällön jako

<div>

align

 

Jaa

<br>

EI OLE

 

Erottava vaakaviiva

<hr>

EI OLE

 

Kappale

<p>

align

 

Kuvat

<img>

src, alt, height, width

Perehdy Tuetut kuvat -osioon

Sitoutuva teksti

<b>, <i>, <u>, <s>, <strong>, <em>, <span>, <sub>, <sup>

EI OLE

 

Järjestetty luettelo

<ol>, <li>

value, type, reversed, start

 

Järjestämätön luettelo

<ul>, <li>

value, reversed, start

 

Hyperlinkki

<a>

href

URL-protokollaksi on rajoitettu http, https ja mailto.

Taulukko

<table>, <thead>, <tbody>, <tfoot>, <th>, <tr>, <td>, <caption>, <col>, <colgroup>

EI OLE

1. Sisäkkäisiä taulukoita EI tueta.

2. Taulukoiden lomakekenttiä EI tueta.

Lomakekentän tunnus

<label>

tietoa

Perehdy Lomakekenttien tunnukset -osioon.

Lomakekenttien ryhmittely

<fieldset>, <legend>

EI OLE

Perehdy Kenttien tunnusryhmät -osioon.

Kuvat

<img>

src, alt, height, width

Kuvan ja koko HTML-tiedoston koon tulisi olla alle 400 kilotavua. Seuraavia muotoja tuetaan: JPEG, PNG, GIF, BMP ja TIFF. Kuvan lähteen on oltava HTTPs-URL.


Lomakekenttien määritys

Lomakekentät määritetään HTML-dokumentissa käyttämällä Adobe Acrobat Sign -tekstitagien merkintää.

Alla olevassa taulukossa on esimerkkejä Acrobat Sign -tekstitageja käyttävistä lomakekentistä.

Kenttä

Sign-tekstitagit

Allekirjoituskentät (Allekirjoitus, Nimikirjaimet, Allekirjoituskenttä, Leima)

{{Sig_es_:signer1:signature}}



{{Int_es_:signer1:initials}}



{{SigB_es_:signer1:signatureblock}}



{{OSig_es_:signer1:optsignature}}



{{OInt_es_:signer1:optinitials}}



{{SigStamp_es_:signer1:stampimage(25)}}

Allekirjoittajan kentät

{{Cmpy_es_:signer1:company}}



{{N_es_:signer2:fullname}}



{{Dte_es_:signer1:date}}



{{Em_es_:signer1:email}}

Lähettäjän kentät

{{*Ttl_es_:sender:title}}

Osallistumisleima ja tapahtumatunnus

{{userstamp_es_:signer1:stamp:repeat}}

{{transstamp1_es_:transactionid:repeat}}

Vain luku -kenttä

{{!price}}

{{price_es_:readonly}}

Tekstin syöttö

{{address_es_:signer1}}

{{*city_es_:signer1}}

Valintaruudut

{{CB1_es_:checkbox(checked)}}

Valintapainike

{{(Red)Color_es_:signer1:label(“Red”)}}

{{(Blue)Color_es_:signer1:label(“Blue”)}}

{{(Green)Color_es_:signer1:label(“Green”)}}

Kuva

{{Image1_es_:signer1:inlineimage(4)}}

Avattava valikko

{{Color_es_:signer1:dropdown(options="Red,Green,Blue”, values=”R,G,B”)}}


Hyperlinkki

{{companywebsite_es_:link(http://www.adobe.com):label(Adobe)}}


Tiedostoliite

{{*DriversLicense_es_:signer1:attachment}}

Työkaluvihje

{{Car_color_es:signer1:tooltip('Choose a color')}}

Digitaalinen allekirjoitus

{{digsig1_es_:signer1:digitalsignature}}

Kentän vahvistus

{{*Mobile_es_:signer1:phone}}

{{d_es_:signer1:num(>0,<60)}}

Ehdolliset säännöt

esim. {{field_es_:showif(price>60)}}

Laskettavat kentät

{{TV_es_:calc([SubTotal]+[Tax])}}

Muistiinpano

Kaikki Acrobat Signin lomakekenttärakenteet ovat tuettuja, paitsi seuraavat:

Luokka

Tukemattomat rakenteet

Poikkeukset

Digitaalinen allekirjoitus -lomakekenttä

:digitalsignature ei ole tuettu.



Esitäyttötyönkulut

:Prefill--ohje ei ole tuettu.



Hyperlinkkilomakekenttä

:page(N)-ohje ei ole tuettu.

:link muiden kuin http-, https- ja mailto-protokollien kanssa.

:signer1- ja :everyone-ohjeet ovat tuettuja.

Nimeämättömät lomakekentät

Nimeämättömiä lomakekenttiä ei tueta.

Nimeämättömiä valintaruutuja tuetaan.

Uudelleennimetyt lomakekentät

Useita lomakekenttiä, joilla on sama nimi, mutta eri ohjeet, ei tueta.




Lomakekenttien tunnukset

Jokaisella lomakekentällä on oltava siihen liittyvä tunnus. Vaikka kaikilla lomakentillä ei tarvitse olla tunnuksia, on erittäin suositeltavaa, että lomakekentillä on tunnukset.

Erityisesti Liquid Modessa:

  • Tunnuksia käytetään kentän visuaalisen esityksen parantamiseen.
  • Kenttään liittyvä tunnus sisältää käytettävyyttä koskevia vinkkejä. Kun kenttä on kohdennettu, näytönlukija käyttää tunnusta kentän ilmoittamiseen käyttäjälle.
  • Kenttä voidaan kohdentaa napsauttamalla tunnusta, kun taas valintanapin tai valintaruudun tapauksessa tunnuksen napsauttaminen muuttaa arvoa.

Lomakekentät voidaan yhdistää tunnuksiin HTML <label> -tageilla jollakin seuraavista tavoista:

  1. <label>-tagin sisällä oleva Acrobat Sign -lomakekenttä
    • <label>Allekirjoitus: {{sig_es_:signer1:signature}}</label>
  2. <label>-tagin for-määrite voi viitata lomakekentän nimeen sen yhdistämiseksi lomakekenttään.
    • {{sig_es_:signer1:signature}} … <label for=”sig”>Allekirjoitus: </label>

Tunnukset, joita ei voi yhdistää lomakekenttiin edellä esitetyillä säännöillä, hahmonnetaan yhdistämättömänä tunnuksen tekstinä.

Tämän lisäksi Acrobat Sign -tekstitagit tukevat :label-direktiiviä seuraavien lomakekenttätyyppien kohdalla:

  • Liitetiedostot
  • Hyperlinkit
  • Valintaruudut
  • Valintanapit

Acrobat Signin tekstitagit :label-direktiivi ja <label>-tagi voidaan yhdistää seuraavilla tavoilla:

Lomakekentän tyyppi

:label-ohjeen rooli

HTML <label> -tagin rooli

Liitetiedostot,

Hyperlinkit

Määrittää lomakekenttäruudussa näytettävän tunnuksen.

<label>-tagi määrittää lomakekentän tunnuksen tai otsikon.

Valintaruutu,

Valintanappi-vaihtoehto

Määrittää lomakekentän tunnuksen tai otsikon.

Jos Acrobat Sign -tekstitunnisteen :label-direktiivi puuttuu, lomakekenttään lisätään sen tilalle <label>.

Jos sekä :label että <label> ovat läsnä, Liquid Mode -näkymän luonti epäonnistuu.

Esimerkkejä:

  • {{CB_es_:checkbox: signer1:label("I agree.")}}} <label for=” CB”> Kyllä</label>
  • {{(Red_v)Color_es_:signer1::label(“Red Color”)} <label for=”(Red_v)Color”>Red</label>
Muistiinpano

Valintaruuduille voidaan määrittää tunnuksia seuraavin tavoin:

  • {{CB_es_:checkbox: signer1:label("I agree.")}}
  • <label> {{CB_es_:checkbox:signer1}} Hyväksyn.</label>
  • {{CB_es_:checkbox:signer1}} <label for="CB"> Hyväksyn.</label>

Valintanappi-vaihtoehdoille voidaan määrittää tunnuksia seuraavin tavoin:

  • {{(Red_v)Color_es_:signer1:label(“Red”)}}
  • <label> {{(Red_v)Color_es_:signer1}} Red </label>
  • {{(Red_v)Color_es_:signer1}} <label for=”(Red_v)Color”>Red</label>
Varoitus

HTML-koodissa for-määrite viittaa normaalisti kentän tunnuksen arvoon.  Liquid Modessa for-määritettä käytetään viittaamaan kenttien nimiin.  Tämä voi aiheuttaa kloonattujen lomakekenttien tapauksessa epäselvyyttä, sillä lomakekentistä voi olla useita esiintymiä, joilla on täysin sama Acrobat Sign -tekstitagin direktiivi.  Tässä tapauksessa meidän on vältettävä for-määritteen käyttöä ja yhdistettävä tunnukset sisällyttämällä tekstitagi <label>-elementtiin.

Esimerkiksi seuraavassa tapauksessa luodaan kloonattuja lomakekenttiä, joilla on eri tunnukset mobiililaitteen uudelleenjuoksutusnäkymän kahta esiintymää varten:

  • <label> Official {{name_of_official_es_:signer1}} </label>
  • <label> Name {{name_of_official_es_:signer1}} </label>

Jos kloonatussa lomakekentässä on määritetty tunnus for-määritteellä, viittaukset ovat epäselviä, eikä niitä voi ratkaista.  Tässä tapauksessa Liquid Mode -näkymää ei luoda.

 Esimerkiksi seuraavassa tapauksessa luodaan vain PDF-näkymä:

  • <label for="name_of_official> Official </label> {{name_of_official_es_:signer1}}
  • <label for="name_of_official> Name</label> {{name_of_official_es_:signer1}}


Kenttäryhmien tunnusryhmät

Tunnukset yhdistetään yhteen lomakekenttään. Kun tunnus tai kuvaus halutaan yhdistää kenttien ryhmään (erityisesti valintanappien ryhmiin), kehotamme käyttämään fieldset- ja legend-elementtejä.  Fieldset-elementtiä käytetään elementtien ryhmittämiseen, kun taas legend-elementtiä käytetään ryhmän kuvauksen tai tunnuksen määrittämiseen.  Tunnuksen tavoin Liquid Moden edut ovat seuraavat:

  • kenttäryhmään liittyvän kuvauksen tai otsikon parempi visuaalinen esitys
  • hyvä helppokäyttökokemus.  Näytönlukijat ilmoittavat kenttäryhmän selitteen sisällön avulla oikein.

Esimerkki:

<fieldset>

        <legend>Choose your favorite primary color</legend>             

        {{(Red)Color_es_:signer1:label("Red")}}<br/>       

        {{(Blue)Color_es_:signer1:label("Blue")}}<br/>       

        {{(Green)Color_es_:signer1:label("Green")}}<br/>       

</fieldset>

Muistiinpano

Useimpien dokumenttien tapauksessa tekijä ei halua käyttää kenttäjoukon oletusarvoista hahmonnusta. 

Muokkausalue voidaan poistaa tällä CSS:llä:

    fieldset {

        border: none;

        margin: 0;

        padding: 0;

    }

Tuetut kuvat

Kuvia tuetaan seuraavin rajoituksin:

  • Vain <img>-elementtiä tuetaan.
  • src elementille <img> voidaan antaa upotettuna tietona (tiedot: skeema) tai verkon URL-osoitteena (https: vain skeema)
  • Seuraavia muotoja tuetaan: JPEGPNGGIFBMP ja TIFF
    • Animoidut GIF-tiedostot: ensimmäistä pysäytyskuvaa käytetään kiinteänä kuvana
  • Verkon URL-osoitteesta peräisin olevan kuvan kokorajoitus on 5 Mt


Ei tuetut Acrobat Sign -työnkulut

Liquid Mode ei tue seuraavia Acrobat Signin työnkulkuja:

  • Useiden dokumenttien pohjalta luotuja sopimuksia
  • Muiden kuin HTML-dokumenttien pohjalta luodut sopimukset
  • kirjastomalleista luotuja sopimuksia
  • DRAFT- tai AUTHORING-tiloissa luotuja sopimuksia
  • digitaalisia allekirjoitustyönkulkuja
  • Kirjoitetun allekirjoituksen työnkulku
  • Muokkaa käynnissä olevia työnkulkuja
  • työnkulkuja ryhmiltä, joilla Esikatselu-valintaruutu on oletusarvoisesti käytössä
  • sopimuksia, joissa allekirjoittamisen syyt on otettu käyttöön
  • sopimukset, joissa allekirjoittajaa pyydetään suorittamaan todennus aina, kun allekirjoittaja napsauttaa allekirjoituskenttää.

Mikäli sopimusta yritetään luoda Liquid Mode -näkymässä edellä mainituilla työnkuluilla, se luodaan ainoastaan PDF-näkymässä.  Lähettäjälle lähetetyssä vahvistussähköpostiviestissä on lueteltu syyt, miksi Liquid Modea ei voitu luoda.


Liquid Moden virheilmoitus

Jos lähettäjä yritti luoda sopimuksen Liquid Mode -näkymässä, mutta Acrobat Sign ei pystynyt luomaan sitä, lähettäjälle kerrotaan sopimuksen vahvistussähköpostiviestissä ongelmat, jotka estivät Liquid Mode -näkymän luonnin. Lähettäjä voi korjata ilmoitetut ongelmat ja yrittää luoda sopimuksen Liquid Mode -näkymässä uudemman kerran.

Ilmoitetut ongelmat voidaan ryhmittää seuraaviin luokkiin:

  • Ei tuetut HTML-rakenteet
  • Ei tuetut Acrobat Sign -tekstitagit
  • Ei tuetut Acrobat Sign -työnkulut
  • Liquid Moden sisäinen virhe.

Liquid Moden sisäiset virheet ilmenevät, kun palvelin kohtaa Liquid Mode -näkymää luotaessa odottamattoman virheen.

Muiden virheluokkien tapauksessa löydät ilmoitettujen ongelmien tiedot seuraavista alakohdista:

Jos Liquid Mode -näkymää ei voi luoda tukemattomien HTML-rakenteiden vuoksi, lähettäjälle lähetettävä vahvistussähköpostiviesti sisältää yhden tai useamman seuraavista virhemerkkijonoista:

Virhemerkkijonot

Tukematon elementti [+tagName]

Tukematon URL-protokolla [+url]

Taulukoiden lomakekenttiä ei tueta [+tagName]

Sisäkkäisiä taulukoita ei tueta.

Virheellinen alatunnus [+tagName]

Lisätietoja on Tuetut HTML-tagit -kohdassa.

Jos Liquid Mode -näkymää ei voi luoda ei tuettujen Acrobat Sign -tekstitagien rakenteiden vuoksi, lähettäjän saama vahvistussähköpostiviesti sisältää yhden tai useamman seuraavista virhemerkkijonoista:

Virhemerkkijonot

Viittauksen määritelmätagia ei löydy [+shortName]

Esitäytettyjä kenttiä ei tueta [+name]

Sisäisiä hyperlinkkejä ei tueta [+name]

Nimettömiä kenttiä tuetaan vain valintaruutujen tapauksessa.

Kenttiä, joilla on sama nimi, mutta eri ohjeet, ei tueta [+name]

Digitaalisia allekirjoituksia ei tueta [+name]

Kentillä ei ehkä ole sekä tunnuselementtiä että tunnusohjetta [+name]

Tekstitagin Sign-lomakekenttä puuttuu: [+name]

Lisätietoja on Lomakekenttien määritys -kohdassa.

Jos Liquid Mode -näkymän luonti epäonnistui ei tuettujen Acrobat Sign -työnkulkujen vuoksi, lähettäjän saama vahvistussähköpostiviesti sisältää yhden tai useamman seuraavista virhemerkkijonoista:

Virhemerkkijonot

Sopimus on kirjastomalli.

Sopimus edellyttää kirjoitettua allekirjoitusta.

Sopimuksen CFR-asetus Allekirjoittamisen syy on käytössä.

Sopimuksen CFR-asetus Sähköisen allekirjoittamisen uudelleenvaltuutus on käytössä.

Lisätietoja on Lomakekenttien määritys -kohdassa.


HTML-mallidokumentti: luottoraporttipyyntö

Liquid Modea kannattaa käyttää ensisijaisesti

  • dokumenteissa, joissa on mahdollisesti paljon nipistämistä ja zoomaamista vaativia suuria tekstilohkoja
  • lomakkeissa, joissa ei ole päällekkäisiä kenttiä ja joissa kenttien Liquid Mode -työnkulun käyttö on hyväksyttävää.

<!DOCTYPE html>

<html lang="en">

 

<head>

    <meta charset="UTF-8">

    <title>Sample Title</title>

    <link rel="stylesheet" href="css/all.css">

    <style>

    body {

        font-family: Arial, Helvetica, sans-serif;

        font-size: 12px

    }

    fieldset {

        border: none;

        margin: 0;

        padding: 0;

    }

 

    legend {

        float: left;

    }

 

    h2 {

        margin: 10px 0;

        font-size: 13px;

        margin: 20px 0 0 0;

    }

 

    h3 {

        margin: 0;

        font-size: 12px;

    }

 

    ul {

        margin: 0;

    }

 

    li {

        margin-bottom: 3px;

        padding-left: 5px;

    }

     

    p {

        margin: 4px 0;

    }

 

    .header {

        border-bottom: 2px solid #000;

        margin: 0 5px 15px 5px;

    }

 

    .header h1 {

        font-weight: 700;

        margin: 0;

        font-size: 15px;

    }

 

    .body {

        border: 1px solid #000;

        padding: 0 5px 10px 5px;

    }

   

    .page {

        padding: 0 25px;

        margin: 0 auto;

    }

     

    .txt_logo {

        font-size: 30px;

        color:blue;

        font-style:oblique

    }

 

    .textTag {

        padding: 9px 0;

        border-bottom: 2px solid #000;

        margin: 0 -4px 5px 0

    }

 

    .underline {

        text-decoration: underline;

        font-weight: 700;

        font-size: 12px

    }

     

    .columns-2 .item {

        width: 49%

    }

 

    .columns-3 .item {

        width: 33%

    }

 

    .item {

        display: inline-block

    }

     

    .address .item {

        width: 16%

    }

 

    .item.big {

        width: 30%

    }

 

    .checkbox {

        margin: 15px 0

    }

 

    .checkbox span {

        font-weight: 700;

        font-size: 11px

    }

 

    .card-info label {

        width: 12%;

        font-size: 11px;

        text-transform: capitalize

    }

 

    .card-info p {

        border-bottom: 1px solid #000;

        margin-right: 10px;

        padding-bottom:5px;

        display: inline-block

    }

 

    .card-number {

        width: 40%;

    }

 

    .expiry-date {

        width: 25%;

    }

 

    .radio-button label {

        width: 55%

    }

     

    .radio-button .item {

        width: 16%

    }

     

    .note {

        font-size: 12px

    }

 

    .footer {

        padding: 0 10px;

        font-size: 11px;

    }

    </style>

</head>

 

<body>

    <div class="page">

        <div class="header">

            <h2 class="txt_logo"><b>SAMPLE COMPANY</b></h2>

            <h1 class="h1_header">SAMPLE REQUEST TO OBTAIN MY FREE CREDIT REPORT </h1>

        </div>

        <div class="body">

            <h3>Sample Important Information & Instructions:</h3>

            <p>In order to protect your personal information we will validate your identity before mailing your credit report to your <u>confirmed</u>

                home address. You must provide a photocopy of the front and back of:</p>

            <ul class="info">

              <li class="info__item">Two pieces of government-issued identification</li>

              <li class="info__item">If your address is not up-to-date on either identification, you <u>must also</u> provide an additional document showing your <u>current home address</u> (e.g. a utility bill>).</li>

              <li class="info__item">If you provide your <b>Social Insurance Number</b>, we will cross-reference it with our records to ensure that we disclose the correct information to you. Knowing it helps us avoid delays and confusion in case another individual's identifying information (such as name and address) is similar to the one you provided.</li>

              <li class="info__item">If you provide a <b>credit card </b>statement or copy of your <b>credit card</b> as proof, please ensure to <b>blackout</b> your private information.</li>

            </ul>

            <p>The information you provide on the form will be used to confirm your identity and may also be used to update your credit report. Such updated information will be stored, safeguarded, used and/or disclosed in the normal course as part of your credit file. For more information about SAMPLE COMPANY’s privacy practices, please see our Privacy Policy at https://www.adobe.com/privacy/policy.html. For clarity, in any case, we will keep a copy of the information you provide to demonstrate that we complied with our obligation to obtain reasonable identification from you.

            </p>

            <p>Please send your completed form with proof of identity to: <b>Lorem inseam dolor sit amen, consenttetur</b>or by fax to: <b>XXX-XX-XXXX.</b>Kindly allow X-Y days for delivery. If any corrections to your credit report are necessary you must complete the Credit Report Update form enclosed with your package, or visit <a href="http://sampleurl">SampleURL</a> and click on “How to File a Something” under Our Sample Assistance.

            </p>

        </div>

        <div class="form">

            <div class="columns-3">

                <div class="item">

                    <p class="textTag">{{*LastName_es_:signer1}}</p>

                    <label for="LastName">LAST NAME </label>

                </div>

                <div class="item">

                    <p class="textTag">{{*FirstName_es_:signer1}}</p>

                    <label for="FirstName">FIRST NAME, INITIAL</label>

                </div>

                <div class="item">

                    <p class="textTag">{{Suffix_es_:signer1}}</p>

                    <label for="Suffix">SUFFIX (Sr., Jr., etc.)</label>

                </div>

            </div>

            <div class="address">

                <div class="item big">

                    <p class="textTag">{{*StreetAddress_es_:signer1&nbsp;}}</p>

                    <label for="StreetAddress">CURRENT STREET ADDRESS </label>

                </div>

                <div class="item">

                    <p class="textTag">{{*Apt_es_:signer1}}</p>

                    <label for="Apt">APT.</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*City_es_:signer1}}</p>

                    <label for="City">CITY</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*Prov_es_:signer1}}</p>

                    <label for="Prov">PROVINCE</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*Zip_es_:signer1:zip}}</p>

                    <label for="Zip">POSTAL CODE</label>

                </div>

            </div>

            <h2>PREVIOUS ADDRESS(ES) WITHIN LAST 3 YEARS</h2>

            <div class="address">

                <div class="item big">

                    <p class="textTag">{{*StreetAddressPr_es_:signer1&nbsp;}}</p>

                    <label for="StreetAddressPr">PREVIOUS STREET ADDRESS </label>

                </div>

                <div class="item">

                    <p class="textTag">{{*AptPr_es_:signer1}}</p>

                    <label for="AptPr">APT.</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*CityPr_es_:signer1}}</p>

                    <label for="CityPr">CITY</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*PrvPr_es_:signer1}}</p>

                    <label for="PrvPr">PROVINCE</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*ZipPr_es_:signer1:zip}}</p>

                    <label for="ZipPr">POSTAL CODE</label>

                </div>

            </div>

            <div>

                <p class="textTag">{{*EmailAddress_es_:signer1:isemail}}</p>

                    <label for="EmailAddress">EMAIL</label>

            </div>

            <div class="columns-2">

                <div class="item">

                    <p class="textTag">{{$DATEOFBIRTH}}</p>

                    <label for="Date">DATE OF BIRTH </label>

                </div>

                <div class="item">

                    <p class="textTag">{{SocialSecurityNumber_es_:signer1:ssn}}</p>

                    <label for="SocialSecurityNumber">S.I.N.:</label>

                </div>

            </div>

            <div class="columns-2">

                <div class="item">

                    <p class="textTag">{{$NAMEMAJORCARD}}</p>

                    <label for="NameMajorCard">NAME OF MAJOR CREDIT CARD:</label>

                </div>

                <div class="item">

                    <p class="textTag">{{$LAST4}}</p> <label for="Last4">LAST 4 DIGITS OF MAJOR CREDIT CARD:</label>

                </div>

            </div>

            <div class="columns-2">

                <div class="item">

                    <p class="textTag">{{*Signature_es_:signer1:signature}}</p><label for="Signature">Signature</label>

                </div>

                <div class="item">

                    <p class="textTag">{{*DateOfSignature_es_:signer1:date}}</p><label for="DateOfSignature">Date</label>

                </div>

            </div>

            <div class="checkbox">

                 <label class="underline">{{$PAY}}  YES, I WOULD ALSO LIKE TO PURCHASE MY Sample Company SCORE* FOR $X.XX (tax included)</label>

            </div>
            <fieldset>
            <legend> Valtuutan esimerkkiyrityksen veloittamaan maksun luottokortiltani:</legend>

              <div class="radio-button">

                <div class="item"><label>{{$V}}Visa</label></div>

                <div class="item"><label>{{$M}}MasterCard</label></div>

                <div class="item"><label>{{$A}}AMEX</label></div>

              </div>
            </legend>

            <div class="card-info">

                <label for="CardholderName">Cardholder Name:</label>

                <p>{{$CALCULATEDCARDHOLDERNAME}}</p>

            </div>

            <div class="card-info">

                <label for="CardNumber">Card Number:</label>

                <p class="card-number">{{*CardNumber_es_:signer1}}</p> <label for="ExpiryDate">Expiry Date:</label>

                        <p class="expiry-date">{{$EXPIRYDATE}}</p>

            </div>

            <div class="note">

                <p>Note: Cheque and cash payments are not accepted. Luottokortin omistajan nimen on oltava sama kuin hakijan nimi.</p>

            </div>

        </div>

        <div class="footer">

            <p>*Sample company’s XY is a product some service providers use when assessing applications for credit and services. It is not part of your sample credit report, but is based on the particular information in your credit file at the time it is calculated. Lorem Ipsem is not the same as the Lorem Ipsem, which is also used by some lenders. Sample Company will provide your sample report free of charge, whether or not you purchase your Lorem Ipsem. <b>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sample company can provide more sample services:</b> Sample Address Telephone: 1-XXX-XXX-XXXX Telephone in Sample: 1-XXX-XXX-XXXX</p>

        </div>

    </div>

    <!--  SIVUKATKOS -->

    <div style="page-break-after:always"></div>

    <!-- SIGN-tekstitunnusmääritykset -->

    {{#REMOVE_PAGE_FROM_OUTPUT}}

   

    <!-- valintaruutu -->

    <p>{{#PAY=*Pay_es_:signer1:checkbox}}</p>

 

    <!-- radiopainike ja aktivoitava ehtosääntö, jos Maksa on valittu -->

    <p>{{#V=(Visa)CCard_es_:signer1:enableif(Pay=checked)}}</p>

    <p>{{#M=(MasterCard)CCard_es_:signer1:enableif(Pay=checked)}}</p>

    <p>{{#A=(AMEX)CCard_es_:signer1:enableif(Pay=checked)}}</p>

 

    <!-- pudotus -->

    {{#NAMEMAJORCARD=*NameMajorCard_es_:dropdown(options="Visa,MasterCard,AMEX,Discover")}}

 

    <!-- laskettu kenttä -->

    <p>{{#CALCULATEDCARDHOLDERNAME=*CardholderName_es_:signer1:calc([FirstName]+"&nbsp;"+[LastName]+"&nbsp;"+[Suffix])}}

     

    <!-- säännöllisen lausekkeen muotoilun validoiminen -->

    <p>{{#LAST4=*Last4_es_:signer1:custom(regexp="^[0-9]{4}$")}}

    <p>{{#CREDITCARDNUMBER=*CardNumber_es_:signer1:custom(regexp="^[0-9]{16}$")}}</p>

 

    <!-- päivämäärien vahvistukset -->

    <p>{{#EXPIRYDATE=*ExpiryDate_es_:isdate(format=mm/yy)}}</p>

    <p>{{#DATEOFBIRTH=*Date_es_:signer1:isdate(format=mm/dd/yyyy)}}</p>

 

</body>

 

</html>

 

HTML-dokumentti selaimessa

Perinteinen PDF-tiedoston näkymä Acrobat Signissa

Sopimusnäkymä:

Liquid Mode -näkymä


Tunnetut ongelmat ja UKK

Suosittelemme, että kun luot HTML-tiedostoa, testaat HTML-tiedoston muutaman kerran ja varmistat, että siinä ei ole virheitä ja että se vastaa työnkulun yleisiä ehtoja, ennen lähetät sen aiotuille vastaanottajille.

HTML-dokumentin HTML-elementtien on seurattava dokumentin lukujärjestystä. 

Dokumentin sivunvaihdot on määritettävä eksplisiittisesti CSS:n page-break-after-ominaisuudella seuraavalla tavalla:

<div style="page-break-after:always"></div>

Dokumentin uudelleensuunnittelu uudelleenjuoksutusta ajatellen saattaa parantaa yleistä mobiilikokemusta. Jos ET harkitse dokumentin uudelleensuunnittelua, sinun kannattaa säilyttää alkuperäisen PDF-tiedoston yleinen ulkoasu ja käyttötuntuma muutamin poikkeuksin:

  • Sivutason artefaktoille ei suoriteta erikoiskäsittelyä Liquid Modessa. Jos HTML-dokumentissa on sivutason artefaktoja, kuten yläviitteitä, alaviitteitä ja vesileimoja, ne saattavat ilmestyä uudelleenjuoksutusnäkymässä uudelleenjuoksutetun sisällön keskelle.

  • Jos lomakkeessa on lomakekenttien täyttöohjeita, kuten ”PLEASE PRINT” tai ”OPTIONAL”, tai muotoiluohjeita, kuten ”(mm/dd/yyyy)”, älä sisällytä tekstiä HTML-koodiin. Jotkin tiedot, kuten muotoiluohjeet ”(mm/dd/yyyy)” tai lomakekentän määrite ”OPTIONAL”, on määritettävä lomakekentän määrityksissä tekstitageilla.  

  • Jotkin tekstit saattavat edellyttää yhdistettyjen tietojen keräämistä. Tietojen jakaminen useampiin lomakekenttiin helpottaa käyttöä. Esimerkiksi edellä mainitussa mallidokumentissa ”NAME & LAST 4 DIGITS OF MAJOR CREDIT CARD” on jaettu ”NAME OF MAJOR CREDIT CARD”- ja ”LAST 4 DIGITS OF MAJOR CREDIT CARD” -kentiksi.

  • Käytä vain tuettuja HTML-tageja, jotka on mainittu edellä. Perehdy HTML-rakenteita käsittelevään osioon.

  • Käytä suhteellisia koordinaatteja ja sijainteja, kuten {width: 30%}, jotta HTML-dokumentin sisältö voidaan juoksuttaa uudelleen laitteiden leveyksien mukaan. CSS:ssä ei pidä käyttää absoluuttista sivun leveyttä. 

  • Jos PDF-tiedosto sisältää taulukko- tai luettelorakenteen, vastaavan HTML-esityksen pitäisi olla vastaavasti taulukko tai luettelo. Ainoan poikkeuksen tästä muodostavat lomakekenttiä sisältävät taulukot. Jos taulukossa on lomakekenttiä, samat tiedot on esitettävä ilman taulukoita.

Entistä monipuolisemman verkkolomakkeen täyttökokemuksen varmistamiseksi suosittelemme, että lomakekentät luodaan hyödyntämällä kaikkia Sign-tekstitagien tarjoamia tarkistuksia, muotoilulausekkeita, ehdollisia sääntöjä ja laskentakaavoja.

  • Lomakekenttien nimien on oltava yksilöllisiä, jos ne edustavat eri entiteettejä.
  • On erittäin suositeltavaa, että jokaiselle lomakekentälle luodaan tunnus käyttämällä lomakekenttää tai for-määritettä.
  • Jos lomakenttä on VALINNAINEN, se on määritettävä Sign-tekstitageissa. Esimerkki:
    • {{*S.I.N_es_:signer1}} edustaa pakollista lomakekenttää.
    • {{S.I.N_es_:signer1}} edustaa valinnaista lomakekenttää.
  • Sign-tekstitagit tarjoavat muun muassa erilaisia alueen ja enimmäispituuden tarkistustoimintoja postinumeron, sosiaaliturvatunnuksen, päivämäärän, sähköpostin ja valuuttojen numeroille. Käytä niitä.
  • Sign-tekstitagit sisältävät myös lomakekenttien muotoilun, kuten päivämäärän ja valuutan muodon. Niiden käyttö on erittäin suositeltavaa.
  • Kaikilla valintaruuduilla on oltava tunnukset. Esimerkki:

<label> {{[]}} YES, I WOULD ALSO LIKE TO PURCHASE MY CREDIT SCORE</label>

  • Jos paperi- tai PDF-muotoisessa lomakkeessa on valintaruuduilta näyttäviä lomakekenttiä, mutta tässä lomakkeessa on toisensa poissulkevat arvot, kuten Kyllä- ja Ei-kysymyksiä tai Visa/MasterCard/AMEX-kysymys, yhdistä kaikki lomakekentät ryhmäksi, jotta niistä voidaan tehdä lomakekenttätyyppinen valintanappi tai avattava valikko yksittäisten valintaruutujen sijaan ja sisällyttää niihin tunnus tai otsikko.     

<fieldset>

<legend>Payment Options:</legend>

{{#VISA=(Visa)CCard_es_:label("Visa"):signer1:enableif(Pay=checked)}}

({#MCARD=(MasterCard)CCard_es_:label("MasterCard"):signer1:enableif(Pay=checked)}}

{{#AMEX=(AMEX)CCard_es_:label("AMEX"):signer1:enableif(Pay=checked)}}

</fieldset>

  • Sign-tekstitagit määrittävät myös hahmonnetun sivun lomakekenttien mittasuhteet sivun hahmonnetun Sign-tekstitagin mittasuhteiden perusteella. Sign-tekstitagin määritys mahdollistaa lomakekentän mittasuhteiden lyhentämisen. Tee artikkelista https://helpx.adobe.com/fi/sign/using/text-tag.html haku sanoilla ”Tekstitagien lyhentäminen” ja ”Pitkät tekstitagit”. Yleinen tekniikka on määrittää HTML-dokumentin lopusta osa, joka sisältää erittäin pitkien tekstitagien määritelmätagit, ja käyttää HTML-leipätekstissä viittaustageja. Tässä on joitakin esimerkkejä määritelmätageista:

<div style="page-break-after:always"></div>

{{#REMOVE_PAGE_FROM_OUTPUT}}

{{#CCARDDROPDOWN=*ccardDropDown_es_:dropdown(options="Visa,MasterCard,AMEX")}}

{{#VI=*(Visa)CCard_es_:signer1}}

{{#MC=*(MasterCard)CCard_es_:signer1}}

{{#AM=*(AMEX)CCard_es_:signer1}}

{{#DATEOFBIRTH=*Date_es_:signer1:isdate(format(dd/mm/yy)}}