Show Menu
TOPICS×

Add a Data Element, a Rule and a Library

In this lesson, you will create your first Data Element, Rule, and Library.
Data Elements and Rules are the basic building blocks of Launch. Data Elements store the attributes you want to send to your marketing and advertising solutions, while Rules fire the requests to those solutions under the right conditions. Libraries are the JavaScript files that load on the page to do all of the work. In this lesson, you will use all three to make our sample page do something.

Learning Objectives

At the end of this lesson, you will be able to:
  • Create a data element
  • Create a rule
  • Create a library
  • Add changes to a library
  • Validate that your library is loading in your web browser
  • Use the "Working Library" feature to work more efficiently

Data Element for Page Name

Data elements are Launch’s version of a data layer. They can store values from your own data layer object, cookies, local storage objects, query string parameters, page elements, meta tags, etc. In this exercise, you will create a data element for Page Name, which you will use later in your Target and Analytics implementations.
To create a data element
  1. In the top navigation, click Data Elements
  2. Since you haven't created any data elements yet in this property, a brief video appears with additional information on this topic. Watch this video, if you like.
  3. Click the Create New Data Element button:
  4. Name the data element, e.g. Page Name
  5. Use the JavaScript Variable Data Element type to point to a value in your sample page's data layer: digitalData.page.pageInfo.pageName
  6. Use " not available " as the Default Value. The Default Value tells Launch what value to use for the data element if your JavaScript Variable specified above is not found.
  7. Check the boxes for Force lowercase value and Clean text to standardize the case and remove extraneous spaces
  8. Leave None as the Storage Duration setting since this value will typically be different on every page
  9. Click the Save button to save the data element
    .
DTM Migrators: New data element types have been added to Launch, which did not exist in DTM. Some of the new data element types include Local Storage, Session Storage, Page Info, and Random Number
Data element capabilities can be extended with Extensions . For example, the ContextHub extension allows you to add data elements using features of the extension.

Create a Rule

Next you will use this data element in a simple rule. Rules are one of the most powerful features in Launch and allow you to specify what should happen as the visitor interacts with your website. When the criteria outlined in your rules are met, the rule triggers the action you have specified.
You are going to create a rule that outputs the Page Name data element value to the browser console.
To create a rule
  1. In the top navigation, click Rules
  2. Since you haven't created any rules yet in this property, a brief video appears with additional information on the topic. Watch this video, if you like.
  3. Click the Create New Rule button:
  4. Name the Rule All Pages - Library Loaded . This naming convention indicates where and when the rule will fire, making it easier to identify and re-use as your Launch property matures.
  5. Under Events, click Add . The Event tells Launch when the rule should fire and can be many things, including a page load, a click, a custom JavaScript event, etc.
    1. As the Event Type, select Library Loaded (Page Top) . Note that when you select the Event Type, Launch pre-populates a name for the event using your selection. Also note that the default order for the event is 50. Ordering is a powerful feature in Launch which gives you precise control over the sequence of actions when you have multiple rules that are triggered by the same event. You will use this feature later in the tutorial.
    2. Click the Keep Changes button
  6. Since this rule should fire on all pages, leave Conditions blank. If you open the Conditions modal, you will see that conditions can add both restrictions and exclusions based on a large variety of options, including URLs, data element values, date ranges, and more.
  7. Under Actions, click Add
  8. Select Action Type > Custom Code , which at this point is the only option. Later in the tutorial, as you add extensions, more options will become available.
  9. Select </> Open Editor to open the code editor
  10. Add the following to the code editor. This code will output the value of the Page Name data element to the browser console so you can confirm it's working:
      console.log('The page name is '+_satellite.getVar('Page Name'));
    
    
  11. Save the code editor
  12. On the Action configuration screen click Keep Changes
  13. Click Save to save the rule
DTM Migrators: In Launch, rules are required in order to fire most marketing pixels. For example, in order to fire the Adobe Analytics beacon, you must use a rule to instruct Launch to do so.
The Rule builder has been dramatically redesigned and rebuilt in Launch. Some of the main changes are:
  • There is just one Rule builder. DTM rule-types like "Page Bottom", "Click", and "Direct Call" are all just event-types in the Rule builder. This makes it much easier to update a rule should you need to change the trigger from, say, a DOM Ready event to a custom event.
  • There is a new "Custom Code" event-type
  • Extensions can add new event types to the Rule builder. For example, the Target extension could eventually add built-in support for its at.js custom events , so custom code wouldn't be needed to use this feature.
  • Extensions can add new actions to the Rule builder, reducing issues by deprecating reliance on custom code. You will be using many of these extension actions in this Tutorial.
  • Rules are required to fire requests associated with most marketing tools. This will require a mindset adjustment, especially for things like setting Customer IDs, firing Analytics beacons, and firing the global mbox.

Save Your Changes to a Library

After configuring a collection of extensions, data elements, and rules in the Launch interface, you need to package these capabilities and logic into a set of JavaScript code that you can deploy on your website so that marketing tags will fire when visitors come to the site. A library is the set of JavaScript code that will do this.
In an earlier lesson, you implemented the embed code of your development environment on the sample page. When you loaded the sample page a 404 error was returned for the embed code URL because a Launch library had not been built yet and assigned to the environment. Now you will put your new data element and rule in a library so that your sample page can do something.
To add and build a library
  1. Go to the Publishing tab
  2. Click Add New Library
  3. Name the Library "Initial Setup"
  4. Select Environment > Development
  5. Click Add All Changed Resources
  6. Note that after clicking Add All Changed Resources Launch summarizes the changes you just made.
  7. Click Save & Build for Development
After a few moments, the status dot will turn green indicating the library successfully built.

Validate Your Work

Now validate that your rule is working as expected.
Reload your sample page. If you look at the Developer Tools -> Network tab, you should now see a 200 response for your Launch Library!
If you look at the Developer Tools -> Console, you should see the text "The page name is home"
Congratulations, you created your first data element and rule and built your first Launch library!

Use the Working Library Feature

When you are making a lot of changes in Launch, it is inconvenient to have to come to the Publishing tab, add changes, and build the library each time you want to see the result. Now that you have created your "Initial Setup" library, you can use a feature called "Working Library" to rapidly save your changes and rebuild the library in a single step.
Make a small change to your "All Pages - Library Loaded" rule. In the top navigation, click Rules and then click on the All Pages - Library Loaded rule to open it up.
On the Edit Rule page, click the Working Library dropdown and select your Initial Setup library.
Once you've selected the library, you should see that the Save button now defaults to Save to Library and Build . When you make a change in Launch, you can use this option to automatically add the change directly to your working library and rebuild it.
Test it out. Open your Custom Code action and just add a colon after the text "The page name is" so the entire code block reads:
  console.log('The page name is: '+_satellite.getVar('Page Name'));

Save the code, keep the changes in the action, and now click the Save to Library and Build button.
Wait a moment until the green dot reappears next to the Working Library dropdown. Now, reload your sample page and you should see your change reflected in the console message (you may have to clear your browser cache and reload, in order to see the change to the page):
This is a much faster way of working and you will use this approach for the rest of the tutorial.