MyBB Community Forums

Hi all member and Admin, i want to ask can or not we make header_welcomeblock_guest Like Facebook?

like this picture

[Image: 6iPSIDM.png]

if can anyone can reply the code....

anyone pls....i want to know...

Bumps!

Preview:

This is only the header and the header_welcomeblock_guest, if you want to completely create a seamless facebook login page, you need to combine this with the registration of MyBB and put that template first (like the index).

Modifications:

header template:

<div id="header">
    <div class="wrapper">
        <div class="logo">
            <a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a>
        </div>
        <div class="user">
        {$welcomeblock}
        </div>
    </div>
</div>

<br />

header_welcomeblock_guest template (This isn't the best way to achieve this, but it's late here, so I use tables, sorry):

<div class="login">
<form action="member.php" method="post">
  
<table border="0" cellspacing="0" cellpadding="8">
  <tr>
    <td style="margin: 0; padding: 0;"><span class="text">Email or Phone</span></td>
    <td style="margin: 0; padding: 0 0 0 8px;"><span class="text">Password</span></td>
    <td rowspan="3"><input class="loginbutton" type="submit" name="submit" value="Log In" style="cursor: pointer;" /></td>
  </tr>
  <tr>
    <td style="padding: 0;"><input type="text" class="textlog" name="username" size="25" maxlength="{$mybb->settings['maxnamelength']}" value="{$username}" /></td>
    <td style="margin: 0;"><input type="password" class="textlog" name="password" size="25" value="{$password}" /></td>
  </tr>
  <tr>
    <td style="margin: 0; padding: 0;">
    <input name="quick_remember" id="quick_login_remember" type="checkbox" value="yes" class="checkbox" checked="checked" style="float: left; margin: 0; padding: 0;" />
    <label for="quick_login_remember" style="color: #789abb; font-size: 11px; vertical-align: text-bottom; float: left; text-align: left; margin: 0 0 0 5px; padding: 0; line-height: 11px;">Keep me logged in</label>
    </td>
    <td style="margin: 0; padding: 0;">
      <a href="{$mybb->settings['bburl']}/member.php?action=lostpw" style="color: #789abb; font-size: 11px; vertical-align: text-bottom; float: left; text-align: left; margin: 0 0 0 9px; padding: 0; line-height: 11px;">Forgot your password?</a>
    </td>
  </tr>
</table>
<input type="hidden" name="action" value="do_login" /><input type="hidden" name="url" value="{$redirect_url}" />
  
</form>
</div>

CSS:

#header {
  	width: 100%;
  	min-width: 100%;
  	height: 120px;
  	background: #3a5795;
  	border-bottom: 1px solid #1c3674;
  	box-shadow: 0 0 2px #161616;
}

.logo {
	float: left;
  	margin: 24px 0 0 0;
}

.user {
	float: right;
	margin: 24px 0 0 0;
}

.login {
  	height: 44px;
	line-height: 44px;
   	margin-right: 10px;
}

.login ul {
    float: right;
    margin: 0;
    list-style: none;
}

.login li {
    display: inline;
}

.textlog {
	font-size: 11px;
    width: 142px;
    color: #000000;
    background: #FFFFFF;
	border: 1px solid #1d2a5b;
  	padding: 4px 0;
  	margin: 0;
  	float: left;
}

.text {
  	float: left;
  	text-align: left;
  	color: #FFFFFF;
  	margin: 0 0 0 1px;
  	padding: 0;
  	line-height: 7px;
  	font-size: 11px;
}

input.loginbutton {
  	font-family: Tahoma;
  	font-size: 11px;
  	font-weight: bold;
  	color: #FFFFFF;
  	line-height: 13px;
  	padding: 5px;
  	margin: 0 0 6px 0;
	border: 1px solid #2f477a;
  	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
    background: #8a9cc2; /* Old browsers */
    background: -moz-linear-gradient(top,  #8a9cc2 0%, #8a9cc2 0%, #8a9cc2 3%, #637bad 3%, #5972a7 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a9cc2), color-stop(0%,#8a9cc2), color-stop(3%,#8a9cc2), color-stop(3%,#637bad), color-stop(100%,#5972a7)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #8a9cc2 0%,#8a9cc2 0%,#8a9cc2 3%,#637bad 3%,#5972a7 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #8a9cc2 0%,#8a9cc2 0%,#8a9cc2 3%,#637bad 3%,#5972a7 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #8a9cc2 0%,#8a9cc2 0%,#8a9cc2 3%,#637bad 3%,#5972a7 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #8a9cc2 0%,#8a9cc2 0%,#8a9cc2 3%,#637bad 3%,#5972a7 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a9cc2', endColorstr='#5972a7',GradientType=0 ); /* IE6-9 */
}

input.loginbutton:active {
	background: #4e69a2;
  	border-bottom-color: #2f477a;
  	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2);
  	outline: none;
}

how can I combine the registration and the login? copy the registration code in mybb?

otai97

otai97

eNvy

otai97