Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Página de acesso ao painel de controle como IPB

+11
Snow
[K]oke
Mister_Meik
Matrixsz
Stark'
[Dark]Doki-.
vitords2
Inspirage
curruwilla
Tu Vil Amigo™
Daemon
15 participantes

Início :: Forumeiros :: Dicas e tutoriaisPágina de acesso ao painel de controle como IPB

Daemon Daemon  • Seg 8 Jul 2013 - 0:54

Página de acesso ao painel de controle como IPB Empty Página de acesso ao painel de controle como IPB Seg 8 Jul 2013 - 0:54

Reputação da mensagem: 100% (7 votos)

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]
Nome do Arquivo: Página de acesso ao painel de controle como IPB
Autor: Daemon
Funcionalidade: Todas as versões
Categoria: Recursos BestSkins

Olá, neste tutorial iremos aplicar uma página de acesso ao painel de controle como no IP.Board.
Primeiro vamos criar uma página HTML.
Painel de Controle Seta Módulos Seta HTML & JAVASCRIPT Seta Gestão dos códigos html Seta Criar uma nova página html

Título: Painel de controle
Você deseja utilizar o início e o final da página do seu fórum?: Não
Usar esta página como página inicial?: Não
Código html:
Código:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<head>
 <title>Painel de Controle: Log in</title>
</head>
<body id='ipboard_body' class='login_screen'>
<form action='/login' id='qstring' name="form_login" method='post'>
<div id='login' class=''>
 <img src='http://i38.servimg.com/u/f38/17/31/71/58/login_11.png' id='login_logo' /> <div id='login_controls'>
 <label for='username'>Username</label>
 <input type="text" size="20" id="username" tabindex="1" name="username" value="" class="textinput">
 <label for='password'>Password</label>
 <input type="password" size="20" id="password" tabindex="2" name="password" value="" class="textinput"> </div>
 <div id='login_submit'>
<input type="hidden" name="redirect" value="/admin/index.forum">
<input type="hidden" name="query" value="part=admin">
<input type="hidden" name="admin" value="1">
<input type="submit" name="login" tabindex="6" value="Log In" class="button">
 </div>
</div>
</form>
</div>
</div>
</form>
<script>
$(function() {
$('input[type="text"]').first().focus();
});
</script>
</body>
</html>
<style>
html {
height: 100%;
}
body {
background: white;
font: normal 13px 'Helvetica Neue', helvetica, arial, sans-serif;
position: relative;
color: #4C4C4C;
height: 100%;
}
body.login_screen {
background: #386E9A;
background: -moz-linear-gradient(top, #4A85B5 0%, #205889 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4A85B5), color-stop(100%,#205889));
height: auto !important;
}
input, select, textarea {
font: normal 13px 'Helvetica Neue', helvetica, arial, sans-serif;
}
#login {
width: 450px;
height: 220px;
background: white;
margin: 10% auto 0 auto;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 0px 0px 12px rgba(0,0,0,0.3);
-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
position: relative;
padding: 10px;
}
#login_logo {
position: absolute;
top: -45px;
left: 0;
}
#login_controls {
margin: 0 auto;
position: absolute;
width: 100%;
bottom: 100px;
font-size: 16px;
}
#login_controls label {
display: block;
width: 33%;
color: #667078;
float: left;
clear: both;
margin-bottom: 12px;
text-align: right;
padding-right: 15px;
}
label {
cursor: default;
}
#login_controls {
font-size: 16px;
}
#login_controls input {
margin-bottom: 12px;
font-size: 14px;
width: 45%;
}
.textinput, .multitext, .input_text, .ipsTagBox_wrapper {
padding: 4px;
border-width: 1px;
border-style: solid;
border-top-color: #848484;
border-left-color: #C1C1C1;
border-right-color: #C1C1C1;
border-bottom-color: #E1E1E1;
background: white;
-moz-border-radius: 2px;
border-radius: 2px;
width: 350px;
}
#login_submit {
background: #E7EDF2;
border-top: 1px solid #D0DCE6;
padding: 20px 10px;
text-align: center;
position: absolute;
bottom: 0px;
left: 0;
right: 0;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
}
.button, .realbutton {
padding: 5px 19px;
border: 0;
background: #363636;
color: white !important;
-moz-border-radius: 3px;
border-radius: 3px;
cursor: pointer;
}
</style>
Depois iremos trocar o link lá de baixo do "Painel de controle" para o da página que criamos acima.

