Skip to content

Commit c2fe4df

Browse files
committed
Code samples for Adobe Analytics and Google Analytics integration with PDF Embed API
1 parent d388614 commit c2fe4df

File tree

8 files changed

+194
-2
lines changed

8 files changed

+194
-2
lines changed
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Sample for Adobe Analytics
2+
3+
This sample shows how to set up the PDF viewer to send analytics from PDF Embed API to Adobe Analytics.
4+
5+
To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
6+
7+
## Documentation
8+
9+
To know more about the setup steps, please check the [documentation](https://developer.adobe.com/document-services/docs/overview/pdf-embed-api/howtodata/).
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Adobe Document Services PDF Embed API Sample</title>
5+
<meta charset="utf-8"/>
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
7+
<meta id="viewport" name="viewport" content="width=device-width, initial-scale=1"/>
8+
<script type="text/javascript" src="index.js"></script>
9+
</head>
10+
<body style="margin: 0px">
11+
<div id="adobe-dc-view"></div>
12+
<script type="text/javascript" src="https://documentcloud.adobe.com/view-sdk/main.js"></script>
13+
</body>
14+
</html>
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
/*
2+
Copyright 2022 Adobe
3+
All Rights Reserved.
4+
5+
NOTICE: Adobe permits you to use, modify, and distribute this file in
6+
accordance with the terms of the Adobe license agreement accompanying
7+
it. If you have received this file from a source other than Adobe,
8+
then your use, modification, or distribution of it requires the prior
9+
written permission of Adobe.
10+
*/
11+
12+
/* Pass the viewer customization options here. */
13+
const viewerConfig = {
14+
showPrintPDF: true,
15+
showDownloadPDF: true,
16+
defaultViewMode: "", /* Allowed possible values are "FIT_PAGE", "FIT_WIDTH" or "". */
17+
embedMode: "FULL_WINDOW" /* Pass the embed mode here. */
18+
};
19+
20+
/* Wait for Adobe Document Services PDF Embed API to be ready */
21+
document.addEventListener("adobe_dc_view_sdk.ready", function () {
22+
/* Initialize the AdobeDC View object */
23+
var adobeDCView = new AdobeDC.View({
24+
/* Pass your registered client id */
25+
clientId: "<YOUR_CLIENT_ID>",
26+
/* Pass the div id in which PDF should be rendered */
27+
divId: "adobe-dc-view",
28+
/* Pass the Adobe Analytics report suite ID. */
29+
reportSuiteId: "<YOUR_REPORT_SUITE_ID>"
30+
});
31+
32+
/* Invoke the file preview API on Adobe DC View object */
33+
adobeDCView.previewFile({
34+
/* Pass information on how to access the file */
35+
content: {
36+
/* Location of file where it is hosted */
37+
location: {
38+
url: "https://documentcloud.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
39+
/*
40+
If the file URL requires some additional headers, then it can be passed as follows:-
41+
header: [
42+
{
43+
key: "<HEADER_KEY>",
44+
value: "<HEADER_VALUE>",
45+
}
46+
]
47+
*/
48+
},
49+
},
50+
/* Pass meta data of file */
51+
metaData: {
52+
/* file name */
53+
fileName: "Bodea Brochure.pdf"
54+
}
55+
}, viewerConfig);
56+
});
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Sample for Google Analytics
2+
3+
This sample shows how to set up the PDF viewer to send analytics from PDF Embed API to Google Analytics.
4+
5+
To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
6+
7+
## Documentation
8+
9+
To know more about the setup steps, please check the [documentation](https://developer.adobe.com/document-services/docs/overview/pdf-embed-api/howtodata/).
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<!-- Global site tag (gtag.js) - Google Analytics -->
5+
<script async src="https://www.googletagmanager.com/gtag/js?id=<YOUR_GA4_MEASUREMENT_ID>"></script>
6+
<script>
7+
window.dataLayer = window.dataLayer || [];
8+
function gtag(){dataLayer.push(arguments);}
9+
gtag('js', new Date());
10+
gtag('config', '<YOUR_GA4_MEASUREMENT_ID>');
11+
</script>
12+
<title>Adobe Document Services PDF Embed API Sample</title>
13+
<meta charset="utf-8"/>
14+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
15+
<meta id="viewport" name="viewport" content="width=device-width, initial-scale=1"/>
16+
<script type="text/javascript" src="index.js"></script>
17+
</head>
18+
<body style="margin: 0px">
19+
<div id="adobe-dc-view"></div>
20+
<script type="text/javascript" src="https://documentcloud.adobe.com/view-sdk/main.js"></script>
21+
</body>
22+
</html>
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
/*
2+
Copyright 2022 Adobe
3+
All Rights Reserved.
4+
5+
NOTICE: Adobe permits you to use, modify, and distribute this file in
6+
accordance with the terms of the Adobe license agreement accompanying
7+
it. If you have received this file from a source other than Adobe,
8+
then your use, modification, or distribution of it requires the prior
9+
written permission of Adobe.
10+
*/
11+
12+
/* Pass the viewer customization options here. */
13+
const viewerConfig = {
14+
showPrintPDF: true,
15+
showDownloadPDF: true,
16+
defaultViewMode: "", /* Allowed possible values are "FIT_PAGE", "FIT_WIDTH" or "". */
17+
embedMode: "FULL_WINDOW" /* Pass the embed mode here. */
18+
};
19+
20+
/* Wait for Adobe Document Services PDF Embed API to be ready */
21+
document.addEventListener("adobe_dc_view_sdk.ready", function () {
22+
/* Initialize the AdobeDC View object */
23+
var adobeDCView = new AdobeDC.View({
24+
/* Pass your registered client id */
25+
clientId: "<YOUR_CLIENT_ID>",
26+
/* Pass the div id in which PDF should be rendered */
27+
divId: "adobe-dc-view",
28+
/* Pass the measurement ID corresponding to the Google Analytics 4 property. */
29+
measurementId : "<YOUR_GA4_MEASUREMENT_ID>",
30+
});
31+
32+
/* Invoke the file preview API on Adobe DC View object */
33+
adobeDCView.previewFile({
34+
/* Pass information on how to access the file */
35+
content: {
36+
/* Location of file where it is hosted */
37+
location: {
38+
url: "https://documentcloud.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
39+
/*
40+
If the file URL requires some additional headers, then it can be passed as follows:-
41+
header: [
42+
{
43+
key: "<HEADER_KEY>",
44+
value: "<HEADER_VALUE>",
45+
}
46+
]
47+
*/
48+
},
49+
},
50+
/* Pass meta data of file */
51+
metaData: {
52+
/* file name */
53+
fileName: "Bodea Brochure.pdf"
54+
}
55+
}, viewerConfig);
56+
});

More Samples/Analytics/README.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# Analytics
2+
3+
If a website is already integrated with analytics tools, such as, Adobe Analytics or Google Analytics, then PDF analytics can be collected in these tools. These samples demonstrate how website developers can collect PDF analytics generated from PDF Embed API in Adobe Analytics and Google Analytics.
4+
5+
### Adobe Analytics
6+
7+
This sample shows how to set up the PDF viewer to send analytics from PDF Embed API to Adobe Analytics.
8+
9+
To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
10+
11+
### Google Analytics
12+
13+
This sample shows how to set up the PDF viewer to send analytics from PDF Embed API to Google Analytics.
14+
15+
To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
16+
17+
## Documentation
18+
19+
To know more about the setup steps, please check the [documentation](https://developer.adobe.com/document-services/docs/overview/pdf-embed-api/howtodata/).

README.md

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ Before you can work with the PDF Embed API, you must register your application a
88

99
## Supported Platforms
1010

11-
1. Windows - Chrome, Firefox, Edge, IE11+
12-
2. Mac - Chrome, Firefox, Safari
11+
1. Windows - Chrome, Firefox, Edge Chromium
12+
2. Mac - Chrome, Firefox, Safari, Edge Chromium
1313
3. Android - Chrome
1414
4. iOS - Chrome, Safari
1515

@@ -81,6 +81,13 @@ To see it in action, copy the files in the ```More Samples/Linearization``` fold
8181
This sample demonstrates how certain user preferences (such as updated annotation colour, and coach mark after selecting any annotation tool) can be saved and remembered in the browser.
8282
To see it in action, copy the files in the ```More Samples/Save User Preferences``` folder to your computer, and open index.html in a supported browser.
8383

84+
### Analytics
85+
86+
If a website is already integrated with analytics tools, such as, Adobe Analytics or Google Analytics, then PDF analytics can be collected in these tools. These samples demonstrate how website developers can collect PDF analytics generated from PDF Embed API in Adobe Analytics and Google Analytics.
87+
To see it in action, copy the files in the ```More Samples/Analytics``` folder to your computer, and try it out in a supported browser.
88+
89+
To know more about the setup steps, please check the [documentation](https://developer.adobe.com/document-services/docs/overview/pdf-embed-api/howtodata/).
90+
8491
## JavaScript Framework Samples
8592

8693
### React Samples

0 commit comments

Comments
 (0)