user-plusSign Up Page

Live preview: https://travio.themeupstudio.com/signup/arrow-up-right

This guide explains how the Sign Up page works and how to configure it in Ghost.

Route and Template

  • URL: /signup/

  • Route source: routes.yaml

  • Template file: signup.hbs

  • Page data source: data: page.signup

Create a Ghost page with slug signup so title, excerpt, and optional feature image render properly.

Sign Up page content source

What the Sign Up Page Does

Travio’s signup page is a member registration entry point using Ghost Members.

It renders a shared members form component with:

  • Name field (optional input, included on signup template)

  • Email field

  • Submit button

  • Loading/success/error states

  • Link to Sign In page

Template internally uses:

  • form_type="signup"

  • Success message for magic-link signup completion


How Signup Works (User Flow)

  1. Visitor enters name + email

  2. Form submits to Ghost Members system

  3. User receives magic link by email

  4. User clicks link to complete account creation

No password form is shown in this flow (Ghost magic-link auth model).


Content Mapping from page.signup

  • title → main heading

  • custom_excerpt (if present) → supporting text

  • excerpt fallback when custom excerpt is empty

  • feature_image (optional) → split-layout visual on signup page

Sign Up page content source

Required Ghost Configuration

To make signup functional:

  1. Members must be enabled in Ghost

  2. Mail delivery must be configured correctly

  3. Site domain/url config must be correct for magic links

If email delivery is not configured, users won’t receive login/signup links.


Template and Component Structure

  • Route template: signup.hbs

  • Shared form component: partials/common/members-form-page.hbs

Signup-specific configuration in template:

  • Submit label: “Sign Up”

  • Loading message: “Submitting your signup...”

  • Success message: “Check your inbox...”

  • Alternate link: points to /signin

  • Includes name input (include_name=true)


UI States and Error Handling

Form has built-in status messaging blocks for:

  • Loading state

  • Success state

  • Error state (data-members-error)

These states are toggled by Ghost members form behavior.


Sign Up page is part of a larger auth flow:

  • /signup/ — new account creation

  • /signin/ — returning user login

  • /membership/ — plan selection

  • /subscribe/ — newsletter subscription flow

Ensure all routes are configured and pages exist for a seamless journey.


Common Issues

  • Form renders but signup fails: members disabled in Ghost.

  • No magic link received: email delivery/provider setup issue.

  • Heading/content missing: signup slug page not created.

  • Wrong redirect expectations: Ghost uses magic-link flow, not password-first flow.

  • Branding inconsistency: signup page feature image not set (optional visual).


Quick Setup Checklist

  1. Page slug exists: signup

  2. Members enabled

  3. Email/magic link delivery tested

  4. /signin/ route/page available

  5. Signup status messages display correctly

Last updated