User Signup - CrystalCommerce Liquid Documentation for Designers
CC Designer Docs

User Signup

The user signup page allows the user to sign up for an account on the store’s website.

The customer_fields variable has been made available in this template for adding custom fields for the signup process. To add them, you would add the following liquid somewhere in the fields (probably under required, depending on the client’s needs):

{% highlight html %}
          <tr>
            <td>
                  <label for="user_phone">Phone</label></td> <td><input type="text" name="user[phone]" value="{{ user_phone }}" />
              </td>
          </tr>
        
          {{ "{%" }} for customer_field in customer_fields %}
            <tr>
              <td>
                {{ "{%" }} include 'customer_field' with customer_field %}
              </td>
            </tr>
          {{ "{%" }} endfor %}
        {% endhighlight %}

Additional Variables Available

errors
List of string error messages from the previous step

Used in Routes

  • /user/signup

File: user_signup.liquid

Default Liquid Template

<h1 class="pagetitle">{{ "user.signup.register_an_account" | trans }}</h1>

{% if errors.size > 0 %}
  <p><strong>{{ "user.signup.errors" | trans }}</strong></p>
  <ul>
  {% for error in errors %}
    <li>{{ error }}</li>
  {% endfor %}
  </ul>
{% endif %}

{% if site.recaptcha_enabled? %}
  {% include "recaptcha_errors" %}
{% endif %}

<form method="post" action="/user/signup" id="signup_form">
{{ token_tag }}
<h2>{{ "required_fields" | trans }}</h2>
<table>
  <tr>
    <td><label for="user_firstname">{{ "user.first_name" | trans }}</label></td>
    <td><input type="text" name="user[firstname]" value="{{ user_firstname }}" /></td>
  </tr>
  <tr>
    <td><label for="user_lastname">{{ "user.last_name" | trans }}</label></td>
    <td><input type="text" name="user[lastname]" value="{{ user_lastname }}" /></td>
  </tr>
  <tr>
    <td><label for="user_email">{{ "user.email" | trans }}</label></td>
    <td><input type="text" name="user[email]" value="{{ user_email }}" /></td>
  </tr>
  <tr>
    <td><label for="user_phone">{{ "user.phone" | trans }}</label></td>
    <td><input type="text" name="user[phone]" value="{{ user_phone }}" /></td>
  </tr>

  {% for customer_field in customer_fields %}
    <tr>
      <td colspan="2">
        {% include 'customer_field' with customer_field %}
      </td>
    </tr>
  {% endfor %}
</table>
<table>
  <tr>
    <td colspan="2">
      <label for="user_password">{{ "user.signup.choose_your_password" | trans }} <span class="hint">{{ "user.signup.choose_password_hint" | trans }}</span></label>
    </td>
  </tr>
  <tr>
    <td colspan="2">
      <input type="password" name="user[password]" value="" />
    </td>
  </tr>
  <tr>
    <td colspan="2">
      <label for="user_password_confirmation">{{ "user.signup.enter_password_again" | trans }}</label>
    </td>
  </tr>
  <tr>
    <td colspan="2">
      <input type="password" name="user[password_confirmation]" value="" />
    </td>
  </tr>
  {% if site.recaptcha_enabled? %}
  <tr>
    <td colspan="2">
      {{ "recaptcha.please_verify_your_humanity" | trans }}
      {{ site.recaptcha_tags }}
    </td>
  </tr>
  {% endif %}
  <tr>
    <td colspan="2">
      <input type="submit" name="submit" value="{{ "buttons.sign_up" | trans }}" />
    </td>
  </tr>
</table>

</form>

{% if site.ssl? %}
  <p><img src="/images/rapidssl_ssl_certificate.gif" alt="Secured by RapidSSL" /></p>
{% endif %}

Default Mobile Liquid Template

<header>
  <h1 class="pagetitle">{{ "user.signup.register_an_account" | trans }}</h1>
</header>

{% if errors %}
<div class="errors">
  <p class="error">{{ "user.signup.errors" | trans }}</p>
  <ul>
  {% for error in errors %}
    <li>{{ error }}</li>
  {% endfor %}
  </ul>
</div>
{% endif %}

{% include "recaptcha_errors" %}

<div class="box">
<form method="post" action="/user/signup" id="signup_form">
{{ token_tag }}
<p class="field">
  <label for="user_firstname">{{ "user.first_name" | trans }}</label>
  <input type="text" name="user[firstname]" value="{{ user_firstname }}" />
</p>
<p class="field">
  <label for="user_lastname">{{ "user.last_name" | trans }}</label>
  <input type="text" name="user[lastname]" value="{{ user_lastname }}" />
</p>
<p class="field">
  <label for="user_email">{{ "user.email" | trans }}</label>
  <input type="text" name="user[email]" value="{{ user_email }}" />
</p>
<p class="field">
  <label for="user_phone">{{ "user.phone" | trans }}</label>
  <input type="text" name="user[phone]" value="{{ user_phone }}" />
</p>
<p class="field">
  {{ "recaptcha.please_verify_your_humanity" | trans }}
  {{ user_signup.recaptcha_tags }}
</p>
<p class="field">
  <label for="user_password">{{ "user.signup.choose_your_password" | trans }} <span class="hint">{{ "user.signup.choose_password_hint" | trans }}</span></label>
  <input type="password" name="user[password]" value="" />
</p>
<p class="field">
  <label for="user_password_confirmation">{{ "user.signup.enter_password_again" | trans }} </label>
  <input type="password" name="user[password_confirmation]" value="" />
</p>
{% for customer_field in customer_fields %}
  {% include 'customer_field' with customer_field %}
{% endfor %}
<p class="field">
  <input type="submit" name="submit" value="{{ "buttons.sign_up" | trans }}" />
</p>
</form>
</div>

Drops Supported