Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion 13/umbraco-engage/developers/analytics/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ https://**yoursite.com**/umbraco/#Engage/profiles/profiles/insights?id=**[[visit

The URL above is a link to your website, including a visitor ID. By using a URL like this you can click directly through to view the visitor profile from Forms workflows. This includes emails, Slack messages as well as exported Excel data.

![](../../.gitbook/assets/engage-analytics-forms-visitor-id2.png)
![Visitor Form Submissions - Design view](../../.gitbook/assets/engage-analytics-forms-visitor-id2.png)

## Disable Umbraco Forms tracking

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ Optionally, provide an External-Visitor-Id header in order to automatically upda

These requests let you verify if a content page, by ID or Path, has a **JavaScript** or **CSS** variant available for page injection.

![](../../.gitbook/assets/engage-headless-segment-css.png)
![Add custom code for variant](../../.gitbook/assets/engage-headless-segment-css.png)

### Segmentation - Content

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ The `PageView` lies at the heart of Umbraco Engage Analytics feature and exposes
Consider the following example (continued from above) where the content of content type "`Home`" was requested. We will now tell Umbraco to execute this custom code whenever the template `HomeTemplate` is requested:

{% code overflow="wrap" %}

```csharp
public ActionResult HomeTemplate()
{
Expand All @@ -49,23 +50,26 @@ public ActionResult HomeTemplate()
...
}
```

{% endcode %}

We can for example check if the current visitor falls into a segment called "**MySegment**". Keep in mind that a visitor can fall into any number of segments (zero, one, or all). A segment alone don't anything and can be regarded as purely informational, or as a "**Flag**" or "**Label**".

The personalization used by the Umbraco Engage to modify the appearance of a page is called **Applied Personalization**.

A page request can have only **one** active Applied Personalization. Based on the current segments (and their sort order), Umbraco Engage picks the first applicable Applied Personalization. This could be a multi-doctype or multi-page personalization (Marketing section) or single-page personalization (content).
A page request can have only **one** active Applied Personalization. Based on the current segments (and their sort order), Umbraco Engage picks the first applicable Applied Personalization. This could be a multi-doctype or multi-page personalization (Engage section) or single-page personalization (content).

To inspect the resolved Applied Personalization, we can use the property `AppliedPersonalization` on the state's **PageView**:

{% code overflow="wrap" %}

```csharp
if (analyticsState.Pageview.AppliedPersonalization != null && analyticsState.Pageview.AppliedPersonalization.Name == "MyAppliedPersonalization")
{
...
}
```

{% endcode %}

