register.html

{exp:zoo_visitor:registration_form
            error_handling="inline"
            class="form"
            include_jquery ="no"
            include_assets="no"
            safecracker_head="no"
            return="register/details"}

        <p>To register an account please first enter your details</p>

        <div class="content__form__wrapper">
            <p class="content__form__item content__form__item--half">
                <label class="content__form__label" for="member_firstname">First Name</label>
                <input required id="member_firstname" name="member_firstname" type="text" class="form-control" placeholder="First Name"  {if member_firstname}value="{member_firstname}"{/if}>
            </p>

            <p class="content__form__item content__form__item--half">
                <label class="content__form__label" for="member_lastname">Surname</label>
                <input required id="member_lastname" name="member_lastname" type="text" class="form-control" placeholder="Surname" {if member_lastname}value="{member_lastname}"{/if}>
            </p>
        </div>


        {if error:email}<div class="alert alert-warning">{error:email}</div>{/if}

        <p class="content__form__item{if error:email} content__form__item--error{/if}">
            <label class="content__form__label" for="email">Email</label>
            <input required id="email" name="email" type="email" class="form-control" placeholder="Email" {if email}value="{email}"{/if}>
        </p>

        <div class="content__form__wrapper">
            {if error:password}<div class="alert alert-warning">{error:password}</div>{/if}

            <p class="content__form__item content__form__item--half{if error:password} content__form__item--error{/if}">
                <label class="content__form__label" for="password">Password</label>
                <input required id="password" name="password" type="password" class="form-control"  {if password}value="{password}"{/if}>
            </p>

            <p class="content__form__item content__form__item--half">
                <label class="content__form__label" for="password_confirm">Confirm Password</label>
                <input required id="password_confirm" name="password_confirm" type="password" class="form-control" {if password_confirm} value="{password_confirm}"{/if}> 
            </p>
        </div>

        <p class="content__form__item content__form__item--checkbox{if error:email} content__form__item--error{/if}">
            <input id="newsletter" name="newsletter[]" type="checkbox" class="form-control" checked>
            <label class="content__form__label" for="newsletter">Please keep me up-to-date with the latest <strong>{site_name}</strong> news</label>
        </p>

        <div class="content__form__wrapper">
            <p class="content__form__item content__form__item--checkbox content__form__item--inline">
                <input id="method_0" name="method[]" type="radio" class="form-control" value="email" checked>
                <label class="content__form__label" for="method_0">via Email</label>
            </p>
            <p class="content__form__item content__form__item--checkbox content__form__item--inline">
                <input id="method_1" name="method[]" type="radio" class="form-control" value="sms">
                <label class="content__form__label" for="method_1">via SMS</label>
            </p>
        </div>

        <p class="content__form__item content__form__item--submit">
            <button class="content__form__button content__form__button--next" type="submit">Register</button>
        </p>

        <p class="content__form__item content__form__item--hidden">
            <input type="hidden" name="group_id" value="5" />
        </p>
        {/exp:zoo_visitor:registration_form}