Skip to content

Latest commit

Β 

History

20 Commits

Folders and files

NameName
Last commit message
Last commit date
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🧠 PageSage AI Reader

An intelligent browser extension that transforms how you interact with web content

Version License Chrome

AI-powered page understanding, summaries, and conversationsβ€”all without leaving the page

Features β€’ Installation β€’ Usage β€’ Privacy β€’ Contributing


PageSage AI Preview


✨ Features

πŸ€– AI-Powered Intelligence

  • Quick Summary - Automatically generates intelligent summaries of web pages, identifying page types and extracting key information
  • Interactive Chat - Have natural conversations with PageSage about any page content
  • Smart Content Extraction - Intelligently identifies and extracts main content from web pages

πŸ’¬ Conversational Experience

  • Context-Aware Chat - Ask questions and get answers based on the actual page content
  • Region Selection - Select specific parts of a page to focus conversations on particular content
  • AI-Generated Presets - Automatically generates relevant question presets based on page content and your preferences
  • Conversation History - All conversations are saved and organized for easy access

🏷️ Smart Organization

  • AI-Generated Tags - Automatically tags conversations for easy organization
  • Manual Tagging - Add your own tags to categorize conversations
  • Domain Filtering - Filter conversations by domain
  • Powerful Search - Search across all conversations, summaries, and messages

🎨 User Experience

  • Minimizable Panel - Minimize to a floating bubble that stays out of your way
  • Draggable & Resizable - Position and size the panel to your preference
  • Customizable Position - Set default panel position (top-right, top-left, bottom-right, bottom-left)
  • Domain-Based Filtering - Control which pages show the PageSage overlay

πŸ”Š Text-to-Speech

  • Audio Summaries - Listen to summaries read aloud using ElevenLabs TTS
  • Customizable Voices - Configure your preferred voice settings

βš™οΈ Flexible Configuration

  • Multiple LLM Providers - Support for any OpenAI-compatible API
  • Custom Prompts - Customize the Quick Summary generation prompt
  • User Persona - Set your preferences to get more relevant preset suggestions
  • Language Support - Choose between English and Chinese (Simplified)

πŸ“Έ Screenshots

Quick Summary
Get instant summaries of any web page with intelligent analysis of page type and key information.

Quick Summary

Interactive Chat
Have natural conversations with PageSage about page content. Select specific regions to focus your questions.

Chat Interface

Settings & Configuration
Configure your AI providers, domain filters, preferences, and more through an intuitive settings page.

Settings

Organized History
View and manage all your conversations with powerful filtering, tagging, and search capabilities.

History Management


πŸš€ Installation

From Source

  1. Clone the repository

    git clone https://github.com/yourusername/pagesage-ai.git
    cd pagesage-ai
  2. Load the extension

    • Open Chrome and navigate to chrome://extensions/
    • Enable "Developer mode" (toggle in the top right)
    • Click "Load unpacked" and select the extension directory
    • The PageSage AI icon should now appear in your browser toolbar

Configuration

  1. Click the PageSage AI icon in your browser toolbar to open the settings page

  2. Add an AI Provider

    • Click "Add new provider"
    • Enter your provider details:
      • Display name: A friendly name (e.g., "OpenAI GPT-4")
      • API base URL: Your provider's API endpoint (e.g., https://api.openai.com/v1/chat/completions)
      • API key: Your API key
      • Model name: The model to use (e.g., gpt-4, gpt-3.5-turbo)
    • Check "Set as default" if this should be your primary provider
    • Click "Save provider"
  3. Configure Domain Filtering (optional)

    • Set include/exclude domains to control where PageSage appears
    • Leave empty to show on all pages
    • Supports wildcards (e.g., *.github.com)
  4. Set Preferences (optional)

    • Configure your user persona for better preset suggestions
    • Choose your preferred language
    • Customize the Quick Summary prompt

πŸ“– Usage

Quick Summary

  1. Navigate to any web page
  2. The PageSage panel will appear automatically (if domain filtering allows)
  3. Click on the "Quick Summary" tab to see an AI-generated summary
  4. Click "πŸ”„ Regenerate" to create a new summary
  5. Click "πŸ”Š Read" to listen to the summary (requires TTS configuration)

