docs: verify against real WHP + capture real screenshots

Discovery against the demo account on whp01 surfaced several inaccuracies:

- Cache is Valkey (Redis wire-compatible), not Redis or Memcached.
  No Memcached is offered as a separate service.
- Site Monitoring is the sidebar label (not 'AI Monitor').
- 'Add a domain' has no Primary/Add-on distinction.
- Sites form: 'Container Type' (not 'Site type'), Number of Containers
  (1-10 for horizontal scaling), CPU per Container (default 0.25),
  Memory per Container (default 256MB), SSL inline on the same form.
- Backups: default retention 5 days / 10 backups; on-demand + scheduled;
  S3 backup targets are visible and configurable.
- Email: per-domain settings live behind 'Setup Instructions' on the
  Email page; mail server hostname is on the Dashboard (per-server,
  e.g. mail01.cloud-hosting.io), not per-domain.

Also reworked the screenshot pipeline:
- New shots.config.ts targets the real index.php?page=... URLs
- Added redactSensitive() step that runs before each screenshot to swap
  server names, IPs, mail hostnames, and demo-user-isms with neutral
  placeholders. This keeps docs portable across the fleet.
- Hides .brand-full and .navbar-text (top-bar server identifier and
  Welcome greeting).
- Captured 9 real WHP screenshots; removed stale placeholders.
This commit is contained in:
2026-05-17 17:00:13 -07:00
parent 53bc37fd0d
commit c602b8f8f3
32 changed files with 460 additions and 152 deletions
@@ -11,7 +11,7 @@ import Support from '~/content/partials/support-link.mdx';
## Before you start
- A **domain added** to your account.
- A **domain added** to your account ([Add a domain](/whp/how-to/add-a-domain/) covers that).
- Decide what local part you want — the bit before the `@`. For example, `jane` to get `jane@example.com`.
- About 5 minutes.
@@ -23,62 +23,58 @@ import Support from '~/content/partials/support-link.mdx';
<Steps>
1. From the sidebar, open **Email → Email Accounts → Add Account**.
![WHP Add Email Account page](~/assets/screenshots/whp/whp-email-add.png)
1. In the sidebar, click **Email**.
![WHP Email Management page](~/assets/screenshots/whp/whp-email.png)
2. Pick the **domain** for this mailbox.
2. Scroll to **Email Accounts** and use the form to create a new account on one of your domains. You'll be asked for the domain, the local part, a password, and an optional mailbox size cap.
3. Enter the **local part** (the bit before `@`).
3. Set a **strong password** — at least 12 characters with a mix of upper case, lower case, numbers, and symbols. Email accounts are common attack targets.
4. Set a **strong password** — at least 12 characters with a mix of upper case, lower case, numbers, and symbols. Email accounts are common attack targets.
5. Choose a **mailbox size cap**. The default is usually fine; you can raise it later or via an [email upgrade add-on](/whp/add-ons/email-upgrades/).
6. Click **Create**.
4. Click **Create**. The new account appears in the **Email Accounts** list.
</Steps>
## Set up your email client
Mail server hostnames are per-domain. Find the exact incoming and outgoing hostnames for your domain on the **Dashboard** page in WHP — that page lists the IMAP, POP3, and SMTP host names along with the recommended ports and security settings.
The exact IMAP, POP3, and SMTP hostnames are listed on the Email page — click **Setup Instructions → View Instructions** under **Mail Server Access** for a step-by-step that includes the right hostnames, ports, and security settings for your server.
The typical pattern is:
The typical settings look like this; substitute the hostname shown in the Setup Instructions:
```text
IMAP (incoming)
Host: <see Dashboard>
Host: <see Setup Instructions>
Port: 993
Security: SSL/TLS
Username: full email address (e.g., jane@example.com)
Password: the one you set above
SMTP (outgoing)
Host: <see Dashboard>
Host: <see Setup Instructions>
Port: 587
Security: STARTTLS
Username: full email address
Password: same as IMAP
```
For per-client walkthroughs (Outlook, Apple Mail, etc.), see the Email clients section — coming soon.
For per-client walkthroughs (Outlook, Apple Mail, Thunderbird, etc.), see the Email clients section — coming soon.
## Webmail
The webmail URL for your domain is also listed on the **Dashboard** page in WHP.
Click **Webmail Access → Open Webmail** on the Email page to sign in to webmail in a new tab.
## Verify it worked
Send yourself a test message from another account (your personal Gmail, for example). It should arrive within a minute or two and be retrievable from both your client and webmail.
<Aside type="caution">
**SPF and DKIM records matter.** Without them, your outgoing mail will get flagged or rejected by other providers. If your domain is registered with us, we add these records automatically. If it's registered elsewhere, copy the SPF and DKIM records shown on the email account page into your registrar's DNS.
**SPF and DKIM records matter.** Without them, your outgoing mail will get flagged or rejected by other providers. We add an SPF record automatically when you add a domain. DKIM records are listed in the **DKIM Records** section near the bottom of the Email page — make sure they're present at your registrar if the domain isn't using our nameservers.
</Aside>
## Troubleshooting
**Webmail isn't reachable.** DNS for the mail subdomain may still be propagating — wait an hour and try again. The exact URL is on the Dashboard page in WHP.
**Webmail isn't reachable.** DNS for the mail subdomain may still be propagating — wait an hour and try again.
**Outgoing mail is bouncing or going to spam.** Check the SPF and DKIM records at your registrar. The email account page in WHP shows the exact records you should have.
**Outgoing mail is bouncing or going to spam.** Check the SPF and DKIM records. The DKIM Records panel on the Email page shows whether DKIM is configured for each of your domains.
**Client can connect on IMAP but not SMTP.** Some ISPs and corporate networks block outgoing port 587. Try sending from a different network to confirm; if the issue is your network, your ISP is the place to ask.