Skip to content

Redesign landing, add support button, rename deploy page to /plugin/ #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
tts-empire wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Redesign landing, add support button, rename deploy page to /plugin/ #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ba6886f
Redesign landing, add support button, rename deploy page to /plugin/
tts-empire Jun 29, 2026
94d1e50
Add "Buy me a coffee" button to the docs
tts-empire Jun 29, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 47 additions & 0 deletions docs/assets/brand/public.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,3 +28,50 @@ body {
.md-typeset code {
border-radius: 4px;
}

/* Floating "Buy me a coffee" — self-contained (docs do not load site.css) */
.support-fab {
position: fixed;
right: 20px;
bottom: 20px;
z-index: 50;
display: inline-flex;
align-items: center;
gap: 9px;
padding: 12px 18px;
border-radius: 999px;
background: #f6b269;
border: 1px solid #f6b269;
color: #111;
font: 700 14px/1 Inter, Satoshi, "Helvetica Neue", Arial, sans-serif;
text-decoration: none;
box-shadow: 0 12px 34px rgba(246, 178, 105, .28);
transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.support-fab svg {
width: 20px;
height: 20px;
flex: 0 0 20px;
fill: none;
stroke: #111;
stroke-width: 1.9;
stroke-linejoin: round;
stroke-linecap: round;
}
.support-fab:hover {
transform: translateY(-2px);
background: #f8c184;
box-shadow: 0 16px 40px rgba(246, 178, 105, .4);
}
.support-fab:focus-visible {
outline: 3px solid #f8f8f8;
outline-offset: 3px;
}
@media (max-width: 600px) {
.support-fab span { display: none; }
.support-fab { right: 14px; bottom: 14px; padding: 11px; }
}
@media (prefers-reduced-motion: reduce) {
.support-fab { transition: none; }
.support-fab:hover { transform: none; }
}
2 changes: 1 addition & 1 deletion website/404.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Not found — SpawnWP</title><meta name="robots" content="noindex,follow"><link rel="icon" href="/assets/favicon.svg" type="image/svg+xml"><link rel="stylesheet" href="/assets/site.css"></head><body><main><section class="hero"><div class="eyebrow">404</div><h1>Nothing spawned here.</h1><p class="lede">The requested page does not exist.</p><div class="actions"><a class="button primary" href="/">Back to SpawnWP</a><a class="button secondary" href="/docs/">Documentation</a></div></section></main></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Not found — SpawnWP</title><meta name="robots" content="noindex,follow"><link rel="icon" href="/assets/favicon.svg" type="image/svg+xml"><link rel="stylesheet" href="/assets/site.css"></head><body><main><section class="hero"><div class="eyebrow">404</div><h1>Nothing spawned here.</h1><p class="lede">The requested page does not exist.</p><div class="actions"><a class="button primary" href="/">Back to SpawnWP</a><a class="button secondary" href="/docs/">Documentation</a></div></section></main><a class="support-fab" href="https://buymeacoffee.com/spawnwp.com" target="_blank" rel="noopener noreferrer" aria-label="Support SpawnWP — buy me a coffee"><svg aria-hidden="true" viewBox="0 0 24 24"><path d="M4 8h12v6a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V8Z"/><path d="M16 9h2.5a2.5 2.5 0 0 1 0 5H16"/><path d="M7 3.5v2M10.5 3.5v2M14 3.5v2"/></svg><span>Buy me a coffee</span></a></body></html>
Binary file added website/assets/screens/plugin.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
37 changes: 32 additions & 5 deletions website/assets/site.css
View file
Open in desktop

Large diffs are not rendered by default.

25 changes: 13 additions & 12 deletions website/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,14 +40,15 @@
<nav aria-label="Primary navigation">
<a href="#how">How it works</a>
<a href="#features">Features</a>
<a href="/deploy/">Optional WP plugin</a>
<a href="/plugin/">Optional WP plugin</a>
<a href="/docs/">Docs</a>
<a href="https://github.com/tts-empire/spawnwp">GitHub</a>
</nav>
</header>

<main id="main">
<section class="hero">
<div class="spawn-grid" aria-hidden="true"><i></i><i></i><i></i><i class="ghost"></i><i></i><i></i></div>
<div class="hero-copy">
<div class="eyebrow">Free, self-hosted WordPress lab</div>
<h1>Your WordPress lab.<br>Your server.<br><em>Your rules.</em></h1>
Expand Down Expand Up @@ -95,9 +96,9 @@ <h1>Your WordPress lab.<br>Your server.<br><em>Your rules.</em></h1>
</section>

<section class="principles" aria-label="Product principles">
<article><span>01</span><h2>Disposable by design</h2><p>Create an environment for a task. Reset it, snapshot it or destroy it when the work is done.</p></article>
<article><span>02</span><h2>Self-hosted first</h2><p>Run on your own Debian or Ubuntu server without a hosted control plane or SaaS dependency.</p></article>
<article><span>03</span><h2>Simple operations</h2><p>Use the web cockpit for routine work and clear logs when you need to inspect the system.</p></article>
<article><span class="cell-mark" data-cell="1" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h2>Disposable by design</h2><p>Create an environment for a task. Reset it, snapshot it or destroy it when the work is done.</p></article>
<article><span class="cell-mark" data-cell="5" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h2>Self-hosted first</h2><p>Run on your own Debian or Ubuntu server without a hosted control plane or SaaS dependency.</p></article>
<article><span class="cell-mark" data-cell="9" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h2>Simple operations</h2><p>Use the web cockpit for routine work and clear logs when you need to inspect the system.</p></article>
</section>

<section id="how" class="section split">
Expand All @@ -116,13 +117,13 @@ <h2>From a fresh server to WordPress environments.</h2>
<div class="eyebrow">Built for development work</div>
<h2>Everything needed for a focused WordPress lab.</h2>
<div class="feature-grid">
<article><div class="mini-mark">01</div><h3>Isolated stacks</h3><p>Each environment gets its own Nginx, PHP-FPM, MariaDB, Mailpit and Adminer containers.</p></article>
<article><div class="mini-mark">02</div><h3>Web cockpit</h3><p>Create, start, stop, restart, snapshot, restore and destroy environments from one focused interface.</p></article>
<article><div class="mini-mark">03</div><h3>WordPress QA</h3><p>The development blueprint includes Plugin Check, Theme Check, PHPCS, PHPStan and Query Monitor.</p></article>
<article><div class="mini-mark">04</div><h3>Secure defaults</h3><p>HTTPS, mandatory cockpit authentication, random secrets and loopback-only service ports.</p></article>
<article><div class="mini-mark">05</div><h3>Multiple PHP versions</h3><p>Select a supported PHP runtime when creating an environment and keep project requirements explicit.</p></article>
<article><div class="mini-mark">06</div><h3>No SaaS lock-in</h3><p>The runtime lives on your server and the project is distributed under the MIT License.</p></article>
<article class="feature-wide"><div class="mini-mark">Optional WordPress plugin</div><h3>Need to move a finished site out of your lab?</h3><p>Use any backup, migration or publishing workflow you prefer. If the destination is a separate, fresh WordPress installation, the optional SpawnWP Deploy plugin can transfer the site once for you. The plugin is not required to use SpawnWP.</p><a href="/deploy/">See the optional WordPress plugin →</a></article>
<article><span class="cell-mark" data-cell="2" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>Isolated stacks</h3><p>Each environment gets its own Nginx, PHP-FPM, MariaDB, Mailpit and Adminer containers.</p></article>
<article><span class="cell-mark" data-cell="4" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>Web cockpit</h3><p>Create, start, stop, restart, snapshot, restore and destroy environments from one focused interface.</p></article>
<article><span class="cell-mark" data-cell="6" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>WordPress QA</h3><p>The development blueprint includes Plugin Check, Theme Check, PHPCS, PHPStan and Query Monitor.</p></article>
<article><span class="cell-mark" data-cell="8" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>Secure defaults</h3><p>HTTPS, mandatory cockpit authentication, random secrets and loopback-only service ports.</p></article>
<article><span class="cell-mark" data-cell="3" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>Multiple PHP versions</h3><p>Select a supported PHP runtime when creating an environment and keep project requirements explicit.</p></article>
<article><span class="cell-mark" data-cell="7" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><h3>No SaaS lock-in</h3><p>The runtime lives on your server and the project is distributed under the MIT License.</p></article>
<article class="feature-wide"><div class="mini-mark">Optional WordPress plugin</div><h3>Need to move a finished site out of your lab?</h3><p>Use any backup, migration or publishing workflow you prefer. If the destination is a separate, fresh WordPress installation, the optional SpawnWP Deploy plugin can transfer the site once for you. The plugin is not required to use SpawnWP.</p><a href="/plugin/">See the optional WordPress plugin →</a></article>
</div>
</section>

Expand All @@ -144,8 +145,8 @@ <h2>Bring a fresh server. Spawn everything else.</h2>
<footer>
<a class="brand" href="/"><span class="brand-mark" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span>Spawn<strong>WP</strong></span></a>
<p>Self-hosted tooling for disposable WordPress development environments.</p>
<a class="support-link" href="https://buymeacoffee.com/spawnwp.com" target="_blank" rel="noopener noreferrer"><svg aria-hidden="true" viewBox="0 0 24 24"><path d="M4 6h13v8a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5V6Zm13 2h1.5a3.5 3.5 0 1 1 0 7H17v-2h1.5a1.5 1.5 0 1 0 0-3H17V8ZM6 3h2v2H6V3Zm4 0h2v2h-2V3Zm4 0h2v2h-2V3Z"/></svg><span>Buy me a coffee</span></a>
<div><a href="/docs/">Documentation</a><a href="https://github.com/tts-empire/spawnwp">GitHub</a><a href="https://github.com/tts-empire/spawnwp/blob/main/LICENSE">MIT License</a></div>
</footer>
<a class="support-fab" href="https://buymeacoffee.com/spawnwp.com" target="_blank" rel="noopener noreferrer" aria-label="Support SpawnWP — buy me a coffee"><svg aria-hidden="true" viewBox="0 0 24 24"><path d="M4 8h12v6a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V8Z"/><path d="M16 9h2.5a2.5 2.5 0 0 1 0 5H16"/><path d="M7 3.5v2M10.5 3.5v2M14 3.5v2"/></svg><span>Buy me a coffee</span></a>
</body>
</html>
8 changes: 8 additions & 0 deletions website/mkdocs-overrides/main.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,3 +22,11 @@
<meta name="twitter:image" content="https://spawnwp.com/assets/og-spawnwp-wordpress-lab.png">
<meta name="twitter:image:alt" content="SpawnWP: create isolated WordPress sites on your own server">
{% endblock %}

{% block footer %}
{{ super() }}
<a class="support-fab" href="https://buymeacoffee.com/spawnwp.com" target="_blank" rel="noopener noreferrer" aria-label="Support SpawnWP — buy me a coffee">
<svg aria-hidden="true" viewBox="0 0 24 24"><path d="M4 8h12v6a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V8Z"/><path d="M16 9h2.5a2.5 2.5 0 0 1 0 5H16"/><path d="M7 3.5v2M10.5 3.5v2M14 3.5v2"/></svg>
<span>Buy me a coffee</span>
</a>
{% endblock %}
Loading
Loading