MyBB Community Forums

Pages: 1 2

Credits :
euantor - For the Idea/Making a tutorial similar to this before what is different ? this tutorial show you how to make Registration box euantor shows you how to make Login box ,euantor tutorial link http://community.mybb.com/thread-117646.html
Vernier - for telling me how to disable the captcha ^^
lets begin First of all go to Admin Control Panel > Templates and Style > Templates > Your Theme > Templates > Ungrouped Templates > headerinclude and Add

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

to the bottom of the template
Second of all go to Admin Control Panel > Templates and Style > Templates > Your Theme > Templates > Header Templates > header_welcomeblock_guest and Add

<script type="text/javascript">
/**
 * Modal Boxes JS
 *
 * @author Euan T. <[email protected]>
 * @version 1.0.0
 */

jQuery.noConflict();

jQuery(document).ready(function($)
{
    // Make the jQuery modal login redirect you back to the page you're currently on //
    $('#loginModal input[name="url"]').attr("value", window.location);
    // /Login redirect //

    // Modal Boxes //
    $('a[name="modal"]').on('click', function(event)
    {
        event.preventDefault();
        
        var target = $(this).attr('rel');
        
        // Set up the shadowing
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();
        $('#mask').css({'width': maskWidth, 'height': maskHeight});
        $('#mask').fadeIn(1000);    
        $('#mask').fadeTo("slow", 0.8);  
        
        // Position the actual modal
        var winH = $(window).height();
        var winW = $(window).width();
        $(target).css('top',  (winH / 2) - ($(target).height() / 2));
        $(target).css('left', (winW / 2) - ($(target).width() / 2));
        $(target).fadeIn(2000); 
    });
    
    $('.modalBox a[rel="closeModal"]').on('click', function(event)
    {
        event.preventDefault();
        $('#mask, .modalBox').hide();
    }); 
    
    $('#mask').on('click', function ()
    {
        $(this).hide();
        $('.modalBox').hide();
    }); 
    // /Modal Boxes //
});
</script>

Now Add this under it

 <div id="mask"></div>
Welcome guest! Please <a href="{$mybb->settings['bburl']}/member.php?action=login"> Login</a> or <a href="{$mybb->settings['bburl']}/member.php?action=register" name="modal" rel="#registerModal">{$lang->welcome_register}</a>

<div id="registerModal" class="modalBox regitserModalBox">
    <div class="thead">
        Register at {$mybb->settings['bbname']}
    </div>
<div class="modalContent registerModalContent">
<form action="member.php" method="post" id="registration_form">
Username :<td><input type="text" class="textbox" name="username" id="username" style="width: 100%" value="{$username}" /></td>
Password :<td><input type="password" class="textbox" name="password" id="password" style="width: 100%" /></td>
Confirm Password:<td><input type="password" class="textbox" name="password2" id="password2" style="width: 100%" /></td>
<td colspan="2" style="display: none;" id="password_status">&nbsp;</td>
Email :<td><input type="text" class="textbox" name="email" id="email" style="width: 100%" maxlength="50" value="{$email}" /></td>
Confirm Email :<td><input type="text" class="textbox" name="email2" id="email2" style="width: 100%" maxlength="50" value="{$email2}" /></td>
<input type="hidden" name="step" value="registration" />
<input type="hidden" name="action" value="do_register" />
<br>
<input type="submit" class="classname" name="regsubmit" value="Register" />
</div>
</div>

now you must go to Admin Control Panel > Templates and Style > Themes > Edit your theme > Edit the Global.css > Add this code at the end

#mask {
    position: absolute;
    z-index: 9010;
    background-color: #000000;
    display: none;
    top: 0;
    left: 0;
}

.modalBox {
    position: fixed;
    width: 440px;
    display: none;
    z-index: 9015;
    background: #ffffff;
    border: 1px solid #000000;
    -webkit-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
    -moz-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
    box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
}
    .modalBox .thead {
        font-weight: bold;
    }
    .modalBox .modalContent {
        padding: 5px 10px;
    }

the button will look kinda basic on some themes or you might not like the color you can get your own custom plugin done visti this website for more information http://www.cssbuttongenerator.com/ when you get the css code paste it at the end of the global.css and the add

class="classname"

to the button line in the main code which is

<input type="submit" name="regsubmit" value="Register" />

after adding the class="classname it should look like this

<input type="submit" name="regsubmit" value="Register" class="classname" />

