Web Page Meta Data Manager

A versatile extension for web developers and content managers to manage, inspect, debug custom meta tags and hidden form fields.

Unlock the hidden data on any webpage and take full control of your meta tag strategy with Web Page Meta Data Manager! This versatile extension is an essential tool for web developers, SEO specialists, digital marketers, and content managers who need to quickly inspect, debug, and manage crucial on-page data. (Updated version - see releasenotes for 1.0.2 below) Why Choose Web Page Meta Data Manager? - Universal Page Inspector (Main Feature): - See All Meta Tags: Instantly view a comprehensive list of all <meta> tags (name, property, http-equiv, content, charset, etc.) on any active webpage. - Uncover Hidden Form Fields: Discover all <input type="hidden"> fields within forms on a page, grouped by form. Indispensable for debugging form submissions, tracking parameters, and understanding data flows. - Quick Page Insights: Get the page title and full URL at a glance. - Clickable Image URLs & Thumbnails: Meta tags containing image URLs (like og:image) become clickable links that open in a new tab, with a small thumbnail preview for quick visual identification. - Organized & Collapsible View: Data is presented in clean, expandable/collapsible sections for easy navigation. - Powerful Meta Tag Editor & Generator: - Customizable Meta Fields: Define the exact set of meta tags you want to manage (e.g., description, keywords, og:title, custom-tracking-id, fullUrl). - Flexible Input Types: For each managed tag, choose between a dropdown with predefined options (for consistency) or a simple text input (for unique string values). Populate from Page: When the Meta Editor is open on a general page, it attempts to pre-fill your managed fields using the meta data found on that page. - Copy Generated Meta: Easily copy the composed meta tags in correct HTML format for use anywhere. Specialized HubSpot CMS Mode: - Seamless Integration: When on a HubSpot page or blog post editor, the extension provides a focused experience for managing your configured meta tags. The "Load Current Meta" button populates your fields from the "Head HTML" section (Settings > Advanced options). - Copy Meta Data: Easily copy the generated meta tags for pasting into HubSpot's Head HTML field. Advanced Options & Data Management: - Centralized Configuration: Manage all your custom meta tag definitions, their display labels, input types, and predefined dropdown options from a dedicated options page. Intuitive Admin Interface: Features expandable/collapsible sections, direct inline editing of option values, and a sticky header for easy saving. Backup & Restore: Safeguard your configurations by exporting all settings (managed tags and predefined options) to a JSON file. Easily import from a backup to restore or share your setup. User-Friendly Design: - A taller popup with a convenient close button. - Sticky footers for action buttons, ensuring they are always accessible. - Clear status messages for all operations. How It Works: On Any Webpage (General Data Viewing & Meta Editing): - Open the extension popup. - The "Page Data Viewer" immediately displays the page title, URL, all found meta tags, and any hidden form fields in collapsible sections. - Click "Refresh Page Data" to re-scan the current page. - Click "Open Meta Editor" to switch to your custom meta tag fields. These fields will attempt to pre-fill based on the meta tags found on the current page. - Compose or edit your meta tags in the editor. - Use "Copy Generated Meta" to copy the meta tags from the editor. On a HubSpot CMS Page/Blog Editor: Navigate to your HubSpot page or blog post editor. Go to "Settings" and then "Advanced options" to make the "Head HTML" section visible. Click the "Web Page Meta Data Manager" extension icon. The popup will open in "HubSpot Meta Manager" mode. The extension will attempt to auto-load data. You can also click "Load Current Meta" to populate the fields with data from the Head HTML. Edit or select values for your managed meta tags. Use "Copy HubSpot Meta" to get the HTML string for pasting directly into HubSpot's Head HTML field. Always Available: Click "Manage Options" from the popup footer to customize your meta tag configurations and predefined values. Privacy Focused: Web Page Meta Data Manager processes data locally in your browser. Your meta tag configurations and the data from the web pages you inspect are not sent to any external servers. Web Page Meta Data Manager is perfect for: - Debugging: Quickly understanding the meta structure and hidden form data of any live website. - SEO Analysis: Inspecting how pages are presenting themselves to search engines and social media. - Competitive Research: Analyzing the meta strategies of other websites. Content Management: Ensuring consistency and accuracy in meta tag usage, especially within HubSpot. - Development: Streamlining the workflow when dealing with page head content and form data. - Install Web Page Meta Data Manager today to gain deeper insights into web pages and efficiently manage your meta data! Version 1.0.2 Release Notes This is a significant update focused on stability, new features, and compliance with Chrome Web Store policies. New Features: - Multiple Select Dropdowns: You can now configure meta tags in the Options page to allow for multiple selections in the popup. This is perfect for tags that can have several comma-separated values. - Edit Meta Tag Labels: It is now possible to edit the display label of a configured meta tag directly from the Options page. - Optional URL Fetching: The extension is now more efficient. It will only look for the "Page URL" in HubSpot's settings if you have a meta tag named fullUrl configured. Fixes & Improvements: Chrome Store Compliance: Resolved issues that led to previous rejections by removing external scripts and unused permissions. Styling is now handled by a local tailwind-jit.js file. Clipboard Functionality: The "Copy Meta" buttons have been completely re-written using the modern and more reliable Clipboard API, which should resolve all previous issues with copying to the clipboard. Page Data Viewer Restored: The "Page Data Viewer" functionality, which shows all meta tags and hidden form fields on any webpage, has been fully restored and is now collapsed by default for a cleaner look. Options Page Stability: - Fixed a bug that caused incorrect status messages when adding or removing options. - Fixed a bug where editing a meta tag's label would incorrectly add it as a predefined value. - The "Save All Changes" and "Reset" buttons are no longer activated by simply typing in the "Add New Meta Tag" form, improving user experience. - Backwards Compatibility: The import function now supports older backup files that were created before the "Multiple Select" feature was added.