Openingspagina's landing-pages

Met de functie voor het plaatsen van pagina's kunt u snel en eenvoudig een ontwerp en inhoud rechtstreeks in een AEM-pagina importeren. Een webontwikkelaar kan de HTML en aanvullende elementen voorbereiden die als een volledige pagina of als een deel van een pagina kunnen worden geïmporteerd. De functionaliteit is handig om bestemmingspagina's voor marketingdoeleinden te maken die slechts gedurende een beperkte tijd actief zijn en snel moeten worden gemaakt.

Deze pagina beschrijft het volgende:

Het voorbereiden van het ontwerppakket voor het invoeren wordt behandeld in Uitbreidend en het Vormen van de Importeur van het Ontwerp. Het integreren met Adobe Analytics wordt behandeld in Integrating Landing Pages met Adobe Analytics.

Wat zijn bestemmingspagina's? what-are-landing-pages

Landingspagina's zijn sites met één of meerdere pagina's die het 'eindpunt' zijn van een marketingstrategie, bijvoorbeeld met e-mail, adwords/banners, sociale media. Een landingspagina kan verschillende doelen dienen, maar heeft allemaal één ding gemeen: de bezoeker moet een taak uitvoeren en dat bepaalt het succes van een landingspagina.

Met de functie Landing Pages in AEM kunnen marketers samenwerken met webontwerpers bij agentschappen of interne creatieve teams om paginaontwerpen te maken die gemakkelijk in AEM kunnen worden geïmporteerd en nog steeds bewerkbaar zijn voor de marketers en die worden gepubliceerd onder hetzelfde bestuur als de rest van de door AEM aangedreven sites.

In AEM kunt u bestemmingspagina's maken door de volgende stappen uit te voeren:

Openingspagina's bureaublad desktop-landing-pages

Een voorbeeld van een landingspagina in AEM ziet er als volgt uit:

Mobiele bestemmingspagina's mobile-landing-pages

Een openingspagina kan ook een mobiele versie van de pagina hebben. Om een afzonderlijke mobiele versie van de het landen pagina te hebben moet het de invoerontwerp twee HTML- dossiers hebben: index.htm (l) en mobile.index.htm (l).

De invoerprocedure voor de landingspagina is dezelfde als die van een normale openingspagina. Het ontwerp van de bestemmingspagina heeft een extra HTML-bestand dat overeenkomt met de bestemmingspagina. Dit HTML-bestand moet ook een canvas div met id=cqcanvas hebben, net als de bestemmingspagina van het bureaublad html en het ondersteunt alle bewerkbare componenten die worden beschreven voor de openingspagina van het bureaublad.

De mobiele openingspagina wordt gemaakt als een onderliggende pagina van de openingspagina van het bureaublad. Navigeer naar de openingspagina in Websites en open de onderliggende pagina om deze te openen.

Onderdelen van bestemmingspagina landing-page-components

Als u delen van de HTML die in AEM zijn geïmporteerd bewerkbaar wilt maken, kunt u inhoud binnen de landingspagina's van HTML rechtstreeks toewijzen aan AEM-componenten. De ontwerpimporteur begrijpt standaard de volgende componenten:

Bovendien is het mogelijk om dit uit te breiden en douanecomponenten te steunen. In deze sectie worden de componenten gedetailleerd beschreven.

Tekst text

Met de component Text kunt u een tekstblok invoeren in een WYSIWYG-editor. Zie component van de Tekstvoor meer informatie.

Hieronder ziet u een voorbeeld van een tekstcomponent op een bestemmingspagina:

Titel title

Met de titelcomponent kunt u een titel weergeven en de grootte configureren (h1-6). Zie {de component van de Titel 0} 🔗 voor meer informatie.

Hieronder ziet u een voorbeeld van een titelcomponent op een landingspagina:

Afbeelding image

De afbeeldingscomponent toont een afbeelding die u kunt slepen en neerzetten vanuit de Inhoudszoeker of waarop u kunt klikken om te uploaden. Zie beeldcomponentvoor meer informatie.

Hieronder ziet u een voorbeeld van een afbeeldingscomponent op een landingspagina:

Oproep tot actie (CTA) call-to-action-cta

Een landingspagina-ontwerp kan verscheidene verbindingen hebben - sommige kunnen als "Vraag aan actie"worden bedoeld.

De oproep tot actie (CTA) wordt gebruikt om de bezoeker onmiddellijk actie op de landingspagina te krijgen zoals "nu abonneren", "Deze video bekijken", "Alleen beperkte tijd", enzovoort.

Beide CTA-componenten hebben vergelijkbare opties. De optie Doorklikken via koppeling heeft extra tekstopties. De componenten worden in de volgende alinea's uitgebreid beschreven.

Klikken door koppeling click-through-link

Deze CTA-component kan worden gebruikt om een tekstkoppeling op de bestemmingspagina toe te voegen. Op die koppeling kan worden geklikt om de gebruiker naar de doel-URL te brengen die in de componenteigenschappen is opgegeven. Het maakt deel uit van de "Vraag aan Actie"groep.

Etiket de tekstgebruikers zien. U kunt opmaak wijzigen met de RTF-editor.

Doel URL gaat URI in u gebruikers wilt bezoeken als zij de tekst klikken.

teruggevend Opties beschrijft teruggevende opties. U kunt een van de volgende opties selecteren:

CSS op het lusje van de Stijl, ga een weg aan uw CSS stijlblad in.

identiteitskaart op het lusje van de Stijl, ga identiteitskaart voor de component in om het uniek te identificeren.

Hieronder ziet u een voorbeeld van een klik door een koppeling:

Grafische koppeling graphical-link

Deze CTA-component kan worden gebruikt om grafische afbeeldingen met een koppeling op de bestemmingspagina toe te voegen. De afbeelding kan een eenvoudige knop zijn of een grafische afbeelding als achtergrond. Wanneer op de afbeelding wordt geklikt, gaat de gebruiker naar de doel-URL die in de componenteigenschappen is opgegeven. Het is een deel van de Vraag aan de groep van de Actie.

Etiket de tekstgebruikers zien in grafisch. U kunt opmaak wijzigen met de RTF-editor.

Doel URL gaat URI in u gebruikers wilt bezoeken als zij het beeld klikken.

teruggevend Opties beschrijft teruggevende opties. U kunt een van de volgende opties selecteren:

CSS op het lusje van de Stijl, ga een weg aan uw CSS stijlblad in.

identiteitskaart op het lusje van de Stijl, ga identiteitskaart voor de component in om het uniek te identificeren.

Hier volgt een voorbeeld van een grafische koppeling:

Oproep tot actie (CTA) Lead Form call-to-action-cta-lead-form

Een formulier voor leads is een formulier dat wordt gebruikt om de profielgegevens van een bezoeker/lead te verzamelen. Deze informatie kan later worden opgeslagen en gebruikt om een efficiënte marketing te doen die op de informatie wordt gebaseerd. Deze informatie omvat gewoonlijk titel, naam, e-mail, geboortedatum, adres, rente, enzovoort. Het is een deel van de de vorm van de Lood van CTA groep.

Een voorbeeld van een CTA lead-formulier ziet er als volgt uit:

CTA-hoofdformulieren worden samengesteld uit verschillende onderdelen:

Het voorafgaande toont een voorbeeldvorm; het wordt samengesteld uit de 1} component van de Vorm van de Lood {(begin en eind), met Voornaam en E-mailId gebieden die voor input worden gebruikt en a legt gebied voor

Vanuit het hulpprogramma zijn de volgende componenten beschikbaar voor het CTA Lead-formulier:

Algemene instellingen voor veel onderdelen van formulieren voor lead settings-common-to-many-lead-form-components

Hoewel elk van de componenten van het hoofdformulier een ander doel heeft, bestaan veel van deze componenten uit vergelijkbare opties en parameters.

Wanneer u een van de formuliercomponenten configureert, zijn de volgende tabbladen beschikbaar in het dialoogvenster:

Voorloopformuliercomponenten lead-form-components

De volgende sectie beschrijft de componenten beschikbaar aan vraag-aan-actie leiden vormen.

Ongeveer laat gebruikers over informatie toevoegen.

Gebied van het Adres staat gebruikers toe om adresinformatie in te gaan. Wanneer u deze component configureert, moet u de elementnaam in het dialoogvenster invoeren. De elementnaam is de naam van het formulierelement. Dit geeft aan waar in de gegevensopslagruimte de gegevens worden opgeslagen.

Datum van de Geboortedatum De gebruikers kunnen datum van geboorteinformatie ingaan.

E-mailidentiteitskaart staat gebruikers toe om een e-mailadres (identificatie) in te gaan.

Voornaam verstrekt een gebied voor gebruikers om hun voornaam in te gaan.

De gebruikers van 0} Geslacht {kunnen hun geslacht van een dropdown lijst selecteren.

de Gebruikers van de Achternaam 0} {kunnen de informatie van de Familienaam ingaan.

Vorm van de Lood voegt deze component toe om een loodvorm aan uw het landen pagina toe te voegen. Een lead-formulier bevat automatisch het veld Start of Lead Form en End of Lead Form. Hierna voegt u de in deze sectie beschreven componenten Formulier lead toe.

De component van de Vorm van het Lood bepaalt zowel het begin als het eind van een vorm gebruikend het Begin van de Vorm en Eind van de Vorm elementen. Deze worden altijd gekoppeld om ervoor te zorgen dat het formulier correct is gedefinieerd.

Nadat u de loodvorm hebt toegevoegd, kunt u het begin van vorm of eind van vorm vormen door te klikken geeft in de overeenkomstige bar uit.

Begin van Vorm van de Leiding

Twee lusjes zijn beschikbaar voor configuratie Vorm en Geavanceerd:

Dank u Pagina de pagina die moet worden van verwijzingen voorzien om bezoekers voor het verstrekken van hun input te bedanken. Als het formulier leeg blijft, wordt het na verzending opnieuw weergegeven.

Werkschema van het Begin bepaalt welk werkschema wordt teweeggebracht zodra een loodvorm wordt voorgelegd.

de Opties van het Post De volgende postopties zijn beschikbaar:

Identifier van de Vorm Het vormherkenningsteken identificeert uniek de loodvorm. Gebruik de formulier-id als u meerdere formulieren op één pagina hebt. Zorg ervoor dat deze verschillende id's hebben.

Weg van de Lading is de weg aan knoopeigenschappen die worden gebruikt om vooraf bepaalde waarden in de gebieden van de loodvorm te laden.

Dit is een optioneel veld dat het pad naar een knooppunt in de repository aangeeft. Als dit knooppunt eigenschappen heeft die overeenkomen met de veldnamen, worden de desbetreffende velden op het formulier vooraf geladen met de waarde van die eigenschappen. Als er geen overeenkomst bestaat, bevat het veld de standaardwaarde.

Bevestiging van de Cliënt wijst erop of de cliëntbevestiging voor deze vorm wordt vereist (serverbevestiging komt altijd voor). Dit kan in combinatie met de Forms Captcha-component worden bereikt.

het Type van Middel van Bevestiging bepaalt het middeltype van de vormbevestiging als u de volledige loodvorm (in plaats van individuele gebieden) wilt bevestigen.

Als u het volledige formulier valideert, voert u ook een van de volgende handelingen uit:

Configuratie van de Actie Afhankelijk van de selectie in PostOpties, verandert de Configuratie van de Actie. Als u bijvoorbeeld Lead maken selecteert, kunt u instellen aan welke lijst de lead wordt toegevoegd.

Een bestemmingspagina maken creating-a-landing-page

Wanneer u een landingspagina maakt, moet u drie stappen uitvoeren:

Gebruik van de ontwerpimportmodule use-of-the-design-importer

Omdat bij het importeren van pagina's HTML moet worden voorbereid, gecontroleerd en de pagina's moeten worden getest, is het importeren van bestemmingspagina's een beheertaak. Als beheerder hebben de gebruikers die de importbewerking uitvoeren, lees-, schrijf-, maak- en verwijdermachtigingen voor /apps nodig. Als de gebruiker niet over deze machtigingen beschikt, mislukt het importeren.

Adobe raadt aan de importer van het ontwerp op een testexemplaar te gebruiken. Op een testinstantie kan de import worden getest en gevalideerd door een ontwikkelaar die vervolgens verantwoordelijk is voor het implementeren van de code in de productieinstantie.

Een importpagina maken creating-an-importer-page

Voordat u het ontwerp van de bestemmingspagina kunt importeren, moet u bijvoorbeeld een importerpagina maken in het kader van een campagne. Met de sjabloon Pagina importeren kunt u uw volledige HTML-landingspagina importeren. De pagina bevat een neerzetvak waarin het ontwerppakket van de bestemmingspagina kan worden geïmporteerd door slepen en neerzetten te gebruiken.

Een openingspagina maken:

HTML voorbereiden voor importeren preparing-the-html-for-import

Voordat u het ontwerppakket importeert, moet de HTML worden voorbereid. Zie Uitbreidend en Vormend de Invoer van het Ontwerpvoor meer informatie.

Het ontwerppakket importeren importing-the-design-package

Nadat een importerpagina is gemaakt, kunt u een ontwerppakket op deze pagina importeren. De details bij het creëren van het ontwerppakket en zijn geadviseerde structuur worden verklaard in Uitbreiden en het Vormen de Invoer van het Ontwerp.

Ervan uitgaande dat u het ontwerppakket klaar hebt, wordt in de volgende stappen beschreven hoe u het ontwerppakket op een importerpagina kunt importeren.

Werken met bestemmingspagina's working-with-landing-pages

Het ontwerp en de elementen voor een bestemmingspagina worden gewoonlijk gecreeerd door een ontwerper misschien bij een agentschap in hulpmiddelen die zij aan zoals Adobe Photoshop of Adobe Dreamweaver worden gebruikt. Wanneer het ontwerp is voltooid, stuurt de ontwerper een zip-bestand met alle elementen naar marketing. De contactpersoon bij marketing is dan verantwoordelijk voor het neerzetten van het ZIP-bestand in AEM en het publiceren van de inhoud.

Bovendien kan de ontwerper wijzigingen in de het landen pagina moeten aanbrengen nadat het door inhoud uit te geven of te schrappen en de vraag-aan-actie componenten te vormen wordt ingevoerd. Ten slotte wil de marketeer de bestemmingspagina voorvertonen en vervolgens de campagne activeren om ervoor te zorgen dat de bestemmingspagina wordt gepubliceerd.

In deze sectie wordt beschreven hoe u het volgende kunt doen:

Wanneer u het ontwerppakket invoert, Duidelijk Ontwerp en Geïmporteerde Download Zip zijn beschikbaar in het montagemenu van de pagina:

Het geïmporteerde ontwerppakket downloaden downloading-the-imported-design-package

Door het ZIP-bestand te downloaden, kunt u opnemen welk ZIP-bestand met een bepaalde bestemmingspagina is geïmporteerd. Wijzigingen die worden aangebracht op een pagina, worden niet toegevoegd aan het postvak.

Om het ingevoerde ontwerppakket te downloaden, klik het ZIP van de Download in de het Landen toolbar van de Pagina.

Informatie over importeren weergeven viewing-import-information

U kunt op elk gewenst moment informatie over de laatste importbewerking weergeven door op het blauwe uitroepteken boven aan de bestemmingspagina in de klassieke gebruikersinterface te klikken.

Als het geïmporteerde ontwerppakket enkele problemen heeft, bijvoorbeeld als het verwijst naar afbeeldingen/scripts die niet in het pakket voorkomen, enzovoort, geeft de ontwerpimportmodule deze problemen weer in de vorm van een lijst. Als u de lijst met problemen wilt weergeven, klikt u in de klassieke gebruikersinterface op de koppeling voor problemen op de werkbalk Openingspagina. In het volgende beeld, opent het klikken op Kwesties verbinding het venster van de Kwesties van de Invoer.

Een openingspagina opnieuw instellen resetting-a-landing-page

In het geval dat u uw het landende pakket van het paginaontwerp na het aanbrengen van sommige veranderingen in het wilt opnieuw invoeren, kunt u de het landen pagina "ontruimen"door Duidelijk bij de bovenkant van de het landen pagina in het klassieke gebruikersinterface te klikken of Duidelijk in het montagesmenu in het aanraking-geoptimaliseerde gebruikersinterface te klikken. Hiermee verwijdert u de geïmporteerde bestemmingspagina en maakt u een lege importpagina.

Tijdens het wissen van de openingspagina kunt u de wijzigingen in de inhoud verwijderen. Als u Nr klikt, dan worden de inhoudsveranderingen bewaard, dat wil zeggen, wordt de structuur onder jcr:content/importer bewaard en slechts worden de component van de importerpagina en de middelen in etc/design verwijderd. Terwijl, als u ja klikt, wordt jcr:content/importer ook verwijderd.

Componenten wijzigen en toevoegen op een bestemmingspagina modifying-and-adding-components-on-a-landing-page

Als u componenten op de openingspagina wilt wijzigen, dubbelklikt u erop om ze te openen en te bewerken zoals u dat met andere componenten doet.

Als u componenten aan de bestemmingspagina wilt toevoegen, sleept u componenten naar de bestemmingspagina (van het hulpapparaat in de klassieke gebruikersinterface of vanuit het deelvenster Componenten in de gebruikersinterface met geoptimaliseerde aanrakingen) en bewerkt u de onderdelen naar wens.

Een openingspagina verwijderen deleting-a-landing-page

Het verwijderen van een openingspagina is vergelijkbaar met het verwijderen van een normale AEM-pagina.

De enige uitzondering is dat wanneer u een bestemmingspagina verwijdert, deze ook de bijbehorende bestemmingspagina voor mobiele apparaten verwijdert (indien aanwezig), maar niet omgekeerd.

Een openingspagina publiceren publishing-a-landing-page

U kunt de openingspagina en alle bijbehorende afhankelijkheden publiceren, net als een normale pagina.