Criar página inicial de login com HTML

Item: Criar página inicial de login com HTML
Rating: 1

por srpalim 14.01.19 22:40

Detalhes da questão

Endereço do fórum: http://policiagts.forumeiros.com
Versão do fórum: PunBB

Descrição

Olá, quero criar uma página inicial igual a essa: imgur.com/a/lIWKLvc
Entretanto, queria que vocês fizessem umas mudanças, sendo elas:

Criar página inicial de login com HTML EmNPE8K

Trocar este nome Centro Tático Revolucionário para Grupo Tático de Segurança

Criar página inicial de login com HTML VZIF3r0

Trocar a imagem de fundo para uma imagem nova, sendo ela: imgur.com/nso50pR.jpg

Criar página inicial de login com HTML KS5aQE1

Trocar essa parte para: 2019 GTS - PMGTS Forumeiros.com

Criar página inicial de login com HTML 0MoMtNc

Por ultimo, trocar esta parte por: O nosso dever é primar pela eficiência!

Código:: <!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Bem vindo(a)</title> <link type="image/png" href="https://2img.net/r/ihimg/a/img924/5586/p1t1aM.jpg" rel="icon" /> <link rel="stylesheet"href="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.css" /> <link rel="stylesheet" href="https://forumeiros.github.io/resources/font-awesome/css/font-awesome.min.css" /> <script src="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.js"></script> <script src="https://forumeiros.github.io/resources/bootstrap/popper.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script></head> <body class="bg-light" style="background:url('https://2img.net/r/ihimg/a/img922/351/wGnjmr.jpg');"><script type="text/javascript"> (function($) { 'use strict'; $(function() { $.get('/forum') .done(function(context) { if ($('a[id="logout"]', context).length != 0) { $('.alert-success').fadeIn(); setTimeout( function() { window.location.replace("/forum"); }, 3000); } }) .fail(function() { alert('Contacte o Suporte Forumeiros!'); }); }); }(jQuery)); </script> <div class="container"> <div class="py-5 text-center"> <h2>Fórum Filmes</h2> <p class="lead">+Filmes e +Séries por favor!</p> </div> <div class="row"> <div class="col-sm-9 col-md-7 col-lg-5 mx-auto"> <div class="card card-signin my-5"> <div class="card-body"> <h5 class="card-title text-center">Entrar no fórum</h5> <form class="form-signin" method="post" action="/login"> <div class="alert alert-success" style="display:none;" role="alert"> Sessão iniciada, redirecionado... </div> <div class="form-label-group"> <input class="form-control" placeholder="Seu usuário" value="" maxlength="40"size="30" id="username" name="username" tabindex="1" type="text" required autofocus /> </div> <div class="form-label-group"> <input class="form-control" maxlength="25" size="30" name="password" id="password"tabindex="2" type="password" placeholder="Sua Senha" required /> </div> <div class="custom-control custom-checkbox mb-3"> <input type="checkbox" class="custom-control-input" name="autologin"id="customCheck1" /> <label class="custom-control-label" for="customCheck1">Lembrar dados</label> </div> <input value="" name="redirect" type="hidden" /> <input value="" name="query" type="hidden" /> <input class="btn btn-lg btn-primary btn-block text-uppercase" value="Entrar"tabindex="6" name="login" type="submit" /> </form> <hr class="my-4" /> <button class="btn btn-lg btn-google btn-block text-uppercase" name="login"type="submit" onclick="location.href='/register'"><i class="fa fa-user mr-2"></i> Criar Conta</button> </div> </div> </div> </div> <footer class="my-5 pt-5 text-muted text-center text-small"> <p class="mb-1">️️️️ 2019 FF - Fórum Filmes</p> <ul class="list-inline"> <li class="list-inline-item"><a href="/forum">Início</a></li> <li class="list-inline-item"><a href="/faq">FAQ</a></li> <li class="list-inline-item"><a href="/profile?mode=sendpassword">Esqueci a senha</a></li> <li class="list-inline-item"><a href="https://www.forumeiros.com"target="_blank">Forumeiros</a></li> </ul> </footer></div></body> </html>

Espero que consigam me ajudar!

Atenciosamente, SrPalim.

por Victor Monteiro 15.01.19 16:56

