How Sharely auto-detects platforms

1. The Role of Platform Context in Link Showcase

When users explore a directory, visual context matters. Knowing immediately that a link leads to an open-source GitHub repository, a YouTube video tutorial, a Substack newsletter, or a Discord community server helps visitors decide whether to click.

Instead of requiring creators to manually select logos or upload custom brand badges, Sharely (overviewed here) features an intelligent, automated platform detection engine. As soon as a user enters a destination URL in our Submission Form, Sharely analyzes the URL structure, identifies the host platform, attaches brand styling badges, and suggests the most relevant category.

2. How the URL Rule Engine Works

Sharely's platform auto-detection runs through a client-side classification service (`assets/js/services/categories.js`). It evaluates the destination hostname and path parameters against a prioritized rules dictionary:

Rule Set A: Major Video & Audio Platforms

• YouTube: Matched via `youtube.com/watch`, `youtu.be/`, or `youtube.com/shorts/`. Auto-assigns the "Video & Audio" category with red brand styling.
• Spotify / SoundCloud / Vimeo: Matched via hostname domains. Auto-assigns audio/video badges.

Rule Set B: Developer Tools & Repositories

• GitHub / GitLab / CodePen: Matched via `github.com`, `gitlab.com`, or `codepen.io`. Assigns the "Developer Tools" category with high-contrast mono badges.
• IDE & Builder Tools: Matched via `cursor.com`, `replit.com`, `bolt.new`, or `v0.dev`.

Rule Set C: Reading, Writing & Newsletters

• Substack / Medium / Beehiiv / Dev.to: Matched via `substack.com`, `medium.com`, `beehiiv.com`, or `dev.to`. Auto-assigns the "Reading" category.

Rule Set D: Community Hubs & E-Commerce

• Telegram / Discord / Reddit / WhatsApp: Matched via `t.me`, `discord.gg`, `reddit.com`, or `chat.whatsapp.com`. Auto-assigns the "Community" category.
• Shopify / Etsy / Gumroad / Lemon Squeezy: Matched via vendor hostnames. Auto-assigns "Products & Store".

3. Open Graph Metadata Extraction

Beyond identifying the platform name, Sharely fetches rich metadata directly from the destination page's Open Graph protocol tags. The extraction pipeline captures:

• `og:title`: Used to suggest clean headline titles if the user left the input field blank.
• `og:description`: Extracts short summary text for poster preview cards.
• `og:image`: Generates high-resolution thumbnail graphics for showcase cards on the Explore Grid.
• Favicon Service: Retrieves high-contrast 256px favicons via Google's secure favicon API to display domain indicators.

4. Poster Generation Integration

Once platform auto-detection finishes, Sharely injects the metadata into our 3D poster card template (read poster design guide). The resulting poster displays:

1. Custom platform badge (e.g., "YouTube", "GitHub", "Substack").
2. Verified SSL lock indicator and clean domain hostname.
3. Category dot indicator and verified human click counter.

5. Conclusion and Next Steps

Sharely's platform auto-detection combines speed, privacy, and accuracy, making submission effortless for creators. Test auto-detection yourself by submitting your project on our Link Submission Form or explore community submissions on our Explore Page.