Skip to content

Commit e453f3d

Browse files
authored
Merge pull request #6518 from umbraco/uMs-cleanup-articles
cleanup articles
2 parents 18ea09a + c7b44b2 commit e453f3d

File tree

6 files changed

+170
-113
lines changed

6 files changed

+170
-113
lines changed
Lines changed: 58 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,65 +1,80 @@
1-
# headless-example
1+
---
2+
description: >-
3+
This article shows how to personalize content using the uMarketingSuite Headless API and Umbraco’s Content Delivery API.
4+
---
25

3-
This will show a simple tutorial to use the uMarketingSuite Headless API with Umbraco Content Delivery API.
6+
# Headless Example
47

5-
### Setting up a simple Personalization Segment
8+
This article shows how to use the uMarketingSuite Headless API with Umbraco Content Delivery API.
69

7-
* With uMarketingSuite goto the **Marketing** Section and the **Personalization** section
8-
* Navigate to the **Segments** tab and click **Add new Segment**
9-
* Give the segment a name such as **Morning People** or similar
10-
* And a description such as **For people who like to visit us in the morning**
11-
* Set the segment type to **Core** as we don't wish this to be temporary and tied to end date for a campaign
12-
* Choose the parameter **Time of day** and set its configuration values to **Include** **00:00** to **12:00** as it is a 24 hour clock
10+
## Setting up a Personalization Segment
1311

14-
Refer to the [documentation on Personalization to learn more](../../../../personalization/) what can be done.
12+
1. Go to the **Marketing** > **Personalization** section.
13+
2. Navigate to the **Segments** tab.
14+
3. Click **Add new Segment**.
15+
* Give the segment a name. For example: **Morning People**.
16+
* And a description such as **For people who like to visit us in the morning**.
17+
* Set the segment type to **Core** as we don't wish this to be temporary and tied to end date for a campaign.
18+
* Select the **Time of day** parameter and configure it to **Include** times from **00:00** to **12:00** as it is a 24 hour clock.
19+
20+
For more information, see the [Personalization](../personalization/README.md) documentation.
1521

1622
![]()
1723

18-
### Creating a Document Type to Personalize
24+
### Creating a Document Type for Personalization
25+
26+
1. Navigate to **Settings**.
27+
2. Click **Create a New Document Type**.
28+
3. Enable **Allow Segmentation** under **Permissions**.
29+
4. Save the Document Type.
30+
5. Add a new property, such as **Header**, using a **Textstring** property editor.
31+
32+
* Ensure **Allow Segmentation** is enabled for this property.
33+
34+
6. Create a piece of content using this new Document Type so we can query and request it using the Umbraco Content Delivery API
1935

20-
* Navigate to **Settings** and **Create a New Document Type**
21-
* Ensure the setting **Allow Segmentation** is enabled under **Permissions** and Save the Document Type
22-
* Add a new property to the document type such as **Header** using a **Textstring property editor**
23-
* Ensure the property added has the **Allow Segmentation** value enabled
24-
* Create a piece of content using this new Document Type so we can query and request it using the Umbraco Content Delivery API
2536
* _For this example lets create this piece of content at the root_
2637

27-
### Creating Content that is personalized
38+
### Creating Personalized Content
39+
40+
1. Open the created content and go to **Personalization**.
41+
2. Click **Add personalized variant**.
42+
3. Set the following in the **Add a new variant** dialog:
2843

29-
* With a simple piece of content created click the **Personalization** content app
30-
* Click the **Add personalized variant** button
31-
* In the Add a new variant dialog we can set the following
32-
* Choose our segment **Morning People** we added earlier
33-
* Give it a name and a meaningful descriptions such as **Home Page for Morning People**
44+
* Choose the segment **Morning People** we added earlier.
45+
* Give it a name and a meaningful description such as **Home Page for Morning People**.
3446

3547
![]()
3648