Olá, Segue o código alterado, porém a imagem que o senhor solicitou está em péssima resolução, por isso deixei a mesma, caso envie outra, irei adicionar!!!

Código::  <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Entrar no fórum</title> <link type="image/png" href="https://cdn.discordapp.com/attachments/363420145248501760/534007232656834573/Screenshot_12.fw.png" rel="icon" /> <link rel="stylesheet" href="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.css" /> <link rel="stylesheet" href="https://forumeiros.github.io/resources/font-awesome/css/font-awesome.min.css" /> <script src="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.js"></script> <script src="https://forumeiros.github.io/resources/bootstrap/popper.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body class="bg-dark" style="background: url('https://cdn.discordapp.com/attachments/363420145248501760/534006014501060611/Screenshot_9.fw.png') no-repeat black; background-size: cover; background-position: center center;"> <script type="text/javascript"> (function($) { 'use strict'; $(function() { $.get('/forum') .done(function(context) { if ($('a[id="logout"]', context).length != 0) { $('.alert-success').fadeIn(); $('.register').html('Sessão iniciada, redirecionado...').prop('onclick', null); $('input').attr('disabled', true); setTimeout( function() { window.location.replace('/forum'); }, 3000); } }) .fail(function() { alert('Contacte o Suporte Forumeiros!'); }); }); }(jQuery)); </script> <div class="container"> <div class="pt-5 text-center text-light"> <h2>Grupo Tático Revolucionário</h2> <p class="lead">O nosso dever é primar pela eficiência!</p> </div> <div class="row"> <div class="col-sm-9 col-md-7 col-lg-5 mx-auto"> <div class="card border-0 shadow-lg my-5"> <div class="card-body"> <h5 class="card-title text-center">Entrar no fórum</h5> <form class="form-signin" method="post" action="/login"> <div class="form-label-group mb-3"> <input class="form-control" placeholder="Seu usuário" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required autofocus /> </div> <div class="form-label-group mb-3"> <input class="form-control" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" placeholder="Sua Senha" required /> </div> <div class="custom-control custom-checkbox mb-3 float-right"> <input type="checkbox" class="custom-control-input" name="autologin" id="autologin" /> <label class="custom-control-label" for="autologin">Lembrar dados</label> </div> <input value="" name="redirect" type="hidden" /> <input value="" name="query" type="hidden" /> <input class="btn btn-lg btn-primary btn-block text-uppercase rounded-0" value="Entrar" tabindex="6" name="login" type="submit" /> </form> <hr class="my-4" /> <button class="btn btn-lg btn-google btn-block text-uppercase register rounded-0 text-truncate" type="submit" onclick="location.href='/register'"><i class="fa fa-user mr-2"></i> Criar Conta</button> </div> </div> </div> </div> <footer class="text-light text-center text-small"> <p class="mb-1">️ 2019 GTS - PMGTS <a class="text-light" href="https://forumeiros.com">Forumeiros.com</a></p> <ul class="list-inline"> <li class="list-inline-item"><a class="text-light" href="/forum">Início</a></li> <li class="list-inline-item"><a class="text-light" href="/faq">FAQ</a></li> <li class="list-inline-item"><a class="text-light" href="/privacy">Política de Confidencialidade</a></li> <li class="list-inline-item"><a class="text-light" href="/profile?mode=sendpassword">Esqueceu a senha?</a></li> </ul> <a href="https://www.forumeiros.com" target="_blank">forumeiros.com</a> <footer class="text-light text-center text-small"> </footer> </div> </body> </html>

por srpalim 15.01.19 19:31

tenho um problema... Quando eu erro a senha nessa página ele me rediciona para a página policiagts.forumeiros.com/LOGIN e eu não quero que ele faça isso, quero que ele continue na mesma tela até a pessoa acertar a senha.

por **tikky** 15.01.19 20:06

Olá @srpalim,
Mude a sua página para a seguinte:

