style(design): FINDING-003,004,005,006,007,008,009 — remove emoji, H4→H3, touch targets, favicon, nav link, H1 text-wrap
This commit is contained in:
@@ -5,6 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SquareMCP Docs — AI Social Media Gateway</title>
|
||||
<meta name="description" content="Connect Claude, Codex CLI, and opencode to LinkedIn, TikTok, WhatsApp, and more via the Model Context Protocol.">
|
||||
<link rel="icon" type="image/svg+xml" href="squaremcp-logo.svg">
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
@@ -18,31 +19,31 @@
|
||||
<a href="agent-tutorial.html">Agent tutorial</a>
|
||||
<a href="https://hermes.squaremcp.com/openapi-social.json" target="_blank">API reference ↗</a>
|
||||
</div>
|
||||
<a href="https://squaremcp.com" class="nav-cta" target="_blank">Open app</a>
|
||||
<a href="https://app.squaremcp.com" class="nav-cta" target="_blank">Open app</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page">
|
||||
<div class="hero">
|
||||
<h1>Build AI agents that<br>talk to the world</h1>
|
||||
<h1>Build AI agents that talk to the world</h1>
|
||||
<p>SquareMCP connects Claude, Codex CLI, and opencode to LinkedIn, TikTok, WhatsApp, Instagram, Twitter, and more — through a single MCP server.</p>
|
||||
</div>
|
||||
|
||||
<div class="card-grid">
|
||||
<a href="getting-started.html" class="card" style="text-decoration:none;color:inherit;">
|
||||
<h4>🚀 Getting started</h4>
|
||||
<h3>Getting started</h3>
|
||||
<p>Add SquareMCP to Claude Desktop, Codex CLI, or opencode in five minutes.</p>
|
||||
</a>
|
||||
<a href="platforms.html" class="card" style="text-decoration:none;color:inherit;">
|
||||
<h4>🔌 Platform guides</h4>
|
||||
<h3>Platform guides</h3>
|
||||
<p>Connect LinkedIn, TikTok, and WhatsApp. Step-by-step setup for each platform.</p>
|
||||
</a>
|
||||
<a href="agent-tutorial.html" class="card" style="text-decoration:none;color:inherit;">
|
||||
<h4>🤖 Agent tutorial</h4>
|
||||
<h3>Agent tutorial</h3>
|
||||
<p>Real code: a Claude agent that researches news and posts to LinkedIn automatically.</p>
|
||||
</a>
|
||||
<a href="https://hermes.squaremcp.com/openapi-social.json" target="_blank" class="card" style="text-decoration:none;color:inherit;">
|
||||
<h4>📖 API reference ↗</h4>
|
||||
<h3>API reference ↗</h3>
|
||||
<p>Full OpenAPI spec for every social tool. Mail API available separately.</p>
|
||||
</a>
|
||||
</div>
|
||||
@@ -54,33 +55,33 @@
|
||||
<h2>Supported clients</h2>
|
||||
<div class="card-grid">
|
||||
<div class="card">
|
||||
<h4>Claude Desktop</h4>
|
||||
<h3>Claude Desktop</h3>
|
||||
<p>Add a <code>mcpServers</code> entry to <code>claude_desktop_config.json</code>. No extra software needed.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h4>Codex CLI</h4>
|
||||
<h3>Codex CLI</h3>
|
||||
<p>Pass <code>--mcp-server</code> or configure in <code>~/.codex/config.json</code>. Full PKCE OAuth flow supported.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h4>opencode</h4>
|
||||
<h3>opencode</h3>
|
||||
<p>Add SquareMCP to your opencode MCP providers list. HTTP Bearer transport.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h4>Custom agents</h4>
|
||||
<h3>Custom agents</h3>
|
||||
<p>Any MCP client that supports Streamable HTTP transport works. See the agent tutorial for a from-scratch example.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Supported platforms</h2>
|
||||
<div class="card-grid">
|
||||
<div class="card"><h4><span class="icon" style="background:#0a66c2;">in</span> LinkedIn</h4><p>Post text, images, and video. Search connections, send messages.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#000;">🎵</span> TikTok</h4><p>Upload and publish videos. View creator analytics.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#25d366;">💬</span> WhatsApp</h4><p>Send messages and templates. Receive inbound via webhook.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:linear-gradient(45deg,#f09433,#dc2743,#bc1888);">📷</span> Instagram</h4><p>Publish reels and image posts via Business API.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#000;">𝕏</span> Twitter / X</h4><p>Tweet with media. Search and read timeline.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#1877f2;">f</span> Facebook</h4><p>Post to pages, share photos and video.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#0088cc;">✈️</span> Telegram</h4><p>Send messages and photos via bot token.</p></div>
|
||||
<div class="card"><h4><span class="icon" style="background:#5865f2;">🎮</span> Discord</h4><p>Send messages to channels via bot.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#0a66c2;">in</span> LinkedIn</h3><p>Post text, images, and video. Search connections, send messages.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#000;font-size:11px;letter-spacing:-0.5px;">Tk</span> TikTok</h3><p>Upload and publish videos. View creator analytics.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#25d366;color:#fff;font-size:11px;">WA</span> WhatsApp</h3><p>Send messages and templates. Receive inbound via webhook.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:linear-gradient(45deg,#f09433,#dc2743,#bc1888);color:#fff;font-size:11px;">Ig</span> Instagram</h3><p>Publish reels and image posts via Business API.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#000;">𝕏</span> Twitter / X</h3><p>Tweet with media. Search and read timeline.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#1877f2;">f</span> Facebook</h3><p>Post to pages, share photos and video.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#0088cc;font-size:11px;">Tg</span> Telegram</h3><p>Send messages and photos via bot token.</p></div>
|
||||
<div class="card"><h3><span class="icon" style="background:#5865f2;font-size:11px;">Dc</span> Discord</h3><p>Send messages to channels via bot.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user