Interactive Chat

  1. Open the "Ask PageSage" tab in the panel
  2. Option A - Use AI Presets: Click on any preset question chip to quickly ask common questions
  3. Option B - Select a Region:
    • Click "Select a region to chat"
    • Click on any part of the page to focus the conversation
    • The selected region will be highlighted
  4. Option C - Ask Custom Questions: Type your question in the chat input and press Ctrl+Enter (or Cmd+Enter on Mac)

Managing Conversations

  1. Click the PageSage icon β†’ "Chat History"
  2. Browse all your conversations
  3. Use filters to find specific conversations:
    • Search: Search across URLs, summaries, and messages
    • Domain: Filter by domain
    • Tags: Filter by AI-generated or manual tags
  4. Click "View" to see full conversation details
  5. Click "Open" to navigate to the original page

Tagging Conversations

  1. Open a conversation in the history page
  2. Click "Generate AI Tags" to automatically create tags
  3. Or manually add tags using the "Add Tag" input
  4. Tags help organize and find related conversations

πŸ”§ Advanced Features

Region Selection

Select specific parts of a page to focus your conversations:

  1. Click "Select a region to chat" in the panel
  2. Move your mouse over page elements to see them highlighted
  3. Click on the element you want to select
  4. The selected region will be highlighted with a blue border
  5. All subsequent questions will focus on this region's content
  6. Click "βœ•" next to the button to clear the selection

Custom Quick Summary Prompt

Customize how summaries are generated:

  1. Open Settings β†’ "Quick Summary" section
  2. Edit the system prompt to change how summaries are generated
  3. The prompt can include instructions for:
    • Page type identification
    • Information extraction priorities
    • Format preferences

User Persona

Improve preset suggestions by setting your persona:

  1. Open Settings β†’ "User Persona & Preferences"
  2. Describe your role, interests, or preferences
  3. Examples:
    • "I'm a software developer interested in technical documentation"
    • "I'm a business analyst focused on market research"
    • "I prefer concise, technical explanations"

Text-to-Speech Setup

Enable audio summaries:

  1. Open Settings β†’ "Text-to-Voice" section
  2. Click "Add new TTS provider"
  3. Configure ElevenLabs:
    • Enter your API key
    • Enter a Voice ID (find in your ElevenLabs dashboard)
    • Optionally configure model, speed, and stability
  4. Check "Set as default"
  5. Click "Save TTS provider"

πŸ› οΈ Technical Details

Supported Providers

LLM Providers

  • Any OpenAI-compatible API endpoint
    • OpenAI API
    • Anthropic Claude (via compatible proxy)
    • Local models (via compatible API server)
    • Other OpenAI-compatible services

TTS Providers

  • ElevenLabs (with more providers coming)

Data Storage

  • All data is stored locally in your browser
  • API keys are stored securely in Chrome's extension storage
  • No data is sent to third parties except your configured AI providers
  • Conversations are stored per URL and persist across sessions

Permissions

Permission Purpose
storage Save settings and conversation history
<all_urls> Work on any website (via content_scripts)

Note: The extension uses chrome.tabs.create() to open pages from history, which does not require the tabs permission.


πŸ”’ Privacy

Privacy-first design - Your data stays yours.

  • βœ… All data stored locally in your browser
  • βœ… No data sent to our servers (we don't operate any)
  • βœ… Page content only sent to AI service providers you configure
  • βœ… Full control over your data - delete anytime

For detailed information, see our Privacy Policy.


🀝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

πŸ“ License

This project is licensed under the MIT License - see the LICENSE file for details.


⚠️ Important Note

This extension requires you to provide your own AI API keys.

PageSage AI does not provide AI services directlyβ€”it connects to your configured providers. You are responsible for:

  • Obtaining API keys from your chosen AI service providers
  • Complying with your provider's terms of service
  • Managing API usage and costs

Built with ❀️ for privacy-first AI interactions

⬆ Back to Top

About

An intelligent browser extension that transforms how you interact with web content.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages