Sharing & Security Features

Autofocus provides powerful sharing capabilities with granular security controls. From QR codes to password protection, creators have complete control over who can access their content and how it's shared.

📱 QR Code Generation & Sharing

Dynamic QR Code Generation

Autofocus automatically generates QR codes for any page or block, making it easy to share content in physical spaces or mobile contexts.

Features

  • • High error correction (Level H) for logo overlay
  • • Custom brand colors and styling
  • • Automatic URL encoding
  • • Copy-to-clipboard functionality
  • • Download as PNG for printing

Technical Implementation

// QR Code Generation
import QRCode from 'qrcode'

const options = {
  errorCorrectionLevel: 'H',
  margin: 1,
  width: 300,
  color: {
    dark: '#0d4a94',
    light: '#ffffff'
  }
}

await QRCode.toCanvas(canvas, url, options)

Usage Scenarios

Business Cards

Link to your complete profile instead of cramming information on paper

Event Sharing

Quick access to portfolios, menus, or event information

Print Materials

Bridge physical and digital marketing with QR codes

🌐 Social Media Integration

Platform Support

Built-in sharing for major social platforms with custom messages and optimal formatting.

Supported Platforms

Twitter/XText + URL
FacebookURL sharing
LinkedInProfessional sharing
WhatsAppDirect messaging

Share URLs

// Platform-specific URL generation
const SHARE_PLATFORMS = {
  twitter: (url, title) => 
    `https://twitter.com/intent/tweet?url=${url}&text=${title}`,
  facebook: (url) => 
    `https://www.facebook.com/sharer/sharer.php?u=${url}`,
  linkedin: (url, title) => 
    `https://www.linkedin.com/sharing/share-offsite/?url=${url}&title=${title}`,
  whatsapp: (url, title) => 
    `https://wa.me/?text=${title} ${url}`
}

Link Optimization

Automatic Copy to Clipboard

When share popup opens, URLs are automatically copied for quick pasting

navigator.clipboard.writeText(url)

Clean URLs

Autofocus generates clean, readable URLs perfect for sharing

autofoc.us/nate/portfolio

🔐 Password Protection System

Page-Level Security

Protect sensitive content with password-protected pages and redirect links. Perfect for client work, private collections, or exclusive content.

Features

  • • Per-page password protection
  • • Custom password requirements
  • • Secure server-side verification
  • • No password exposure in client code
  • • Session-based access control

Security Implementation

  • • Passwords stored in encrypted metadata
  • • Server-side verification only
  • • No password hints or recovery
  • • Rate limiting on password attempts
  • • Automatic session timeout

Redirect Pages with Protection

Create protected redirect pages that require password verification before forwarding users to external URLs.

API Verification Process

// Password verification API
POST /api/verify-redirect-password
{
  "username": "creator",
  "pageSlug": "private-link", 
  "password": "userInput"
}

// Response (never exposes actual password)
{
  "success": true | false
}

// On success: redirect to target URL
// On failure: show error message

Use Cases

Client Galleries

Share photography or design work with specific clients

Premium Content

Exclusive content for subscribers or members

Private Links

Secure access to sensitive documents or resources

👁️ Content Visibility & Access Control

Public vs Private Content

Public Pages

  • • Accessible without authentication
  • • Indexed by search engines
  • • Social media preview cards
  • • QR code and link sharing
  • • API access available

Private Pages

  • • Authentication required
  • • Hidden from search engines
  • • No social media previews
  • • Access logging and analytics
  • • Role-based permissions

Link Shortening & Tracking

Autofocus provides clean, short URLs that are easy to share and remember, with built-in analytics for tracking engagement.

URL Structure

Profile:autofoc.us/username
Page:autofoc.us/username/page
Block:autofoc.us/username/page#block-id

Analytics Tracking

  • • Page view analytics
  • • Referrer tracking
  • • Geographic data
  • • Device and browser info
  • • Time-based analytics

🔍 SEO & Social Media Optimization

Automatic Meta Tag Generation

Autofocus automatically generates optimal meta tags for social media sharing and search engine optimization.

Generated Meta Tags

<!-- Open Graph (Facebook, LinkedIn) -->
<meta property="og:title" content="Page Title - Creator Name" />
<meta property="og:description" content="Page description..." />
<meta property="og:image" content="https://autofoc.us/preview.jpg" />
<meta property="og:url" content="https://autofoc.us/username/page" />

<!-- Twitter Cards -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Page Title - Creator Name" />
<meta name="twitter:description" content="Page description..." />
<meta name="twitter:image" content="https://autofoc.us/preview.jpg" />

<!-- SEO -->
<meta name="description" content="Page description..." />
<link rel="canonical" href="https://autofoc.us/username/page" />

Custom Preview Cards

Dynamic Previews

  • • Profile picture as default image
  • • First image block as preview
  • • Custom page descriptions
  • • Brand-consistent styling

Platform Optimization

  • • Twitter card format
  • • Facebook Open Graph
  • • LinkedIn optimization
  • • WhatsApp link previews