Install a lightbox style login form on Business Catalyst with Fancybox
Build dynamic login and logout buttons with creative CSS
Secure zones are a powerful component of Business Catalyst; and with secure zones come in login forms. This tutorial will show you how to make a slick pop up style login form that looks beautiful and provides an impressive bit of style your clients will love. This method means you need only have a login and logout button instead. We will demonstrate how to dynamically show the proper button and place this inside the header of your site. Additionally, we will focus on a technique for showing and hiding these buttons that is based on CSS instead of some popular JavaScript approaches. We love going this route because it eliminates the flicker of content and reduces the work load on the user's computer.
In this tutorial we will cover:
- What the jQuery plugin Fancybox is
- Proper installation of Fancybox into our site and reusable templates
- Implementation of a BC login box inside of a pop up window
- Setup of login and logout button tied to the pop up window
- How to show and hide the buttons using CSS (and no JavaScript)
- Usage of the BC module tag {module_isloggedin}
Having trouble installing this solution on your BC website? Post a comment below so the community can assist.