Authors Targets & Tags Installation
To capture the author, category, and tags of the clicked article, it's essential to identify these elements on the Home Page by implementing the appropriate data-attributes.
Prerequisites
Confirm that you have completed the installation of the Publisher Analytics Plugin.
Installation
Data-attributes:
data-npaw-article
data-npaw-article-author
data-npaw-article-category
data-npaw-article-tag
These data-attributes should be added to the elements within the article that already have the data-npaw-article
data-attribute.
If any of the required data-attributes are absent, the corresponding information will not be captured.
Below are examples demonstrating articles with all their elements correctly identified using the appropriate data-attributes:
Example 1: Data-attributes on the <article>
element
<html>
<head>
<title>Here is the title of the page</title>
<!-- Publisher Analytics -->
<script src="https://publisheranalytics.ai/publisher-sdk"></script>
<script>
const accountCode = "demoAccountCode"; // CHANGE HERE
const flickerControl = false; // CHANGE HERE IF YOU WANT
new PublisherAnalyticsSDK(accountCode, flickerControl);
</script>
<!-- /Publisher Analytics -->
</head>
<body>
<div>
<!-- ARTICLE WITH DATA-ATTRIBUTES ON THE ARTICLE ELEMENT -->
<article
data-npaw-article
data-npaw-article-author="Dr. Jane Smith"
data-npaw-article-category="Science"
data-npaw-article-tag="Renewable Energy"
>
<a
data-npaw-article-url
href="https://breaknews/breakthrough-discovery"
>
<img
data-npaw-article-image
src="https://breaknews/assets/image01"
alt="alt text for image"
/>
</a>
<a
data-npaw-article-url
href="https://breaknews/breakthrough-discovery"
>
<h2 data-npaw-article-title>
Breakthrough Discovery: Scientists Unveil New Renewable Energy
Source
</h2>
<p data-npaw-article-description>
Researchers have announced a groundbreaking discovery of a novel
renewable energy source, promising to revolutionize the way we power
our world and significantly reduce our reliance on fossil fuels.
</p>
</a>
</article>
</div>
</body>
</html>
Example 2: Getting value from attribute value
<html>
<head>
<title>Here is the title of the page</title>
<!-- Publisher Analytics -->
<script src="https://publisheranalytics.ai/publisher-sdk"></script>
<script>
const accountCode = "demoAccountCode"; // CHANGE HERE
const flickerControl = false; // CHANGE HERE IF YOU WANT
new PublisherAnalyticsSDK(accountCode, flickerControl);
</script>
<!-- /Publisher Analytics -->
</head>
<body>
<!-- BASIC ARTICLE SAMPLE -->
<article data-npaw-article>
<a data-npaw-article-url href="https://breaknews/exploring-the-depths">
<h2 data-npaw-article-title>
Exploring the Depths: Unraveling the Mysteries of the Ocean's Twilight
Zone
</h2>
</a>
<div>
<span data-npaw-article-author="Dr. Jane Smith"
>Dr. Jane Smith for the newspaper</span
>
<span data-npaw-article-category="Science">Science</span>
<span data-npaw-article-tag="Renewable Energy">Renewable Energy</span>
</div>
</article>
</body>
</html>
Example 3: Getting value from inner text
<html>
<head>
<title>Here is the title of the page</title>
<!-- Publisher Analytics -->
<script src="https://publisheranalytics.ai/publisher-sdk"></script>
<script>
const accountCode = "demoAccountCode"; // CHANGE HERE
const flickerControl = false; // CHANGE HERE IF YOU WANT
new PublisherAnalyticsSDK(accountCode, flickerControl);
</script>
<!-- /Publisher Analytics -->
</head>
<body>
<div>
<!-- BASIC ARTICLE SAMPLE -->
<article data-npaw-article>
<a data-npaw-article-url href="https://breaknews/exploring-the-depths">
<h2 data-npaw-article-title>
Exploring the Depths: Unraveling the Mysteries of the Ocean's
Twilight Zone
</h2>
</a>
<div>
<span data-npaw-article-author>Dr. John Doe</span>
<span data-npaw-article-category>Environment</span>
<span data-npaw-article-tag>Oceanography</span>
</div>
</article>
</div>
</body>
</html>
Important Details!
- The procedure for identifying authors, categories, and tags should be performed on the home page HTML.
- Ensure that the
data-npaw-article-author
,data-npaw-article-category
, anddata-npaw-article-tag
data-attributes are placed within the element that has thedata-npaw-article
data-attribute. - The value of these data-attributes can be passed as an attribute value. If no value is provided, the inner text of the element will be considered.
All right! You've completed the installation. Now you can capture detailed information about the authors, categories, and tags of the articles on your home page