Código::  <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <title>Entrar no fórum</title> <link type="image/png" href="https://cdn.discordapp.com/attachments/363420145248501760/534007232656834573/Screenshot_12.fw.png" rel="icon" /> <link rel="stylesheet" href="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.css" /> <link rel="stylesheet" href="https://forumeiros.github.io/resources/font-awesome/css/font-awesome.min.css" /> <script src="https://forumeiros.github.io/resources/bootstrap/bootstrap.min.js"></script> <script src="https://forumeiros.github.io/resources/bootstrap/popper.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body class="bg-dark" style="background: url('https://cdn.discordapp.com/attachments/363420145248501760/534006014501060611/Screenshot_9.fw.png') no-repeat black; background-size: cover; background-position: center center;"> <script type="text/javascript"> (function($) { 'use strict'; $(function() { $.get('/forum?change_version=prosilver') .done(function(context) { if ($('a[id="logout"]', context).length != 0) { $('.alert-success').fadeIn(); $('.register').html('Sessão iniciada, redirecionado...').prop('onclick', null); $('input').attr('disabled', true); setTimeout( function() { window.location.replace('/forum'); }, 3000); } }) .fail(function() { alert('Contacte o Suporte Forumeiros!'); location.pathname = '/forum'; }); $('form').submit(function() { var username = $('input[name="username"]').val(), pass = $('input[name="password"]').val(), autologin = 0; if($('input[name="autologin"]').is(':checked')) autologin = 1; $.post( '/login', { username: username, password: pass, login: '', autologin: autologin }) .done(function( data ) { if(data.search('Você especificou um nome de Usuário ou Senha inválida, incorreta ou inativa') > 0) { $('.form-control-feedback').fadeIn(); } else { $('.form-control-feedback').hide(); $('.register').html('Bem-vindo ' + username + ' redirecionado...').prop('onclick', null); $('input').attr('disabled', true); setTimeout( function() { window.location.replace('/forum'); }, 3000); } }) .fail(function() { alert('Contacte o Suporte Forumeiros!'); location.pathname = '/login'; }); return false; }); }); }(jQuery)); </script> <div class="container"> <div class="pt-5 text-center text-light"> <h2>Grupo Tático Revolucionário</h2> <p class="lead">O nosso dever é primar pela eficiência!</p> </div> <div class="row"> <div class="col-sm-9 col-md-7 col-lg-5 mx-auto"> <div class="card border-0 shadow-lg my-5"> <div class="card-body"> <h5 class="card-title text-center">Entrar no fórum</h5> <form class="form-signin" method="post" action="/login"> <div class="form-label-group mb-3"> <input class="form-control" placeholder="Seu usuário" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required autofocus /> </div> <div class="form-label-group mb-3"> <input class="form-control" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" placeholder="Sua Senha" required /> <div class="form-control-feedback" style="display: none">Usuário ou senha incorretos, tente novamente!</div> </div> <div class="custom-control custom-checkbox mb-3 float-right"> <input type="checkbox" class="custom-control-input" name="autologin" id="autologin" /> <label class="custom-control-label" for="autologin">Lembrar dados</label> </div> <input value="" name="redirect" type="hidden" /> <input value="" name="query" type="hidden" /> <input class="btn btn-lg btn-primary btn-block text-uppercase rounded-0" value="Entrar" tabindex="6" name="login" type="submit" /> </form> <hr class="my-4" /> <button class="btn btn-lg btn-google btn-block text-uppercase register rounded-0 text-truncate" type="submit" onclick="location.href='/register'"><i class="fa fa-user mr-2"></i> Criar Conta</button> </div> </div> </div> </div> <footer class="text-light text-center text-small"> <p class="mb-1">️ 2019 GTS - PMGTS <a class="text-light" href="https://forumeiros.com">Forumeiros.com</a></p> <ul class="list-inline"> <li class="list-inline-item"><a class="text-light" href="/forum">Início</a></li> <li class="list-inline-item"><a class="text-light" href="/faq">FAQ</a></li> <li class="list-inline-item"><a class="text-light" href="/privacy">Política de Confidencialidade</a></li> <li class="list-inline-item"><a class="text-light" href="/profile?mode=sendpassword">Esqueceu a senha?</a></li> </ul> <a href="https://www.forumeiros.com" target="_blank">forumeiros.com</a> <footer class="text-light text-center text-small"> </footer> </div> </body> </html>

Cordialmente,
pedxz.

por srpalim 15.01.19 22:41

já resolvi, obrigado pela ajuda! pode fechar.

por RafaelS. 15.01.19 22:44

Tópico resolvido

Movido para "Questões resolvidas".

Criar página inicial de login com HTML