[How To?] How to put login box

[MonsteR_X]

hello guys i need to know how to change my forum login to like these photo (need same igame theme styles)

simple example-

<input id="logbox" name="user" type="user" placeholder="User name or E-mail"/>
<input id="password" name="password" type="password" placeholder="password"/>
<input type="button" value="SINGIN"/>

im using default igame theme and here my forum with header_welcomeblock_guest templates,

<span style="color:white;"><strong>Not a member yet? Why not Sign up today </strong></span>

<br />

<a class="button login" href="{$mybb->settings['bburl']}/member.php?action=login" onclick="$('#quick_login').modal({ fadeDuration: 250, keepelement: true }); return false;"><font color="white"><i style="font-size: 16px;" class="fa fa-check-circle-o fa-fw"></i> Login to account</font></a> 

<a class="button2 register" href="{$mybb->settings['bburl']}/member.php?action=register"><font color="white"><i style="font-size: 16px;" class="fa fa-plus-circle fa-fw"></i>  Create an account &nbsp;</font></a>



 <div class="modal" id="quick_login" style="display: none;">
 <form method="post" action="{$mybb->settings['bburl']}/member.php">
 <input name="action" type="hidden" value="do_login" />
 <input name="url" type="hidden" value="" />
 <input name="quick_login" type="hidden" value="1" />
 <input name="my_post_key" type="hidden" value="{$mybb->post_code}" />
 <table width="100%" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" border="0" class="tborder">
 <tr>
 <td class="thead" colspan="2"><strong>{$lang->login}</strong></td>
 </tr>
 {$loginform}
 </table>
 </form>
 </div>
 <script type="text/javascript">
 $("#quick_login input[name='url']").val($(location).attr('href'));
 </script>

im try this steps but that not working  https://community.mybb.com/thread-214386.html

[[ExiTuS]]

Try this code and style for example to matches the model:

CSS:

div.logon_container { padding: 15px; background: #444; }
input.in_text, input.in_submit { background: linear-gradient(to bottom, #444 0%, #222 100%); border: 1px solid #000; border-radius: 5px; padding: 8px 12px; color: #EEE; font-weight: bold; }
input.in_submit { color: #AAA; }

And the HTML login inputs:

<div class="logon_container">
	<input type="text" name="xxx" class="in_text" placeholder="Username/E-Mail" />
	<input type="text" name="yyy" class="in_text" placeholder="Password" />
	<input type="submit" name="xxx" class="in_submit" placeholder="Username/E-Mail" />
</div>

Use this as the base for your own customizations.

[ExiTuS]

[MonsteR_X]

Try this code and style for example to matches the model:

CSS:

div.logon_container { padding: 15px; background: #444; }
input.in_text, input.in_submit { background: linear-gradient(to bottom, #444 0%, #222 100%); border: 1px solid #000; border-radius: 5px; padding: 8px 12px; color: #EEE; font-weight: bold; }
input.in_submit { color: #AAA; }

And the HTML login inputs:

<div class="logon_container">
 <input type="text" name="xxx" class="in_text" placeholder="Username/E-Mail" />
 <input type="text" name="yyy" class="in_text" placeholder="Password" />
 <input type="submit" name="xxx" class="in_submit" placeholder="Username/E-Mail" />
</div>

Use this as the base for your own customizations.

[ExiTuS]

thanks for reply. but i want default igame theme style for these buttons and text box. not like this image

[Michael2014]

Link me to live example, so I can see what you want, no pics, but an actual example on a live website, that will help

[MonsteR_X]

Link me to live example, so I can see what you want, no pics, but an actual example on a live website, that will help

im using localhost yet.
here what i want,


but that doesnt working. need to know what should type templates to connect these and move [CREATE AN ACCOUNT] to top right header

<span style="color:white;"><strong>Not a member yet? Why not Sign up today </strong></span>

<br />

				<!-- Continuation of div(class="upper") as opened in the header template -->
						<span class="welcome">
							<form method="post" action="{$mybb->settings['bburl']}/member.php">
							<input name="action" type="hidden" value="do_login" />
							<input name="url" type="hidden" value="" />
							<input name="quick_login" type="hidden" value="1" />
							<input name="quick_username" id="quick_login_username" type="text" value="" class="textbox initial_focus" placeholder="username"/>
							<input name="quick_password" id="quick_login_password" type="password" value="" class="textbox" placeholder="password"/>
							<a class="button login" href="{$mybb->settings['bburl']}/member.php?action=login" onclick="$('#quick_login').modal({ fadeDuration: 250, keepelement: true }); return false;"><font color="white"><i style="font-size: 16px;" class="fa fa-check-circle-o fa-fw"></i> Login to account</font></a>
							<a class="button2 register" href="{$mybb->settings['bburl']}/member.php?action=register"><font color="white"><i style="font-size: 16px;" class="fa fa-plus-circle fa-fw"></i>  Create an account &nbsp;</font></a>
							</form>
						</span>
					</div>
				</div>

[Serpius]

Link me to live example, so I can see what you want, no pics, but an actual example on a live website, that will help

im using localhost yet.
here what i want,


but that doesnt working. need to know what should type templates to connect these and move [CREATE AN ACCOUNT] to top right header

<span style="color:white;"><strong>Not a member yet? Why not Sign up today </strong></span>

<br />

				<!-- Continuation of div(class="upper") as opened in the header template -->
						<span class="welcome">
							<form method="post" action="{$mybb->settings['bburl']}/member.php">
							<input name="action" type="hidden" value="do_login" />
							<input name="url" type="hidden" value="" />
							<input name="quick_login" type="hidden" value="1" />
							<input name="quick_username" id="quick_login_username" type="text" value="" class="textbox initial_focus" placeholder="username"/>
							<input name="quick_password" id="quick_login_password" type="password" value="" class="textbox" placeholder="password"/>
							<a class="button login" href="{$mybb->settings['bburl']}/member.php?action=login" onclick="$('#quick_login').modal({ fadeDuration: 250, keepelement: true }); return false;"><font color="white"><i style="font-size: 16px;" class="fa fa-check-circle-o fa-fw"></i> Login to account</font></a>
							<a class="button2 register" href="{$mybb->settings['bburl']}/member.php?action=register"><font color="white"><i style="font-size: 16px;" class="fa fa-plus-circle fa-fw"></i>  Create an account &nbsp;</font></a>
							</form>
						</span>
					</div>
				</div>

Contact iAndrew about this issue. He is the author of this theme.   Go HERE