Vá até Painel de Controle Seta Módulos Seta HTML & JAVASCRIPT Seta Gestão dos códigos JavaScript Seta Criar um novo JavaScript.

Título: Painel de controle
Investimento: Em todas as páginas
Código javascript:
Código:
jQuery(function() {
   jQuery('a[href^="/admin"]').attr('href','/hID-');
});
Troque o "/hID-" pelo id da página criada anteriormente.


Se tiver alguma dúvida em relação a este tutorial, crie um tópico com o mesmo título.
Gostou? não custa reputar.


Última edição por Daemon em Qua 19 Mar 2014 - 23:26, editado 4 vez(es)

Tu Vil Amigo™ Tu Vil Amigo™  • Seg 8 Jul 2013 - 1:04

curruwilla curruwilla  • Seg 8 Jul 2013 - 1:08

Inspirage Inspirage  • Seg 8 Jul 2013 - 18:05

vitords2 vitords2  • Ter 9 Jul 2013 - 12:30

[Dark]Doki-. [Dark]Doki-.  • Ter 9 Jul 2013 - 13:49

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB Ter 9 Jul 2013 - 13:49

Reputação da mensagem: 100% (1 votos)
Muito bom emo Razz

Stark' Stark'  • Ter 9 Jul 2013 - 14:53

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB Ter 9 Jul 2013 - 14:53

Reputação da mensagem: 100% (1 votos)
Muito Bom Daemon , Como Sempre óTIMO

Matrixsz Matrixsz  • Ter 9 Jul 2013 - 16:58

Matrixsz Matrixsz  • Ter 9 Jul 2013 - 17:18

Daemon Daemon  • Ter 9 Jul 2013 - 18:49

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB Ter 9 Jul 2013 - 18:49

Matrix, sim... mande-me o link da página de login igual a este de algum fórum.
Até mais!

Matrixsz Matrixsz  • Ter 9 Jul 2013 - 22:17

Anonymous Convidado  • Sex 27 Set 2013 - 15:31

Mister_Meik Mister_Meik  • Dom 8 Dez 2013 - 5:01

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB Dom 8 Dez 2013 - 5:01

Esse painel não consigo colocar ele DAEMON, fiz tudo certinho, quando clico em painel, ele não abre esse painel personalizado.
Me ajudem por favor.

[K]oke [K]oke  • Dom 8 Dez 2013 - 11:34

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB Dom 8 Dez 2013 - 11:34

Mister_Meik escreveu:Esse painel não consigo colocar ele DAEMON, fiz tudo certinho, quando clico em painel, ele não abre esse painel personalizado.
Me ajudem por favor.
Olá, crie um tópico com mesmo nome na seção de códigos.

Até mais!

Snow Snow  • Seg 9 Dez 2013 - 7:33

sivastar sivastar  • Seg 9 Dez 2013 - 14:04

~Rafra ~Rafra  • Seg 30 Dez 2013 - 12:22

Alan Collins Alan Collins  • Seg 30 Dez 2013 - 12:41

avatar Eragon™  • Seg 10 Mar 2014 - 0:30

Conteúdo patrocinado  • 

Página de acesso ao painel de controle como IPB Empty Re: Página de acesso ao painel de controle como IPB

Início :: Forumeiros :: Dicas e tutoriais:: Página de acesso ao painel de controle como IPB
Permissões neste sub-fórum
Não podes responder a tópicos