Be aware that no personalization may have been resolved for the current request. Make sure to do a **null check** before reading the `AppliedPersonalization` property. The property `SegmentId` will tell you which active segment was responsible for triggering the Applied Personalization.
Expand Down
4 changes: 2 additions & 2 deletions 13/umbraco-engage/developers/settings/configuration.md
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,9 @@ The default configuration will look like this:
```
{% endcode %}

All these settings are also visualized in Umbraco Engage. This overview can be found in the section 'Engage' -> Settings -> Configuration.
All these settings are also visualized in Umbraco Engage. This overview can be found in the section **Engage** -> **Settings** -> **Configuration**.

![](../../.gitbook/assets/engage-settings-configuration.png)
![Settings Configuration Overview](../../.gitbook/assets/engage-settings-configuration.png)

{% hint style="warning" %}
You cannot change any of the settings in the backoffice. To use the new settings the website must be restarted.
Expand Down
8 changes: 4 additions & 4 deletions 13/umbraco-engage/getting-started/for-developers/cockpit.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,18 +14,18 @@ To add the cockpit to your website:

1. Render the HTML partial provided by Umbraco Engage.
2. The partial view is located at `/Views/Partials/Umbraco.Engage/Cockpit.cshtml`.
3. Insert the following code before the closing `</body>` tag:
3. Insert the following code before the closing `</body>` tag:

```cs
@Html.Partial("Umbraco.Engage/Cockpit")
```

Once the code is added, reload the page to see the Umbraco Engage Cockpit on the left or right side of the screen. The cockpit will only be rendered if the user is logged into Umbraco.

![](../../.gitbook/assets/engage-cockpit.png)
![Umbraco Engage Cockpit](../../.gitbook/assets/engage-cockpit.png)

Clicking the Open button provides detailed information:

![](../../.gitbook/assets/engage-cockpit-2.png)
![Umbraco Engage Cockpit - Detailed information](../../.gitbook/assets/engage-cockpit-2.png)

If you do not see the Cockpit while the Umbraco backoffice runs on a different domain please refer to the [load balancing / CM / CD environments](loadbalancing-and-cm-cd-environments.md) section.
If the Cockpit is missing and the Umbraco backoffice runs on a different domain, see the [Load Balancing and CM/CD Environments](loadbalancing-and-cm-cd-environments.md) article.
42 changes: 21 additions & 21 deletions 13/umbraco-engage/installation/troubleshooting-installs.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,75 +6,75 @@ description: Use the checklist in this article to verify your Umbraco Engage ins

## The Umbraco Engage Checklist

If you have problems with Umbraco Engage setup or configuration, this checklist is for you. Verify you installed the Nuget package **Umbraco.Engage** into your Umbraco website
If you have problems with Umbraco Engage setup or configuration, this checklist is for you. Verify you installed the Nuget package **Umbraco.Engage** into your Umbraco website.

### 1. The Marketing section
### 1. The Engage section

After logging in to Umbraco you can see the Marketing section next to the other main sections in the Umbraco backoffice.
After logging in to Umbraco, you can see the Engage section next to the other main sections in the Umbraco backoffice.

If you cannot see this, please check if your Umbraco user or user group has access to the Marketing section.
If you cannot see this, please check if your Umbraco user or user group has access to the Engage section.

![](../.gitbook/assets/engage-engage-section.png)
![Engage section in the Backoffice](../.gitbook/assets/engage-engage-section.png)

### 2. Marketing Content Apps
### 2. Engage Content Apps

When editing a page within Umbraco you should be able to see the following Content App on the top right of the page:
When editing a page within Umbraco, you should be able to see the following Content App on the top right of the page:

![](../.gitbook/assets/engage-content-apps.png)
![Content Apps on content page](../.gitbook/assets/engage-content-apps.png)

If you cannot see this, please check if your Umbraco user or user group has access to the Marketing section.
If you cannot see this, please check if your Umbraco user or user group has access to the Engage section.

### 3. Cockpit

Is the **Umbraco Engage Cockpit tool** visible on the front end of your site **after logging into Umbraco**?

No? Ensure you added the [Cockpit Partial view](../getting-started/for-developers/cockpit.md) in your main template.
No? Ensure you have added the [Cockpit Partial view](../getting-started/for-developers/cockpit.md) in your main template.

![](../.gitbook/assets/engage-cockpit-1.png)
![Umbraco Engage Cockpit tool](../.gitbook/assets/engage-cockpit-1.png)

### 4. Cockpit Client Side Data
### 4. Cockpit Client-Side Data

Can you see client-side data such as **scroll depth** & **total time** on pages in analytics or the cockpit?

No? Ensure you have [added the client-side tracking script](../developers/analytics/client-side-events-and-additional-javascript-files/additional-measurements-with-the-analytics-scripts.md) in your main template.

<figure><img src="../.gitbook/assets/engage-cockpit-2.png" alt=""><figcaption></figcaption></figure>
![Cockpit Client-Side Data](../.gitbook/assets/engage-cockpit-2.png)

### 5. Umbraco Forms

Go to a form and add a new question. Do you see this option?

![](../.gitbook/assets/engage-analytics-form-field.png)
![Analytics Visitor ID field in Forms](../.gitbook/assets/engage-analytics-form-field.png)

Go to Marketing -> Settings -> Create a new goal. Do you see the following option called **Umbraco Forms Submission**?
Go to Engage -> Settings -> Create a new goal. Do you see the following option called **Umbraco Forms Submission**?

![](../.gitbook/assets/engage-forms-goal-type.png)
![Umbraco Forms Submission optiom in Goal dropdown](../.gitbook/assets/engage-forms-goal-type.png)

If you see both options, this has been configured correctly. If not, ensure that your development team has installed the additional Umbraco Engage [UmbracoForms NuGet package](https://www.nuget.org/packages/Umbraco.Engage.Forms).

### 6. Analytics

Edit a page and go to the Content App marked **Analytics** or **Marketing** -> **Analytics** from the top navigation.
Edit a page and go to the Content App marked **Analytics** or **Engage** -> **Analytics** from the top navigation.

Are you able to see analytical data? If not then you **need to wait 24 hours for today's analytics** to be collected and reported.

### 7. Locations for Analytics

Do you only see \<unknown> in the Location tab of Analytics?
Do you only see <unknown> in the Location tab of Analytics?

This means that additional configuration is required. Get in touch with a developer, as they need to [work to set up and track visitor locations by country and city](../developers/analytics/extending-analytics/getting-the-correct-ip-address.md).

Once set up, you will see analytics for countries like this below:

![](../.gitbook/assets/engage-analytics-error-fixed.png)
![Countries Analytics Data](../.gitbook/assets/engage-analytics-error-fixed.png)

### 8. Setup IP Filters

Confirm that the IP of your company/office building has been set to be excluded from Umbraco Engage. This is done to ensure it is excluded from tracking and reporting, along with anyone else who is a content editor of the website.

You can check your IP by [Googling for What is My IP](https://www.google.com/search?q=what+is+my+IP). Ensure it is in the list of IPs by navigating to **Engage** -> **Settings** -> **IP Filters**.

![](../.gitbook/assets/engage-settings-ip-filter.png)
![Setup IP Filters](../.gitbook/assets/engage-settings-ip-filter.png)

### 9. Reload after Cookie consent

Expand All @@ -88,7 +88,7 @@ If you have performed all the steps and do not see Analytics data within Umbraco
* Refresh the page while the developer tools are open.
* Look for a POST request being made to `umbraco/engage/pagedata/ping` in the Network Tab of requests

<figure><img src="../.gitbook/assets/engage-troubleshoot-missing-data.png" alt=""><figcaption></figcaption></figure>
![Network tab of your browser](../.gitbook/assets/engage-troubleshoot-missing-data.png)

Only '**real**' visitors will be tracked and any information we determine to be from a bot is discarded. The following steps are taken to report a page view:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ description: >-

# Monitor the A/B Test

When the A/B test is running it is advised to check the progress regularly. This can be done on the specific page or via the Marketing Section.
When the A/B test is running it is advised to check the progress regularly. This can be done on the specific page or via the Engage Section.

If you go to the overview you can see all running tests. The overview includes the following information:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ Setting up an A/B test in Umbraco Engage requires no code or need for any extern
Starting A/B tests can be done in two ways:

* Initiate a Single Page, Multiple Page, or Document Type test via the Content App on the specific page,
* Initiate Multipage and Document Type tests via the Marketing section.
* Initiate Multipage and Document Type tests via the Engage section.

## Set up the test

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,15 @@ description: >-

Test all pages using a specific Document Type with this test. Select the Document Type(s) you want to test and Umbraco Engage makes sure the correct CSS and JavaScript is inserted to the correct pages.

The test type "**Document Type**" can be started in the Engage [section](../../introduction/the-umbraco-engage-section.md) and in the [Content App](../../introduction/content-apps.md). The type is selected in step 2 of the setup.
The test type **Document Type** can be started in the [Engage section](../../introduction/the-umbraco-engage-section.md) and in the [Content App](../../introduction/content-apps.md). The type is selected in step 2 of the setup.

![](../../../.gitbook/assets/engage-ab-test-document-type-test.png)
![Setup Test](../../../.gitbook/assets/engage-ab-test-document-type-test.png)

The test allows you to select one or more Document Types within Umbraco. On all pages using the selected Document Type(s) the A/B Test will render the additional CSS and JavaScript you will enter. The CSS and JavaScript must not create any side effects on these pages. This is a manual task.

Once you have selected the pages you want to test, you can specify one or more variants. For each variant, it is possible to click the Edit button. This will bring up a popup that allows you to write JavaScript or CSS:

![](../../../.gitbook/assets/engage-ab-test-documettype-javascript.png)
![Edit variant using CSS or JavaScript](../../../.gitbook/assets/engage-ab-test-documettype-javascript.png)

In this example, some JavaScript changes the page's background color.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,15 @@ description: >-

The Multiple Pages test allows you to across multiple pages at once. In Umbraco, you can select the pages you want to test. For all these pages you can specify which type of CSS or JavaScript will be added to the specific variant. The multiple pages test requires you to write (or copy in) some CSS and JavaScript code.

The test type **Multiple pages** can be started in the [Marketing section](../../introduction/the-umbraco-engage-section.md) and in the [Content App](../../introduction/content-apps.md). The type is selected in step 2 of the setup.
The test type **Multiple pages** can be started in the [Engage section](../../introduction/the-umbraco-engage-section.md) and in the [Content App](../../introduction/content-apps.md). The type is selected in step 2 of the setup.

![](../../../.gitbook/assets/engage-ab-test-mutliple-pages.png)
![Setup Test](../../../.gitbook/assets/engage-ab-test-mutliple-pages.png)

The test allows you to select one or more pages within Umbraco. On all these pages the A/B Test will render the additional CSS and JavaScript you enter. The CSS and JavaScript must not create any side effects on these pages. This is a manual job that cannot be automated with Umbraco Engage.

Once you have selected the pages you want to test, you can specify one or more variants. For each variant, it is possible to click the Edit button. This will bring up a popup that allows you to write JavaScript or CSS:

![](../../../.gitbook/assets/engage-ab-test-documettype-javascript.png)
![Edit variant using CSS or JavaScript](../../../.gitbook/assets/engage-ab-test-documettype-javascript.png)

In this example, some JavaScript is added to change the page's background color.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,4 +8,4 @@ description: >-

In the **Devices** report within **Analytics**, you can view the ratio of visitors using different devices. It shows how many visitors access your website via desktop, tablet, and mobile.

![](../../.gitbook/assets/engage-analytics-device-type.png)
![Device Type report in Analytics](../../.gitbook/assets/engage-analytics-device-type.png)
19 changes: 9 additions & 10 deletions 13/umbraco-engage/marketers-and-editors/analytics/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,7 @@ description: Learn how data from Umbraco Forms is tracked with Umbraco Engage.

# Forms

To track Umbraco Forms submissions, you need to install [Umbraco Forms](https://umbraco.com/products/add-ons/forms/) with a valid license.\
You also need to install the Umbraco Engage[ Forms Addon package from Nuget](https://www.nuget.org/packages/Umbraco.Engage.Forms).
To track Umbraco Forms submissions, you need to install [Umbraco Forms](https://umbraco.com/products/add-ons/forms/) with a valid license. You also need to install the Umbraco Engage [Forms Add-on package from Nuget](https://www.nuget.org/packages/Umbraco.Engage.Forms).

## Summary

Expand All @@ -22,13 +21,13 @@ The following are measured:
* If the form raised any client-side errors, and how many were raised?
* Focus/unfocus events of each field and whether the field was empty or contained data at that time.

## The report
## The Report

The "Forms" tab in the Analytics section holds all data gathered about your forms.
The **Forms** tab in the **Analytics** section holds all data gathered about your forms.

![](../../.gitbook/assets/engage-analytics-forms.png)
![Forms tab in the Analytics section](../../.gitbook/assets/engage-analytics-forms.png)

In this overview you can see the following:
In this overview, you can see the following:

* How many times a form is shown.
* How many times a visitor started filling in the form.
Expand All @@ -44,18 +43,18 @@ For each field you see:
* How often was this field the last field before a visitor abandoned the form.
* How often an error was triggered on the specific field.

![](../../.gitbook/assets/engage-analytics-form-details.png)
![Form Details](../../.gitbook/assets/engage-analytics-form-details.png)

This data gives you insights on how to optimize your forms to create a better conversion rate.

Finally, you can drill down to a specific field to see which type of error was triggered, be it a validation error or a mandatory error.
Finally, drill down to a specific field to see which type of error was triggered, be it a validation error or a mandatory error.

### Tracking a visitor Form submissions

It is possible to track a specific visitor to your website and see if they have made any form submissions. To do so, follow these steps:

1. Edit the Umbraco Form you wish to track visitors for and go to the **Design** view.
2. Add a new field to your form called '**Analytics - VisitorId**\`.
2. Add a new field to your form called **Analytics - VisitorId**.
3. Give the new form field a name such as **Visitor ID**.
4. Specify a URL in the settings of the field type called **Template**:

Expand All @@ -65,7 +64,7 @@ https://**yoursite.com**/umbraco/#Engage/profiles/profiles/insights?id=**[[visit

The URL above is a link to your website, including a visitor ID. By using a URL like this you can click directly through to view the visitor profile from Forms workflows. This includes emails, Slack messages as well as exported Excel data.

![](../../.gitbook/assets/engage-analytics-forms-visitor-id2.png)
![Adding Analytics - VisitorId field to Form](../../.gitbook/assets/engage-analytics-forms-visitor-id2.png)

## Disable Umbraco Forms tracking

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ description: >-

In the **Analytics - Referrers** tab, you can view all visits to your site that originated from external sources.

![Referral Traffic](../../.gitbook/assets/Referral-traffic.png)
![Referral Traffic tab in Analytics section](../../.gitbook/assets/Referral-traffic.png)

To see the specific path a visitor took, click on the domain, and it will display all exact referral paths.

![](../../.gitbook/assets/Referral-Traffic-Path.png)
![Domain view displaying visitor referral paths](../../.gitbook/assets/Referral-Traffic-Path.png)
Loading
Loading