in order to get done you need to disable the captcha here is how to do it
AdminCP -> Configuration -> General Configuration -> CAPTCHA Images for Registration & Posting -> No CAPTCHA
[attachment=27489]
it kinda suck in this photo but if you had a nice theme it should look better than this
[attachment=27490]
Hope you like it
regards,

Would be better (and safe) if you add captcha.

(2012-10-17, 09:30 PM)Yaldaram Wrote: [ -> ]Would be better (and safe) if you add captcha.

yes so scary to spammer will love so much Big Grin

(2012-10-17, 09:30 PM)Yaldaram Wrote: [ -> ]Would be better (and safe) if you add captcha.

if you had the email verification spammers won't effect you
but my idea about this is to make registration take less time so people can register in less than 20 sec Smile

Oh my... thanks! I've been trying to do this for a while. Question though, I'm skipping the TOS agreement (Yaldaram's tutorial), will this affect it?

Oh, and it doesn't look like you're closing the <form> tag. You might want to do it. Smile

And finally, it seems like you haven't changed euan's code at all. I don't think it's going to do much, since the form calls a register script, but the jQuery is for a login form. Smile

(2012-10-17, 09:40 PM)illusionalp Wrote: [ -> ]
(2012-10-17, 09:30 PM)Yaldaram Wrote: [ -> ]Would be better (and safe) if you add captcha.

if you had the email verification spammers won't effect you
but my idea about this is to make registration take less time so people can register in less than 20 sec

That's absolutely not true. There are plenty of intelligent bots that can easily verify an email. Captcha is just a way of protecting you from bots signing up.

(2012-10-18, 07:16 AM)koz Wrote: [ -> ]
(2012-10-17, 09:40 PM)illusionalp Wrote: [ -> ]
(2012-10-17, 09:30 PM)Yaldaram Wrote: [ -> ]Would be better (and safe) if you add captcha.

if you had the email verification spammers won't effect you
but my idea about this is to make registration take less time so people can register in less than 20 sec

That's absolutely not true. There are plenty of intelligent bots that can easily verify an email. Captcha is just a way of protecting you from bots signing up.

thanks for the information ,i was a moderate at some forum called l**t**ckers.com and they had daily more than 100 spam posts by bots we had to remove them manually by using the good bye spammer plugin and that forum had over than 10 plugins for anti spam we even had captcha ,the point here that spammers is a problem that you always have to deal with sometimes i see spam bots posting here on here and I'm sure mybb got allot of spam protection plugins

(2012-10-18, 05:05 AM)Seabody Wrote: [ -> ]Oh my... thanks! I've been trying to do this for a while. Question though, I'm skipping the TOS agreement (Yaldaram's tutorial), will this affect it?

Oh, and it doesn't look like you're closing the <form> tag. You might want to do it.

And finally, it seems like you haven't changed euan's code at all. I don't think it's going to do much, since the form calls a register script, but the jQuery is for a login form.

the tutorial link ?
yes i haven't changed anything but it is a new idea to make your forum better i always had this issue with forums didn't want 10 hours just to make an account now anyone can make account in less than 20 sec Smile

I'm just using Registration security question plugin and have 3 or less bots each month. No other spam prevention plugin at all.

(2012-10-18, 11:13 AM)Yaldaram Wrote: [ -> ]I'm just using Registration security question plugin and have 3 or less bots each month. No other spam prevention plugin at all.

i will update my tutorial to work with this plugin can you give me the link to download it ?

(2012-10-17, 09:40 PM)illusionalp Wrote: [ -> ]
(2012-10-18, 05:05 AM)Seabody Wrote: [ -> ]Oh my... thanks! I've been trying to do this for a while. Question though, I'm skipping the TOS agreement (Yaldaram's tutorial), will this affect it?

Oh, and it doesn't look like you're closing the <form> tag. You might want to do it.

And finally, it seems like you haven't changed euan's code at all. I don't think it's going to do much, since the form calls a register script, but the jQuery is for a login form.
the tutorial link ?
yes i haven't changed anything but it is a new idea to make your forum better i always had this issue with forums didn't want 10 hours just to make an account now anyone can make account in less than 20 sec

http://community.mybb.com/thread-92606.html

No, what I meant was that I thought that it wouldn't work because the form and the jquery were calling different functions.

Pages: 1 2

illusionalp

Yaldaram

try8yes

illusionalp

Krytic

koz

illusionalp

Yaldaram

illusionalp

Krytic