Quick Start: Set Up Your Portal in 10 Minutes
This guide takes you from a fresh install to a branded, working customer portal. You only need a few tabs of WooCommerce > Account Portal for a good result; everything else can wait.
Each tab saves on its own. Click Save Settings at the bottom of a tab before you open the next one. When a tab has changes you have not saved, Unsaved changes shows next to the button.
Before you start#
- WC Account Portal is installed and active (see Installing WC Account Portal).
- You have your logo ready, ideally an SVG or a PNG with a transparent background. A second version for dark backgrounds is a bonus.
- You have a test customer account with an order or two, so you can see the Dashboard and Orders pages with real content.
Step 1: Your look (Appearance, about 4 minutes)#
Go to WooCommerce > Account Portal > Appearance. The tab is laid out as numbered steps.
- Under Theme style, pick Clean Light (white sidebar), Deep Dark (dark sidebar) or Full Custom (every colour under your control). Deep Dark is the default.
- Under Brand colours, set the Primary Color (active menu items, primary buttons, the login page brand panel) and the Secondary Color (links in the portal content and on the login page).
- Under Logo & login page, click Select image for the Light mode logo, and for the Dark mode logo if you have one. Leave Dark mode empty to use the same logo in both modes.
- Still there, choose a Login page layout: Split, Centered card, Full background or Minimal.
- Under Account menu, choose the menu for Computers and tablets (Sidebar, Top tabs, Icon rail or Floating dock) and for Phones (Menu button or Bottom tab bar).
- Under Light / dark mode, decide whether customers get the Mode switch and which mode they see on their first visit.
- Click Save Settings.

Want the whole portal in your brand colours in one go? The Fine-tune colours step has a Copy AI prompt button: paste the prompt into an AI chat, describe your brand, and paste the CSS it returns. See the Design & Branding docs for details.
Step 2: Your words (Content & Text, about 2 minutes)#
Go to WooCommerce > Account Portal > Content & Text.
- Welcome Title: the heading on the Dashboard. The default is “Welcome back, {{first_name}}!”. You can use
{{first_name}},{{last_name}}and{{display_name}}. - Welcome Message: a short line or two under the title.
- Auth Page Tagline: the line on the brand panel of the login page.
- Announcement (optional): a bar at the top of every account page for logged-in customers, for example a shipping offer. Leave it empty for no bar.
- Click Save Settings.
Step 3: Your menu (Menu Items, about 2 minutes)#
Go to WooCommerce > Account Portal > Menu Items.
- Untick the pages your store does not need (for example Downloads if you sell nothing downloadable).
- Rename items in the Label column, and click an icon to pick a different one.
- Drag rows to change the order.
- Click Save Settings.
Step 4: Your Dashboard (Dashboard, about 1 minute)#
Go to WooCommerce > Account Portal > Dashboard. Use each widget’s switch to show or hide it, drag widgets by their handle to reorder them, and use the 1/3, 1/2, 2/3 and Full buttons to set their width. A good start: Welcome, Summary boxes, Recent orders and Help & contact. Click Save Settings.
Step 5: Protect the forms (CAPTCHA / Spam, about 1 minute)#
Bot protection is off by default. On WooCommerce > Account Portal > CAPTCHA / Spam, choose a Provider, paste the Site Key and Secret Key from your provider (not needed for Nahnu Login Shield), tick the forms under Apply to and click Save Settings.
Step 6: Check it as a customer#
Open /my-account/ in a private browser window and log in as your test customer. Check:
- the login page layout and logo
- the Dashboard widgets
- the Orders page and one order
- the menu on a phone (or with your browser window made narrow)
- both light and dark mode, using the mode switch

Last step: activate your license#
On the License tab, paste your license key and click Activate License so you get automatic updates. See Activating Your License.
Related#
Was this helpful?
Thanks for your feedback!
✓ Feedback received. Thank you!