This plugin will allow you to add a bottom with quick login form, so you can quickly login from any page on your Forumotion forum.
Enlarge this image
Note : The toolbar must be activated to make use of this plugin. To activate the toolbar, go to Admin Panel > Modules > Toolbar > Config and activate the toolbar.
To install this plugin go to Admin Panel > Modules > JavaScript codes management and create a new script with the following settings.
Title : Quick Login (Toolbar)
Placement : In all the pages
CODE: Select Content
More: help.forumotion.com
Enlarge this image
Note : The toolbar must be activated to make use of this plugin. To activate the toolbar, go to Admin Panel > Modules > Toolbar > Config and activate the toolbar.
1. Installing the JavaScript
To install this plugin go to Admin Panel > Modules > JavaScript codes management and create a new script with the following settings.
Title : Quick Login (Toolbar)
Placement : In all the pages
CODE: Select Content
- Code:
// LOGIN POPUP ON TOOL BAR������������������� $(function(){$(function(){������������� if (_userdata.session_logged_in != 0)return;������������� /* -- CUSTOMIZATION BEGIN -- */������������� var both = true,����������������� redirect =window.location.pathname,����������������� imgOverlay ='http://i39.servimg.com/u/f39/18/21/41/30/overla10.png',����������������� imgConnex ='http://i59.servimg.com/u/f59/18/21/60/73/connex10.png',������������� /* -- CUSTOMIZATION END -- */����������������� content = cre('DIV'), overlay =cre('DIV'), cacheMe = cre('DIV'), style = cre('STYLE'), css ='.loginForm,.loginOverlay{position:fixed;display:none}.loginForm{background:url('+imgConnex+') no-repeat 8% center #FBFBFB;background-size:12.5%;border:1px solid #CCC;border-radius:5px;padding:5%;top:20%;left:20%;right:20%;z-index:100001;}@media(max-width:500px){.loginForm{background-image:none}}@media(min-width:1000px){.loginForm{left:25%;right:25%}}.loginForm .loginTitle{font-size:12px;margin:5px 0;}.loginOverlay{background:url('+imgOverlay+');left:0;top:0;right:0;bottom:0;z-index:100000;cursor:pointer}.loginForm div { text-align:center; }.loginForm .inputbox {font-size:14px;height:25px;width:50% !important;border-radius:3px;padding-left:30px;}.loginForm input{margin:5px 0 !important}.loginForm .button1 {font-size:14px;padding:10px 15px !important;width:54% !important}#fa_username {background:url(http://i59.servimg.com/u/f59/18/21/60/73/un10.png) no-repeat 8px center #FFF}#fa_password {background:url(http://i59.servimg.com/u/f59/18/45/41/65/pw10.png) no-repeat 10px center #FFF}';������������� content.className = 'loginForm',overlay.className = 'loginOverlay';������������� cacheMe.innerHTML = '<img src="'+imgOverlay+'"/><img src="'+imgConnex+'"/>',cacheMe.style.display = 'none';������������� style.type = 'text/css';������������� if (style.styleSheet)style.styleSheet.cssText = css;������������� elsestyle.appendChild(document.createTextNode(css));������������� document.getElementsByTagName('HEAD')[0].appendChild(style);������������� content.innerHTML = '<form action="/login" method="post" name="form_login"><br><div class="loginTitle"><font color="#3689D1"><font size=6>Welcome To Chat World.</font></font></div><div class="loginTitle">Please enter your username and password tologin.</div><div><input tabindex="100" placeholder="username" name="username" id="fa_username" size="25" maxlength="40" value="" class="inputbox autowidth" type="text"/></div><div><input tabindex="101" id="fa_password" placeholder="password" name="password" size="25" maxlength="25" class="inputbox autowidth" type="password"/></div><div><input name="redirect" value="'+redirect+'" type="hidden"><input name="login" tabindex="103" value="Log in" class="button1" type="submit"></div><a href="#close" id="closeMe" style="position:absolute;bottom:5px;right:5px;">Close</a><p align="center"><input name="autologin" id="autologin" tabindex="4" class="checkbox" checked="checked" type="checkbox"><label for="autologin"> Log in automatically</label><br/><a href="/profile?mode=sendpassword"><i class="fa" style="font-size:18px;"> </i>I forgot my password</a></p></form>';������������� insert(overlay, content, cacheMe);����������������������� if (both === true) {��������������� var a =document.getElementsByTagName('A');��������������� for (var i=0; i<a.length; i++) if(/\/login/.test(a[i].href) &&/(mainmenu|rightHeaderLink)/.test(a[i].className))a[i].onclick = function() { display('block'), fadeIn(overlay,content); document.getElementById('fa_username').focus();return false };������������� } else {���������������document.getElementById('fa_right').firstChild.onclick =function() {����������������� display('block'), fadeIn(overlay,content);�����������������document.getElementById('fa_username').focus();����������������� return false��������������� }������������� }������������� overlay.onclick = function() { close()};�������������document.getElementById('closeMe').onclick = function() {close(); return false };����������������������� function cre(el) { returndocument.createElement(el) };������������� function display(val) {content.style.display = val, overlay.style.display = val };������������� function close() { display('none'),overlay.style.opacity = 1, content.style.opacity = 1 };������������� function insert() { var args =arguments; for (var i=0; i<args.length; i++)document.body.insertBefore(args[i], document.body.firstChild)};������������� function fadeIn() {��������������� var args = arguments;��������������� for (var i=0; i<args.length; i++)args[i].style.opacity = 0;��������������� var fader =window.setInterval(function() {����������������� for (var i=0; i<args.length; i++){������������������� var opa =Number(args[i].style.opacity);������������������� if (opa >= 1) {���������������������window.clearInterval(fader);��������������������� returnargs[i].style.opacity = 1;������������������� } else args[i].style.opacity =opa + 0.15����������������� }��������������� },25);������������� }����������� })});����������������������� //END OF CODE
More: help.forumotion.com