Revindex Storefront

How to include registration form in checkout

When anonymous checkout is enabled, by default, the Storefront shows a "Create new account" and "Login to existing account" link on the checkout page. If the user clicks on the "Create new account" link, he will be redirected to the default site registration page. DNN allows you to customize the registration form and you can even install a 3rd party registration module.

If you prefer to include a simplified registration form directly on the same checkout page, you can do so using a custom display template for the Checkout module. Please see Display Templates for more information. Make sure you enable server-side code edit under Configuration > Security settings first.


Near the top of the code, you want to hide the existing buttons so a simple way is to add a style="display:none" attribute.

<div class="rvdsfCheckoutAccountActions" style="display:none">
  <asp:HyperLink ID="AccountRegistrationHyperLink" runat="server" resourcekey="AccountRegistrationHyperLink" CssClass="dnnPrimaryAction rvdRegisterAction" />
  <asp:HyperLink ID="AccountLoginHyperLink" runat="server" resourcekey="AccountLoginHyperLink" CssClass="dnnPrimaryAction rvdLoginAction" />

Then you want to paste the following code right underneath it. This will add the email and password textboxes as well as a new "Register" button with some C# code to create and login the user.

  <div class="dnnForm">
  <div class="dnnFormItem">
  <dnn1:LabelControl ID="EmailLabelControl" runat="server" Text="Email:"/>
  <asp:RequiredFieldValidator runat="server" ControlToValidate="EmailTextBox" Display="Dynamic" CssClass="dnnFormMessage dnnFormError" Text="Email is required." ValidationGroup="Registration"></asp:RequiredFieldValidator>
  <asp:TextBox ID="EmailTextBox" runat="server" ValidationGroup="Registration"/>
  <div class="dnnFormItem">
  <dnn1:LabelControl ID="PasswordLabelControl" runat="server" Text="Password:"/>
  <asp:RequiredFieldValidator runat="server" ControlToValidate="PasswordTextBox" Display="Dynamic" CssClass="dnnFormMessage dnnFormError" Text="Password is required." ValidationGroup="Registration"></asp:RequiredFieldValidator>
  <asp:TextBox ID="PasswordTextBox" runat="server" ValidationGroup="Registration" TextMode="Password" />
  <ul class="dnnActions">
  <li><asp:LinkButton ID="RegisterLinkButton" Text="Register" runat="server" OnClick="RegisterLinkButton_Click" ValidationGroup="Registration" CssClass="dnnPrimaryAction"/></li>

  <script runat="server">
  protected void RegisterLinkButton_Click(object sender, EventArgs e)
       var newUser = new DotNetNuke.Entities.Users.UserInfo();
       newUser.PortalID = this.PortalId;
       newUser.Email = EmailTextBox.Text;
       newUser.Username = EmailTextBox.Text;
       newUser.IsSuperUser = false;
       newUser.Membership.Approved = true;
       newUser.Membership.CreatedDate = DateTime.Now;
       newUser.Membership.Password = PasswordTextBox.Text;
       newUser.Membership.UpdatePassword = false;

       var status = DotNetNuke.Entities.Users.UserController.CreateUser(ref newUser);

       if (status != DotNetNuke.Security.Membership.UserCreateStatus.Success)
           MessagePlaceHolder.Controls.Add(DotNetNuke.UI.Skins.Skin.GetModuleMessageControl(null, "Sorry, we cannot create this user. Please make sure your email is unique and your password is at least 6 characters long.", DotNetNuke.UI.Skins.Controls.ModuleMessage.ModuleMessageType.RedError));
           var x = DotNetNuke.Entities.Users.UserController.ValidateUser(newUser, this.PortalId, true);
           DotNetNuke.Entities.Users.UserController.UserLogin(this.PortalId, newUser, this.PortalSettings.PortalName, Request.UserHostAddress, true);
           Response.Redirect(Request.RawUrl, false);

Once the form is working, you can move the "Login to existing account" button so it shows up next to your new "Register" button. This is only an example. You are certainly welcome to add more fields to capture more information or change how it works. Make sure you test and handle any potential human errors like invalid email, etc. The minimal information normally needed to create a new user account is the email address (the password can be set by you or provided by the customer).


Powered by Revindex Wiki