Learn how to create a Tag property with the bare-minimum configuration to integrate with Adobe Experience Manager. Users are introduced to the Tag UI and learn about extensions, rules, and publishing workflows.
Hello, in this video, we are going to be creating a new Launch web property with the goal to integrate this with an Adobe Experience Manager Site. Once Launch and AEM are fully integrated, it becomes really easy to deploy solutions like Analytics, Audience Manager, Target, and a lot more. This video series is really just about setting up the integration between AEM and Launch, so this initial Launch web property is going to be relatively simple. All right, let’s get started. When you click into Launch, you’ll see three cards, and I’m going to click into Adobe Experience Platform Launch. This is going to pull up a list of different properties that have been created for my organization. You can see there’s a lot of them. For this tutorial, we’re going to create a new property. So go up to the upper right-hand corner and click new property.
So the first thing is we’ll give it a name. I’m going to connect this to a sample WKND site so I’ll call it WKND site, going to leave the platform as web. Then, we need to pick a domain.
For your implementation, you would choose the domain of your website. I’m just running on AEM as a cloud service so I’m just going to do adobeaemcloud.com.
Then, we can go ahead and click save to create our property.
Now the property has been created, and then we can click into it to get an overview.
The other thing I want to point out is that there are different environments set up per property. So we’ve got a development environment, a staging environment, as well as a production environment. The idea here is that you can make modifications to your library and your web property, and then test them out in different environments. So these three environments are created by default. You’re also able to add your own environment.
The publishing flow is how you would move these changes of the web property between these different environments. So you would start in development and move it forward until it’s published into production.
Extensions are one of the most powerful features of Launch. So we can see that, by default, the Core extension is installed and this extension provides some of the baseline functionality needed for Launch to work.
If we click into catalog, now we can see a whole library of extensions available. We’ve got an extension for Adobe Analytics, Audience Manager, and there’s also a number of third-party extensions available. In this video, we’re just going to keep it simple and just use the Core extension. Once an extension is installed, you then would want to create a rule to actually do something with that extension. So with Analytics, that might be capturing a piece of data. In our case, we’re just going to create a very simple rule. So we’ll go to create new rule, and I’m just going to call this Launch loaded. All we’re going to do with this rule is just debug, log a simple debug message to the browser’s console that hey, Launch was loaded successfully.
Again, we’re just going to log a simple message to the browser’s console.
The message is just going to be hey, Launch library loaded.
Then, we can save our changes.
I’ll keep those changes, and then I’ll save that rule.
So we’ve got our Launch loaded rule. We also have our Core extension. The next thing that we want to do is actually publish this and publish this web property. So we go to publishing flow. You can see under development, I need to add a new library. You can think of a library as a collection of resources. So I’m going to give it a name, Launch loaded, and the only environment I have available is development so we’ll choose that. Then, each library contains a set of resources, and one of the easiest way to grab all of your changes is just click add all changed resources. You can see it’s collected my Launch rule and as well as the Core extension, so those are all going to be included. Then, we can save and build this library for development.
So you can see it’s building the library in the background.
Right now it’s loaded just on the development environment. In order to promote it, we’re going to submit it for approval.
So now it’s in the submitted swimlane, and now we can build it for the staging environment. For this initial run, I’m going to actually push it all the way to production just so that we can see it working in staging and in production. So we’ll approve this library for publishing, and we’ll build and push to production.
And if you look at the staging URI, you can see that we’ve got this staging string here just to indicate that this is the library on the staging environment. Right now, all three environments have the same code in the same library, but as we’ll see later, we do have the ability to make a change in preview at first in AEM, in the staging environment, before publishing it into production. Congratulations on creating your first Launch property. In the next video, we are going to connect AEM with the Launch API using the Adobe Developer Console, and this will allow our AEM installation to automatically pull in any of the available Launch properties. -
To create a Tag property, complete the following steps.
In the browser, navigate to the Adobe Experience Cloud Home page and login using you Adobe ID.
Click the Data Collection application from the Quick access section of the Adobe Experience Cloud Home page.
Click the Tags menu item from the left navigation, then click New Property from top-right corner.
Name your Tag property using the Name required field. For Domains field, enter your domain name or if using AEM as a Cloud Service environment enter
adobeaemcloud.com and click Save.
Open the newly created Tag property by clicking its name in the Tag Properties view. Also under My Recent Activity heading you should see that the Core extension added to it. The Core tag extension is the default extension and it provides foundational event types such as page-load, browser, form, and other event types, see Core extension overview for more information.
To create a rule, complete the following steps.
Click Rules from the AUTHORING section of the left navigation and then click Create New Rule
Name your rule using the Name required field.
Click Add from the EVENTS section, then in the Event Configuration form, in the Event Type dropdown select Library Loaded (Page Top) option and click Keep Changes.
Click Add from the ACTIONS section, then in the Action Configuration form, in the Action Type dropdown select Custom Code option and click Open Editor.
console.log('Tags Property loaded, all set for...'); console.log('capabilities such as capturing data, conversion tracking and delivering unique and personalized experiences');
Click Save to finish the rule creation process.
Click Publishing Flow from the PUBLISHING section of the left navigation, then click Add Library
Name your library using the Name field and select Development(development) option for Environment dropdown.
To select all the changed resources since the Tag property creation, click + Add All Changed Resources. This action adds the newly created rule and core extension resource to the library. Finally click Save & Build to Development.
Once the library is built for the Development swim lane, using ellipses select the Submit for Approval
Then in the Submitted swim lane using ellipses select the Approve for Publishing, likewise Build & Publish to Production in the Approved swim lane.
Above step completes the simple Tag property creation that has a rule to log a message to browser console when the page is loaded. Also the rule and core extension is published by creating a library.