Labrador Tags Plugin
The Labrador Tags plugin automatically injects access passes based on page metadata from Labrador CMS, enabling dynamic content access control based on tags and sections.
Overview
This plugin integrates with Labrador CMS's labClientAPI to dynamically generate access passes based on the current page's tags and domain. This allows for flexible content access control without hardcoding passes in the HTML.
Features
- Dynamic Pass Generation: Automatically creates passes from page tags
- DOM Traversal: Passes are collected from ancestor elements up to the page root
- Section-Based Access: Supports different access levels per section
- Tag-Based Access: Grants access based on content tags
Requirements
The page must have the Labrador CMS client API available:
window.labClientAPI = {
getPageData: () => ({
pageId: '299620',
tags: ['tilgang medlem', 'medlem'],
section: 'medlem',
site: {
domain: 'https://www.parat.com',
},
}),
};How It Works
- The plugin calls
window.labClientAPI.getPageData()to retrieve page metadata - It combines the site domain with each tag to create pass URLs
- The passes are added to the article section element as a
passattribute - When Sesamy JS checks access, it collects all
passattributes from the article element up through ancestors
Example
Given this page data:
{
site: { domain: 'https://www.parat.com' },
tags: ['tilgang medlem', 'medlem']
}The plugin generates these passes:
https://www.parat.com/tilgang%20medlemhttps://www.parat.com/medlem
These are added to the article section:
<section class="article" pass="https://www.parat.com/tilgang%20medlem,https://www.parat.com/medlem">
<sesamy-article>
<!-- Content -->
</sesamy-article>
</section>Pass Collection
Sesamy JS's content system now collects passes from all ancestor elements using the collect mode:
// When processing content
const article = window.sesamy.content.get('sesamy-article');
// article.pass contains passes from:
// 1. sesamy-article element itself
// 2. Parent section element (Lab plugin adds here)
// 3. Any other ancestor elements
// 4. sesamy-content-data elements
// All unique values, comma-separatedUse Cases
Section-Based Access
Grant access to all content in a specific section:
<section class="article member-section" pass="https://example.com/members">
<sesamy-article>
<h1>Member Content 1</h1>
</sesamy-article>
<sesamy-article>
<h1>Member Content 2</h1>
</sesamy-article>
</section>Tag-Based Access
Dynamically grant access based on content tags from your CMS.
Hierarchical Access
Combine section-level and article-level passes:
<section class="article" pass="https://example.com/section-pass">
<div class="subsection" pass="https://example.com/subsection-pass">
<sesamy-article pass="https://example.com/article-pass">
<!-- All three passes are collected and checked -->
</sesamy-article>
</div>
</section>Target Element
The plugin looks for the article section using these selectors (in order):
section.articlesection.k5a-article#main
Example article structure:
<section class="main article k5a-article" id="main">
<sesamy-article publisher-content-id="299620">
<!-- Article content -->
</sesamy-article>
</section>Debugging
Check the browser console for Lab plugin messages:
// Success
// [sesamy-lab] Adding passes to article section
// Errors
// [sesamy-lab] Lab client API not available
// [sesamy-lab] Page data not available or missing required fields
// [sesamy-lab] Could not find article section elementManual Pass Addition
You can also manually add passes to any ancestor element:
<body pass="https://example.com/site-wide-pass">
<main pass="https://example.com/main-section-pass">
<article pass="https://example.com/article-pass">
<sesamy-article>
<!-- All three passes will be collected -->
</sesamy-article>
</article>
</main>
</body>Related
- Content Management - How content and passes work
- Labrador CMS Integration
- Pass-Based Access Control