Page Protection Overview

<!-- Require login -->
<div data-gately-protected>
  This content is only visible to logged-in users.
</div>

<!-- Require specific plan -->
<div data-gately-protected data-plan="pro">
  This content is only visible to Pro plan members.
</div>

<!-- Show only if logged in -->
<div data-gately-show-if="logged-in">
  Welcome back!
</div>

<!-- Hide if logged in -->
<div data-gately-hide-if="logged-in">
  Please log in to continue.
</div>

// Check if user can access content
const canAccess = await gately.checkAccess('content-id')

if (canAccess) {
  showContent()
} else {
  showUpgradePrompt()
}

gately.initPageProtection({
  // Redirect unauthorized users
  redirectIfDenied: true,
  
  // Check access on page load
  checkOnLoad: true,
  
  // Custom handlers
  onAccessDenied: (content, reason) => {
    console.log('Access denied:', reason)
  },
  
  onRedirect: (url, message) => {
    console.log('Redirecting to:', url)
  }
})