MyBB Community Forums

I there a way I can make the quick reply box appear for guest and if they try to reply, it will prompt them to login page?

It is possible with some Javascripting

First, change your Permissions in Users & Groups for guests so that they can Reply Topics.

Then go & edit Showthread.php file of your forum

Find this line:

// Guests cannot use this feature
if(!$mybb->user['uid'])
{
	error_no_permission();
}

Replace it with:

// Guests cannot use this feature
if(!$mybb->user['uid'])
{
	error_no_permission();
        $relmodal = "#loginModal";
        $modalname = "modal";
}
else {
        $relmodal = "";
        $modalname = "";
}

Save it.

No Go To Your Theme Templates -> Showthread -> showthread_quickreply

Find:

<input type="submit" class="button" value="{$lang->post_reply}" tabindex="2" accesskey="s" id="quick_reply_submit" />

Replace it with:

<input type="submit" class="button" value="{$lang->post_reply}" tabindex="2" accesskey="s" id="quick_reply_submit" rel="{$relmodal}" name="modal" />

Save it.

Now go to Ungrouped Templates -> headerinclude:

Add this at the bottom:

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

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 go to Header -> header_welcomeblock_guest & add this At the bottom:

<style>
#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;
    } 
</style>
<div id="loginModal" class="modalBox loginModalBox">
    <div class="thead">
       Please Login Before You Reply!
    </div>
    <div class="modalContent loginModalContent">
        <form method="post" action="member.php">
            <table border="0" width="100%">
                <tr>
                    <td>
                        <label for="login_username">Username:</label>
                    </td>
                    <td>
                        <input type="text" value="" style="width: 200px;" maxlength="30" size="25" name="username" class="textbox" id="login_username" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="login_password">Password:</label>
                    </td>
                    <td>
                        <input type="password" value="" style="width: 200px;" size="25" name="password" class="textbox" id="login_password" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <label class="smalltext" title="If ticked, your login details will be remembered on this computer, otherwise, you will be logged out as soon as you close your browser."><input type="checkbox" value="yes" checked="checked" name="remember" class="checkbox"> Remember?</label>
                    </td>
                    <td>
                        <input type="submit" value="Login" name="submit" class="button" />
                    </td>
                </tr>
            </table>
            <input type="hidden" value="do_login" name="action" />
            <input type="hidden" value="" name="url" />
        </form>
    </div>
</div> 

Add this at the top of the template:

<div id="mask"></div>

Save it

You are done, now test it!