All articles

Tutorials

How to Build a Client Document Portal

5 min read

Your client needs a professional way to collect documents. Right now, they’re doing it by email — a thread with seventeen attachments, three of which are the wrong version, and no clear record of what was actually received.

You could build something better. A structured, multi-step intake portal on their existing WordPress site. No external SaaS subscription for the client to manage. No new login to remember. Just a clean form on their website that guides their customers through the process and stores everything neatly in their wp-admin.

Here’s how to build it without ending up in CSS hell.

What a Document Intake Portal Actually Needs

Before reaching for a form plugin, be clear about what you’re building. A document intake portal is not a contact form. It has different requirements:

  • Multiple steps. You can’t dump twenty fields on one page. The flow must guide the user: contact details first, then context, then document upload, then review.
  • File uploads that work. PDFs, images, scanned documents. Multiple files. Large files. On mobile. Without crashing.
  • Structured storage. Submissions need to be readable by a non-technical operator. Not raw database tables — a clean inbox in wp-admin.
  • Visual isolation. The form must look professional regardless of the client’s theme. An intake portal for a law firm cannot have misaligned buttons because Divi’s global CSS reset decided to reset everything.

Step 1 — Choose the Right Architecture

The biggest mistake developers make is reaching for a monolithic form plugin for this use case. Gravity Forms and WPForms are excellent for simple forms. They are not designed for isolated, multi-step portals.

The fundamental problem: these plugins render their HTML directly into your theme’s DOM. The theme’s CSS bleeds into the form. You spend hours writing overrides. The client switches themes six months later and everything breaks again.

The right tool for a client portal is a plugin with strictly scoped CSS — one that renders its output inside a unique wrapper element so the theme’s styles cannot reach it.

Step 2 — Structure the Workflow

A document intake portal works best with four steps:

  1. Contact — First name, last name, email, phone. Keep it short. You can collect more later.
  2. Case details — A few targeted questions specific to your client’s domain. A law firm might ask for the type of matter. An accountant might ask for the tax year.
  3. Document upload — One or two clearly labeled upload fields. “Upload your signed engagement letter.” “Attach any supporting documents.” Specific labels reduce confusion and wrong files.
  4. Review and submit — Show a summary of what was provided. Let the user confirm before submitting.

Step 3 — Install the Plugin

With XPressUI, the installation flow takes about two minutes:

  1. Install and activate the XPressUI WordPress Bridge plugin.
  2. Go to XPressUI > Manage Workflows in wp-admin.
  3. Upload the exported .zip workflow package. The plugin extracts it automatically.
  4. Copy the shortcode:
    Step 1 of 4
    Step 1 of 4: Step 1: Contact
    Primary document
    *
    Upload file
    Drag a file here or browse from your device.
    Accepted: PDF or image
    Awaiting file Document upload
    The runtime can keep this server-rendered selection shell and update file state in place.
    Supporting file
    Upload file
    Drag a file here or browse from your device.
    Accepted: documents
    Awaiting file Attachment upload
    The runtime can keep this server-rendered selection shell and update file state in place.
  5. Create a new WordPress page, add a Shortcode block, paste the shortcode, publish.

That’s it. Visit the page. The form is live, isolated from the theme, ready to receive submissions.

Step 4 — Test the Operator Experience

Before handing the site to your client, submit a test entry. Upload a document. Then go to wp-admin > XPressUI > Project Inbox.

Verify that:

  • The submission appears with all fields readable
  • The uploaded file is accessible from the submission detail view
  • The file also appears in the WordPress Media Library

This is the moment that makes the client say “wow.” A structured inbox. Clickable documents. Everything in one place. No email thread chaos.

What the Client Gets

Once live, your client has a complete intake system without leaving WordPress:

  • A professional multi-step portal on their own domain
  • Every submission in a clean inbox in their wp-admin
  • Uploaded documents in their Media Library, linked to the submission
  • A form that looks identical on every device, in every browser, on every theme update

See a working Document Intake portal and submit a test entry to experience the operator inbox.


Ready to stop fighting your theme’s CSS?
Drop any complex form into any WordPress theme — pixel-perfect, zero overrides, zero CSS conflicts.

Get XPressUI Pro →

Ready to make peace with your themes?

See the decoupled architecture in action on our live demo — no signup required.