COWAA Login page reconfigured!

Check Out With Any Account COWAA has a register account part that only requires a good email, password and first name to create the start of a full account with us.

One thing that I noticed on other sites is how the log in form has changed. Amazon, Bestbuy and even Target. There neat to the point also have register account abilities..  I know I’ve heard the grumbles in the past about the ability to shorten account to register.  Which is why its part of COWAA in the first place.  I just didn’t like the cluttered arrangement of the login-create account-register account thing that the log in page turned into.

Looking at the page and thinking how can I clean it up! First, delete the things I don’t need.. I do not need the create account section.. I do not need the one click PayPal thing. I need to add the register page code to this log in form..

I use H5F in my forms across the site, but the new code is a pain and it just never was updated to meet the change in tech. The big box sites changed again and I like there design idea. How can I fix the design layout of my site?

I found a jQuery plugin for floating form labels FloatLabel.js which does the same as the big box stores. Making use of HTML5, script and CSS tricks, I was able to get what I wanted without the heavy weight of something like H5F to do validation at the user level of the form before its submitted. After all, I know the form input will be validated at the server level I really don’t need heavy validation out front.

With Float Label the label is in the form field which moves up and gets smaller once you start typing something in. It also makes use of a hind icon for required fields which changes as the form is validated using pattern matching. This is a very compact form making it grate for any screen.

The idea is to make it simple, intuitive and responsive to the user. At the same time, get ride of the old annoying form issues of the past. Double input of email and passwords!! Why!! If you type your email in wrong the first time, you well more than likely type in wrong the second time too. If you can see what you typed in the password field, why type it again! Security through obscurity is not security!

So now I have two forms, one for login using email and password. The other form I need first name, email and password. I think the welcome email sounds better with a name than a hay you!

On my site I use the remember me code and a password reset that requires a question and answer with your account. You may not have on your site unless you fond mine. This adds two more fields.

So, email, password unmasked with a hide button . Then a button to expand and hide things like the forgotten password link, change the title, show the first name field and password reset questions. Now its a register account form email, password, first name and password reset questions.

Front side is a set of script and pattern matching with bot blocking. Back side is the standard form validating and anti-robot checking.

Matching your template should be supper simple, the coded pages are just the login page. You must have COWAA installed and working before making this change. Not intended for less then ZC155e or for none COWAA installs. I’m working on matching it up to the default responsive template but its so difficult to work with it that’s changing it is a pain. One reassign why I would never use it, plus it doesn’t meet my needs.

Leave a Reply