signup form

Discussion in 'Templates customization' started by sarah_rendle, Jun 3, 2014.

  1. sarah_rendle

    sarah_rendle Member

    Joined:
    Apr 3, 2014
    Messages:
    69
    I have searched the forums for this question and it seems to me that many people have asked but with no solution give. So I am expecting the same however I have learnt there is no harm in asking.

    I would like ideally to embed the signup form into my website - I understand it is easier to customise a theme but I really do not want the title "Members area" on my signup but do want this in title the Members area.

    I see so many people have asked about embedding the signup we can do this for login but not for the signup which seems odd to me.

    My question is has anyone successfully embedded the signup form in their website? If so would you share we me and others how you achieved this please?

    Any advice would be so very much appreciated.

    Sarah x
  2. thehpmc

    thehpmc Member

    Joined:
    Aug 24, 2006
    Messages:
    901
    I don't think you are ever going to find a simple way to achieve embedding the signup form into a simple web page.

    You can easily embed a form for signing up in any web page, that is simple enough. However you also need to make provision for the various jquerry validation checks the form uses as well as the database check to see if the chosen username is unique.

    A customised theme is always the easiest way to go as all the validation routines work correctly. You can change the page title to whatever you want within the theme.
    sarah_rendle likes this.
  3. sarah_rendle

    sarah_rendle Member

    Joined:
    Apr 3, 2014
    Messages:
    69
    Thank you - I have come to the same conclusion.
  4. thomas_serafini

    thomas_serafini New Member

    Joined:
    Feb 26, 2014
    Messages:
    4
    I've been able to embed a form in my webpage with an <iframe>
  5. thehpmc

    thehpmc Member

    Joined:
    Aug 24, 2006
    Messages:
    901
    Can you post up link to your site?
  6. thomas_serafini

    thomas_serafini New Member

    Joined:
    Feb 26, 2014
    Messages:
    4
  7. dale_s

    dale_s aMember Pro Customer

    Joined:
    Apr 12, 2013
    Messages:
    96
    Here's something that seems to work for me. It's for a free product, with a two page sign up, but you can see the point. It needs to be cleaned up some, but it's functional. Simply went to signup page, got source code, put it in an editor, stripped out what I don't need. Need to know some basic html and do some trial and error. Then, using wordpress or bootstrap, you can add columns, text, images, etc.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type="text/javascript">
        //<!--
    if (typeof jQuery == 'undefined') {document.write('<script type="text/javascript" src="/member/application/default/views/public/js/jquery/jquery.js?b3f450"></script>');} else {$=jQuery;}    //-->
    </script>
    <script type="text/javascript">
        //<!--
    window.uiDefaultDate = new Date(2014,9,15);
        //-->
    </script>
    <script type="text/javascript">
        //<!--
    window.uiDateFormat = "mm\/dd\/y";
        //-->
    </script>
    <script type="text/javascript">
        //<!--
    window.rootUrl = "\/member";
    window.CKEDITOR_BASEPATH = "\/member\/application\/default\/views\/public\/js\/ckeditor\/";
    window.amLangCount = 0;
        //-->
    </script>
    <script type="text/javascript" src="/member/application/default/views/public/js/jquery/jquery.validate.js?b3f450"></script>
    <script type="text/javascript" src="/member/application/default/views/public/js/jquery/jquery.ui.js?b3f450"></script>
    <script type="text/javascript" src="/member/application/default/views/public/js/user.js?b3f450"></script>
    <script type="text/javascript" src="/member/application/default/views/public/js/upload.js?b3f450"></script>
    </head>
    
    <body>
    <form action="/member/signup" id="page-0" method="post" class="am-signup-form">
    
    <!-- hidden field for Training Guide -->
    <input type='hidden' id='product-3-3' name='product_id_page-0[]' value='3-3' data-first_price="0.00" data-second_price="0.00"  />
    
    <div class="imf_fields"><span class="mini1">Your First Name:</span><br />
    <input type="text" size="25" name="name_f" id="name_f-0" class="formtext1" /></div>
    
    <div class="imf_fields"><span class="mini1">Email<br />
    (confirmation email will be sent)</span><br />
    <input type="text" size="25" name="email" id="email-0" class="formtext1" /></div>
    
    <p><input type="submit" value="Get Access Now" name="_qf_page-0_next" id="_qf_page-0_next-0" /></p>
    
    <input type="image" id="_qf_default" width="1" height="1" src="/member/application/default/views/public/img/empty.gif" name="_qf_page-0_next" style="display: none;" />
    <input type="hidden" name="_save_" id="_save_-0" value="page-0" />
    <input type=hidden name='amember_redirect_url' value='http://mysite.com/contact/'>
    </form>
    
    <script type="text/javascript">
    jQuery(document).ready(function($) {
        if (jQuery && jQuery.validator)
        {
            jQuery.validator.addMethod("regex", function(value, element, params) {
                return this.optional(element) || new RegExp(params[0],params[1]).test(value);
            }, "Invalid Value");
    
            jQuery("form#page-0").validate({
                ignore: ':hidden'
                ,rules: {"product_id_page-0":{"required":true},"name_f":{"required":true,"regex":["^[^=:<>{}()\"]+$",""]},"email":{"required":true,"remote":{"url":"\/member\/ajax?do=check_uniq_email"}}}
                ,messages: {"product_id_page-0":{"required":"Please choose a membership type"},"name_f":{"required":"Please enter your First Name","regex":"Please enter your First Name"},"email":{"required":"Please enter valid Email","remote":"--wrong email--"}}
                //,debug : true
                ,errorPlacement: function(error, element) {
                    error.appendTo( element.parent());
                }
                ,submitHandler: function(form, event){form.submit();}
                // custom validate js code start
               
    ,errorElement: "span"
                // custom validate js code end
            });
        }
    });
    </script>
    </body>
    </html>

Share This Page