37-
* After adding the variant we will return to the content node in split view mode
38-
* We can then add a different piece of content we want to return in our Header property specific to morning people such as **Hello you EARLY risers**
39-
* Save and publish the node with the variant content
49+
4. After adding the variant we will return to the content node in split view mode
50+
5. We can then add a different piece of content we want to return in our Header property specific to morning people such as **Hello you early risers**
51+
6. Save and publish the node with the variant content
4052

4153
![]()
4254

4355
### Using the Content Delivery API
4456

45-
We will do the reminder of this tutorial using the Swagger development tool, so we can easily create requests against Umbraco Content Delivery API and uMarketingSuite Headless
46-
47-
* Navigate to the swagger endpoint of your site **/umbraco/swagger**
48-
* From the dropdown select the **Umbraco Delivery API**
49-
* Expand the \*\*/umbraco/delivery/api/v1/content/item/{path}\*\*request
50-
* Click the **Try it out** button
51-
* For the path parameter enter / for the example piece of content we created at the root of our site - alternatively specify the correct URL path to the content
52-
* You may need to set the **Api-Key** parameter depending if your Umbraco application has been [setup to allow Public Access](https://docs.umbraco.com/umbraco-cms/reference/content-delivery-api#additional-configuration) this can be toggled with the configuration value _Umbraco:CMS:DeliveryAPI:PublicAccess_
53-
* If everything is working correctly we should see the JSON result of the content node and see the default value for our header
54-
* Next from the definitions dropdown navigate to **uMarketingSuite Marketing API**
55-
* Expand the **/umbraco/umarketingsuite/api/v1/analytics/pageview/trackpageview/client**request
56-
* Click the **Try it out** button
57-
* Modify the JSON body, we need to set the url property to be the page we have just visited with the content delivery api above and we can leave the other property **referrerUrl** empty
58-
* Repeat the earlier steps to fetch the content by it's path and you should note that the JSON of the content node and the header property now contains our personalized content **Hello you EARLY risers**
59-
* Remember it will only show us different content if we are to view the page before midday
57+
Let us use the Swagger development tool to make requests to the Umbraco Content Delivery API and uMarketingSuite Headless API.
6058

61-
![]()
59+
1. Navigate to the swagger endpoint of your site **/umbraco/swagger**.
60+
2. Select **Umbraco Delivery API** from the dropdown.
61+
3. Expand `/umbraco/delivery/api/v1/content/item/{path}`:
62+
63+
* Click **Try it out**.
64+
* For the path parameter, enter `/` for the example piece of content we created at the root of our site - alternatively specify the correct URL path to the content
65+
* Set the **Api-Key** parameter if your Umbraco application requires [Public Access](https://docs.umbraco.com/umbraco-cms/reference/content-delivery-api#additional-configuration) this can be toggled with the configuration value `Umbraco:CMS:DeliveryAPI:PublicAccess`
66+
67+
4. You should see the JSON result of the content node, including the default header value.
68+
5. Navigate to **uMarketingSuite Marketing API** from the definitions dropdown.
69+
* Expand `/umbraco/umarketingsuite/api/v1/analytics/pageview/trackpageview/client`:
6270

63-
**Disclaimer**: Due to the way uMarketingSuite is licenced to individual domains, it is required that the Host Header matches one of the registered licenced domains in order for personalisation and A/B Testing on the Content Delivery API to work
71+
* Click **Try it out**.
72+
* Modify the JSON body, setting the URL to the page visited earlier. With the content delivery api above, leave the other property **referrerUrl** empty.
73+
* Repeat the earlier steps to fetch the content by it's path. The JSON of the content node and the header property now contains our personalized content **Hello you early risers**
74+
* Remember it will only show different content if we view the page before midday.
75+
76+
![]()
6477

65-
TADA that's it you can see how easy it is.
78+
{% hint style="info" %}
79+
uMarketingSuite is licensed to individual domains. It requires the Host Header to match one of the registered licensed domains for personalization and A/B Testing to work.
80+
{% endhint %}
Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,28 @@
1+
---
2+
description: >-
3+
This article explains how to use the uMarketingSuite cockpit to verify tracking and understand personalization in your analytics.
4+
---
5+
16
# Cockpit Insights
27

3-
To verify whether the tracking of uMarketingSuite analytics works correctly and to get a better understanding of the way personalization works in the uMarketingSuite we've added a cockpit to the uMarketingSuite. The cockpit gives you an additional button in the frontend that allows you to see what actually is going on:
8+
uMarketingSuite includes a cockpit feature to help verify the tracking of analytics and understand personalization behavior. The cockpit adds a button to the frontend, giving real-time insights:
49

510
![]()
611

7-
If you click on it, it will open and you see even more information:
12+
Clicking the button provides detailed information:
813

914
![]()
1015

11-
To add the cockpit to your website you need to render the html partial that is shipped by default by the uMarketingSuite. The partial view is located in the folder **/Views/Partials/uMarketings/Cockpit.cshtml**.
16+
## Adding the Cockpit to Your Website
17+
18+
To add the cockpit to your website:
1219

13-
The view can be rendered by adding in this code snippets before the closing **</body>**-tag:
20+
1. Render the HTML partial provided by uMarketingSuite.
21+
2. The partial view is located at `/Views/Partials/uMarketings/Cockpit.cshtml`.
22+
3. Insert the following code before the closing `</body>` tag:
1423

24+
```cs
1525
@Html.Partial("uMarketingSuite/Cockpit")
26+
```
1627

17-
The cockpit itself will only be rendered if the user is logged into Umbraco.
28+
The cockpit will only be rendered if the user is logged into Umbraco.

13/umbraco-ums/marketers-and-editors/personalization/creating-a-segment.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,9 +56,9 @@ You see all browsers that have visited the website. So if you're missing a speci
5656

5757
You can save the parameter and the segment will show the parameter that is part of this segment.
5858

59-
![]()&#x20;
59+
![]()
6060

61-
3\. Add a parameter for **Time of day** to select all visitors after "**15:00**". Enter **15:00** in **From** and leave **Until** empty.
61+
3. Add a parameter for **Time of day** to select all visitors after "**15:00**". Enter **15:00** in **From** and leave **Until** empty.
6262

6363
![]()
6464

Lines changed: 53 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,93 @@
1+
---
2+
description: >-
3+
Discover how to analyze visitor profiles, including insights on engagement metrics,
4+
potential, personas, and detailed activity tracking.
5+
---
6+
17
# Profile Detail
28

3-
If you go to a specific profile in the Profiles section you get access to two sections in that profiles "Insights" & "Activity"
9+
In the Profiles section, you can access specific visitor profiles, which contain two sections: **Insights** and **Activity**.
410

511
## Insights
612

7-
The insights section shows you an overview of the visitor
13+
The insights section provides an overview of the visitor.
814

915
![]()
1016

11-
You see when the visitor first visited the website (first session), when the visitor has been to the website for the last time (Last activity), the number of sessions, the number of pageviews, the time spent on the website and the total engaged time.
17+
Here, you can see:
18+
19+
- The date of the visitor's first session on the website,
20+
- The date of the visitor's last activity,
21+
- The number of sessions,
22+
- The number of pageviews,
23+
- The time spent on the website, and
24+
- The total engaged time.
1225

13-
You also see if there any goals triggered by this visitor.
26+
You can also view any goals triggered by this visitor.
1427

15-
### Profile potential
28+
### Profile Potential
1629

1730
![]()
1831

1932
The uMarketingSuite will also show the potential of the profile based on the engagement time and when the profile was last active.
2033

21-
By default a profile is considered active if the profile has visited the website in the last 30 days.
34+
By default, a profile is considered active if the profile has visited the website in the last 30 days.
2235

23-
By default a profile is considered engaged when the engagement time of the visitor was higher than 300 seconds in the last 3 sessions.
36+
By default, a profile is considered engaged when the engagement time of the visitor was higher than 300 seconds in the last 3 sessions.
2437

2538
The exact settings (30 days, 300 seconds, 3 sessions) can be overwritten via the [uMarketingSuite configuration file](/installing-umarketingsuite/configuration-options-1-x/).
2639

27-
## Calculated persona & customer journey phase
40+
## Calculated Persona & Customer Journey Phase
2841

29-
On the profile we will also see all [personas](/personalization/implicit-explicit-personalization/setting-up-personas/) and [customer journeys](/personalization/implicit-explicit-personalization/setting-up-the-customer-journey/) that you have setup within the uMarketingSuite. Per persona and customer journey phase the score is shown and we will show if they uMarketingSuite assigns a persona or customer journey phase to this visitor. In the below example you see that the uMarketingSuite has assigned the persona "Data & Privacy officer" to this visitor.
42+
Within the profile, you can see all [personas](/personalization/implicit-explicit-personalization/setting-up-personas/) and [customer journeys](/personalization/implicit-explicit-personalization/setting-up-the-customer-journey/) that you have setup within the uMarketingSuite. Each persona and customer journey phase displays a score. You can see if uMarketingSuite has assigned a persona or journey phase to this visitor. In the below example, you see that the uMarketingSuite has assigned the persona "Data & Privacy officer" to this visitor.
3043

3144
![]()
3245

3346
![]()
3447

35-
## Activity tab
48+
## Activity Tab
3649

37-
In the Activity tab you see all the activity of this visitor.
50+
In the Activity tab, you can view all the activity of this visitor.
3851

3952
![]()
4053

41-
Per session you see:
54+
For each session, you can see:
4255

43-
- the first icon shows if the uMarketingSuite enriched the visitor experience (blue icon) by showing an A/B Test variant or personalized variant to the visitor. If that was not the case we show a grey icon.
44-
- when the session was recorded
45-
- which device type was uesed
46-
- the number of pages that where visited in this session
47-
- the duration of the session
48-
- how long the person was engaged
49-
- the number of goals that was triggered
50-
- the events that were triggered
51-
- on which page the session started
52-
- from which website the visitor came into your website
56+
- An icon indicating whether the uMarketingSuite enriched the visitor's experience (blue icon for A/B Test variant or personalized variant; grey icon if not).
57+
- The timestamp when the session was recorded.
58+
- Which device type was uesed.
59+
- The number of pages that where visited in this session.
60+
- The duration of the session.
61+
- How long the person was engaged.
62+
- The number of goals that was triggered.
63+
- The events that were triggered.
64+
- On which page the session started.
65+
- From which website the visitor came into your website.
5366

54-
By clicking on the row you see more in-depth data of that session
67+
By clicking on a row, you can access more detailed information about that session.
5568

5669
![]()
5770

58-
You see:
71+
You will see:
5972

60-
- The visited page
61-
- The time of visit
62-
- The time on page
63-
- The engaged time on page
64-
- The scroll depth on that page
65-
- The number of goals that where triggered
66-
- The number of recorded events
67-
- The variant of the page that somebody saw
68-
- Also you see which Operating System, Browser and (anonymized) IP address is being used
69-
- Finally the icon on the beginning indicates whether the person saw a personalized or A/B tested variant of the page
73+
- The visited page.
74+
- The time of visit.
75+
- The time on page.
76+
- The engaged time on page.
77+
- The scroll depth on that page.
78+
- The number of goals that where triggered.
79+
- The number of recorded events.
80+
- The variant of the page displayed to the visitor.
81+
- The operating system, browser, and (anonymized) IP address used.
82+
- An icon indicating whether the visitor saw a personalized or A/B tested variant of the page.
7083

71-
Finally you can also drilldown into the activity on a specific page:
84+
Finally, you can drill down into the activity on a specific page:
7285

7386
![]()
7487

75-
Here you see when somebody:
88+
Here, you can see:
7689

77-
- started a visit on the page
78-
- when the maximum scroll depth was reached
79-
- when the visit was ended
80-
- when goals where triggered
90+
- When the visitor started their visit on the page.
91+
- When the maximum scroll depth was reached.
92+
- When the visit ended.
93+
- When goals were triggered.

0 commit comments

Comments
 (0)