Painel de Login em página HTML
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Painel de Login em página HTML
Olá, eu estou muito por fora da Forumeiros, então gostaria de saber se é possível colocar um Painel de Login, em uma página HTML personalizada, que ficará como página de entrada do fórum.
OBS: Que funcione, por favor.
OBS: Que funcione, por favor.
Última edição por Firenando em 13.08.14 0:55, editado 1 vez(es)
Re: Painel de Login em página HTML
Veja se é isto:
Crie um página HTML, e adicione este código.
- Código:
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</head>
<body>
<style>
body {
background: url(http://i.imgur.com/tPMUcUO.jpg);
}
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400);
.styledH3 {
font-family: 'Open Sans', sans-serif;
color: #848484;
font-size: 20px;
font-weight: 700px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
line-height: 60px;
text-align: center;
background: url(http://i.imgur.com/b1KiYTW.png);
height: 60px;
}
.loginCenter {
-webkit-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.37);
-moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.37);
box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.37);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
margin:auto;
width:400px;
height: 300px;
background-color:#F8F8F8;
border: 1px solid #ccc;
}
.loginForm #username, .loginForm #password {
border: 1px solid #ccc;
height: 40px;
width: 320px;
}
.loginForm #username {
background: url(http://i.imgur.com/VvrGgTy.png) no-repeat right center white;
}
.loginForm #password {
background: url(http://i.imgur.com/OFUUH3R.png) no-repeat right center white;
}
.loginForm label[for="username"], .loginForm label[for="password"] {
margin-left: 40px;
cursor: pointer;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
color: #848484;
}
.loginForm .formButton {
cursor: pointer;
width: 320px;
height: 40px;
background: url(http://i.imgur.com/XjNZgYJ.png) center;
background-color: #1d9d24;
border: 1px solid #1d9d24;
}
</style>
<div class="loginCenter">
<div class="styledH3">User Login</div>
<div class="loginForm">
<form action="/login" method="post" class="loginForm" name="form_login">
<dl><dt><label for="username">Username</label></dt>
<dd>
<input type="text" tabindex="1" name="username" id="username" size="30" maxlength="40" value="" class="inputfield">
</dd>
</dl>
<dl><dt><label for="password">Password</label></dt>
<dd>
<input type="password" tabindex="2" id="password" name="password" size="30" maxlength="25" class="inputfield">
</dd>
</dl>
<dd>
<input type="hidden" name="redirect" value="">
<input type="hidden" name="query" value="">
<input type="submit" name="login" tabindex="6" value="" class="formButton">
</dd>
</dl>
</form>
</div>
</div>
</body>
Crie um página HTML, e adicione este código.
Re: Painel de Login em página HTML
Olá!
Código HTML:
Crie um Javascript com investimento em todas as páginas com este conteúdo
Note o hID-, nele você ira mudar o ID para a página que você criou.
Até mais!
Código HTML:
- Código:
<title>Painel de login</title> <meta charset="utf-8" /> <style type="text/css">
@font-face {
font-family: 'Sigmar One';
font-style: normal;
font-weight: 400;
src: local('Sigmar One'), local('SigmarOne'), url(http://themes.googleusercontent.com/static/fonts/sigmarone/v4/aRAZJs6CY7SV6eSg6Wx4jxsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
}
body{
margin: 0;
font: 14px Lucida sans;
background: #333 url('http://i100.photobucket.com/albums/m18/Jalokim5/jalokimgraphics/background.png') no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
color: #fff;
}
a, a:active, a:focus{
text-decoration: none;
color: #fafafa;
}
#logo{
font: 30px 'Sigmar One';
text-align: center;
padding: 0;
margin: 5em 0 0;
text-shadow: rgba(0,0,0,1) 0 0 5px;
}
form{
margin: 0 auto;
max-width: 50%;
}
#wrap{
width: 100%;
background: rgba(255,255,255,.3);
border-radius: 5px;
text-shadow: rgba(0,0,0,.5) 1px 1px 0;
box-shadow: rgba(0,0,0,.2) 0 0 3px;
text-align: center;
padding: 3em 1em;
font-family: calibri; }
hr{
margin: 1em;
border: 0;
border-top: 1px rgba(0,0,0,.2) solid;
border-bottom: 1px rgba(255,255,255,.2) solid;
}
#register{
background: url('http://imgur.com/EK2ZA9X.png') repeat-x scroll 0px 0px #8FBE5F;
box-shadow: 0px 1px 0px 0px #ADD08B inset, 0px 2px 3px rgba(0, 0, 0, 0.2);
text-shadow: 0px -1px 0px #474747;
border: 1px solid #51842F;
border-radius: 3px;
color: #FFF;
cursor: pointer;
padding: .3em 5em;
display: inline-block;
margin: 0 2em 1em;
}
#copyrights{
font-size: 10px;
font-family: calibri; margin-left: 270px; }
</style>
<form action="/login?">
<p id="logo">
Divine-Arts
</p>
<div id="wrap">
<a id="register" href="/register">Registre-se</a>
<hr />
<label for="username"> Nome: <input name="username" type="text" /> </label> <label for="password"> Senha: <input name="password" type="password" /> </label> <label for="login"> <input name="login" type="submit" value="Login" /> </label>
<hr />
<label for="sendpassword"> <a href="/profile?mode=sendpassword">Esqueci minha senha</a> </label> <label for="autologin"> <input name="autologin" id="autologin" tabindex="4" checked="checked" class="radio" type="checkbox" /> Conexão automática </label>
</div><br /> <a id="copyrights" href="http://www.forumeiros.com/">Desenvolvida por bean e waghcwb</a>
</form>
Crie um Javascript com investimento em todas as páginas com este conteúdo
- Código:
$(function(){
$('a[href="/login"]').attr('href','hID-');
});
Note o hID-, nele você ira mudar o ID para a página que você criou.
Até mais!
Tópicos semelhantes
» Erro no painel de login em página HTML
» Painel de login no topo da página
» Página de login em HTML
» Página de login em HTML
» Página de login inicial HTML
» Painel de login no topo da página
» Página de login em HTML
» Página de login em HTML
» Página de login inicial HTML
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos