Självstudiekurs: Publish ditt adaptiva formulär tutorial-publish-your-adaptive-form

Hero-image

Den här självstudiekursen är ett steg i serien Create Your First Adaptive Form . Vi rekommenderar att du följer serien i kronologisk ordning för att förstå, utföra och demonstrera det fullständiga självstudiekurserna.

När det adaptiva formuläret är klart kan du publicera det för att göra det tillgängligt för slutanvändarna. Slutanvändarna kan öppna det publicerade formuläret på vilken enhet och webbläsare som helst. När ett anpassat formulär publiceras kopieras formuläret och det tillhörande innehållet från en AEM författarinstans till en AEM publiceringsinstans. Formuläret görs tillgängligt för slutanvändaren via publiceringsinstansen.

Du kan publicera ett anpassat formulär på följande sätt:

Innan du börjar before-you-start

  • Konfigurera en AEM Forms-publiceringsinstans: Publiceringsinstansen är en publik instans av AEM Forms som körs i publiceringsläge. I en produktionsmiljö ligger publiceringsinstansen utanför organisationens brandvägg.
  • Konfigurera replikering och omvänd replikering: Replikering kopierar innehåll från författarinstansen till en publiceringsinstans och returnerar användarindata (till exempel formulärindata) från publiceringsinstansen till författarinstansen.

Publish adaptiva formulär som en AEM sida publish-the-adaptive-form-as-an-aem-page

När det adaptiva formuläret publiceras som en AEM sida innehåller hela webbsidan bara det publicerade formuläret. Du kan använda URL:en för det adaptiva formuläret för att länka det från en annan webbsida. Så här publicerar du det adaptiva formuläret shipping-address-add-update-form som en AEM sida:

  1. Logga in på AEM Forms författarinstans och leta reda på formuläret shipping-address-add-update-form adaptive i AEM Forms UI.
    https://localhost:4502/aem/forms.html/content/dam/formsanddocuments
  2. Välj adaptiv blankett för leverans-adress-add-update-form och välj Publish. En dialogruta med resurser som är kopplade till det adaptiva formuläret visas. Välj Publish. Det anpassningsbara formuläret publiceras och en dialogruta visas.
  3. Öppna formuläret i publiceringsinstansen. Formuläret kan fyllas i och skickas av användaren.
    https://localhost:4503/content/forms/af/shipping-address-add-update-form.html

Bädda in det anpassningsbara formuläret på en AEM Sites-sida embed-the-adaptive-form-in-an-aem-sites-page

AEM Forms tillåter formulärutvecklare att sömlöst bädda in adaptiva formulär på en AEM Sites -sida. Det inbäddade adaptiva formuläret fungerar fullt ut och användarna kan fylla i och skicka formuläret utan att behöva lämna sidan. Det hjälper användaren att stanna kvar i sitt sammanhang för andra element på webbsidan och interagera samtidigt med formuläret.

AEM Forms tillhandahåller en komponent, AEM Forms Container, för att bädda in ett adaptivt formulär på en AEM Sites -sida. Komponenten är som standard inte synlig i AEM Sites. Utför följande steg för att aktivera AEM Forms Container-komponenten och bädda in det adaptiva formuläret på en AEM Sites -sida:

  1. Skapa och öppna en sida på webbplatsen We.Retail för redigering. Exempel: https://localhost:4502/editor.html/content/we-retail/us/en/user/shipping-and-billing-address.html. Det adaptiva formuläret är inbäddat på sidan Sites.

    Du kan även bädda in det adaptiva formuläret på en befintlig webbsida. Detaljhandel Site’s. Till exempel sidan OM USA https://localhost:4502/editor.html/content/we-retail/us/en/about-us.html. Du sparar tid när du skapar en sida. Stegen nedan använder den nya sidan.

    Webbplatsen We.Retail levereras med AEM. Om du inte har installerat webbplatsen We.Retail ska du läsa Implementering av referens för butik för att installera webbplatsen.

  2. Välj sidinformation för egenskaper och välj alternativet Edit Template på den nyligen skapade webbsidan för webb.butik. Sidmallen öppnas på en ny flik i webbläsaren.

  3. Markera i rutan layout container och välj feedmanagement . Expandera dragspelet General på fliken Allowed Components, markera alternativet AEM Form och välj save_icon . AEM Forms-behållarkomponenten är aktiverad för sidan.

  4. Öppna webbläsarfliken som innehåller AEM Sites sida som öppnats i steg 1. Markera rutan Drag components here och välj +. I rutan Insert New Component väljer du AEM Form. Komponenten AEM Forms Container läggs till på sidan.

  5. Markera komponenten AEM Forms container och välj configure-icon . En dialogruta med egenskaper för AEM Forms-behållare visas. I fältet Asset Path bläddrar du till och väljer formuläret shipping-address-add-update-form adaptive. Välj save_icon . Det anpassningsbara formuläret är inbäddat på sidan.

  6. Publish både adaptiva formulär och sidan Sites. Här är några saker att tänka på:

    • Om du publicerar sidan AEM Sites för första gången och den innehåller ett inbäddat formulär publicerar du sidan Sites och det inbäddade formuläret.

    • Om du bara ändrar det inbäddade formuläret på en publicerad webbplatssida publicerar du det ursprungliga formuläret och ändringarna återspeglas på den publicerade webbplatssidan. Den publicerade webbplatssidan innehåller en referens till formuläret och behöver inte publicera om sidan.

    • Om du ändrar sidan Sites och det inbäddade formuläret publicerar du om sidan Sites och formuläret.

      embed-in-aem-sites

    Formuläret för ändring av leverans- och faktureringsadress har lagts till på en AEM Sites-sida.

Bädda in det anpassningsbara formuläret på en extern webbsida embed-the-adaptive-form-in-an-external-webpage

Du kan bädda in ett adaptivt formulär på en extern webbsida (en icke-AEM webbsida som är värd utanför AEM) genom att infoga några rader med JavaScript på den externa webbsidan. JavaScript-koden skickar en HTTP-begäran till AEM Forms-servern för det adaptiva formuläret och relaterade resurser och lägger till det adaptiva formuläret på webbsidan. Detaljerade steg finns i Bädda in det adaptiva formuläret på en extern webbsida.

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2