Novo Design do Registro.

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Novo Design do Registro.

Mensagem por Tupac em 07/08/15, 09:58 pm

Salve, Todos.
Eu queria saber como faço para fazer quando um Membro for registrar em meu Fórum, seja outro design como no da imagem abaixo


Esta imagem é de uma página HTML do meu Fórum, e queria saber como deixar assim pra registrar em
meuforum.forumeiros.com/register.
E essas caixas ficarem com novas opções de registro, exemplo..

Username
E-Mail
Senha e as minhas opções personalizadas..

Até.
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 08/08/15, 05:16 pm

UP. Cadê os Desenvolvedores e Staff's ?
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 11/08/15, 05:05 am

Olá, bom dia!

Haikaiss escreveu:UP. Cadê os Desenvolvedores e Staff's ?
Se eu fosse a si, lia a alínea 3 do grupo dos deveres do regulamento de suporte. "Respeitar o tempo voluntário dos ajudantes ou dos usuários, tendo em mente que eles lhe ajudam quando tem tempo disponível." Além disso só são permitidos UP's de 24 em 24 horas, tenha mais atenção nisso.

Quanto à sua dúvida, poderia me fornecer o link dessa tal página HTML?

Cumprimentos.
Fraise

Tópico movido de 'Questões sobre JavaScript & jQuery' para 'Questões sobre a aparência do fórum'
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 11/08/15, 03:36 pm

avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 11/08/15, 03:47 pm

Olá!

E o link do seu fórum também, se possível.

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 11/08/15, 04:04 pm

avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 11/08/15, 04:07 pm

Olá!

Adicione à sua folha de estilos:
Código:
input#username {
background: url('http://i.imgur.com/Z8YKiwD.png');
background-repeat: no-repeat;
background-position-y: -3.5px;
border: 1px solid #000;
}

input#password {
background: url('http://i.imgur.com/ofKQ1W9.png');
background-repeat: no-repeat;
background-position-y: -3.5px;
border: 1px solid #000;
}

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 11/08/15, 04:12 pm

Sem Resultado.
@EDIT
Ficou bugado.
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 11/08/15, 04:14 pm

Olá!

Aqui está certo, veja:


Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 11/08/15, 04:16 pm

Não tem como ficar igual ao da imagem ?
Rs, Rosa
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 11/08/15, 06:08 pm

Olá!

Eu acho que consigo fazer isso por via de página HTML, pode ser?

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 11/08/15, 08:08 pm

Claro.
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 17/08/15, 09:10 am

Olá!

Desculpe a demora, mas veja se lhe agrada:
Código:
<!DOCTYPE HTML>
<html>
  <head>
      <meta charset=utf-8 />
      <title>Login</title>
      <style>
        body {
        background-color:#0099FF;
        }
        #caixa-login {
        background-color:#006699;
        width:380px;
        height:260px;
        margin: 140px auto 0px;
        border-radius:10px;
        }
        #caixa-login-int {
        width:360px;
        height:240px;
        background-color:#fdfdfd;
        position:absolute;
        margin:10px;
        border-radius:5px;
        box-shadow:0px 0px 7px black;
        overflow:hidden;
        }
        #caixa-login-title {
        height:45px;
        text-align:center;
        font: bold 14px/45px sans-serif;
        border-top-left-radius:5px!important;
        border-top-right-radius:5px!important;
        border-bottom: 1px solid #bfc3c5;
        color:#555555!important;
        text-shadow:1px 0px 1px white;
        background: #f2f9fe; /* Old browsers */
        /* IE9 SVG, needs conditional override of 'filter' to 'none' */
        background: -moz-radial-gradient(center, ellipse cover,  #f2f9fe 0%, #d6f0fd 100%); /* FF3.6+ */
        background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#f2f9fe), color-stop(100%,#d6f0fd)); /* Chrome,Safari4+ */
        background: -webkit-radial-gradient(center, ellipse cover,  #f2f9fe 0%,#d6f0fd 100%); /* Chrome10+,Safari5.1+ */
        background: -o-radial-gradient(center, ellipse cover,  #f2f9fe 0%,#d6f0fd 100%); /* Opera 12+ */
        background: -ms-radial-gradient(center, ellipse cover,  #f2f9fe 0%,#d6f0fd 100%); /* IE10+ */
        background: radial-gradient(ellipse at center,  #f2f9fe 0%,#d6f0fd 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f9fe', endColorstr='#d6f0fd',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
        }
        .input-div {
        margin:20px;
        padding:5px;
        background-color:#f2f5f7;
        border-radius:3px;
        }
        .input-div input {
        width:310px;
        height:35px;
        padding-left:5px;
        font:normal 13px sans-serif;
        border-radius:3px;
        border:1px solid #bfc4c6;
        outline:none!important;
        }
        .input-div:hover{
        background-color:#e0f1fc;
        }
        .input-div:hover input {
        border-color:#7dc6dd;
        }
        #input-senha {
        margin-top:10px!important;
        }
        #botoes {
        width:310px;
        margin-left:25px;
        }
        #botao {
        float:right;
        background-color:#527899;
        padding:5px 15px;
        font: bold 12px sans-serif;
        border-radius:7px;
        text-shadow:0px 1px 0px white;
        border:1px solid #9eb9c3;
        color:#fff;
        }
        #botao:hover {
        cursor:pointer;
        }
        #conexao-auto {
        font: normal 12px sans-serif;
        }
      </style>
  </head>
  <body>
      <div id="caixa-login">
      <div id="caixa-login-int">
        <div id="caixa-login-title">Login</div>
        <div class="input-div" id="input-user">
            <input type="text" value="Nome de usuário">
        </div>
        <div class="input-div" id="input-senha">
            <input type="text" value="Senha">
        </div>
        <div id="botoes">
            <div id="botao">Login</div>
            <div id="conexao-auto"><input type="checkbox"/>Conexão automática</div>
        </div>
      </div>
  </body>
</html>

Se gostar, irei adaptar para que logue em seu fórum. Piscada

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 19/08/15, 01:55 pm

Está Ótimo.
Mais, teria como dar uma melhorada no visu ?rsrs tá muito, " CHEGUUEEYYYY ".
TKS Rosa Rindo
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 19/08/15, 02:26 pm

Olá!

Veja assim:
Código:
<!DOCTYPE HTML>
<html>
  <head>
      <meta charset=utf-8 />
      <title>Login</title>
      <style>
        body {
        background: url('https://image.freepik.com/free-photo/grunge-background--page_19-122655.jpg');
        }
        #caixa-login {
        background-color:#FFFFCC;
        width:380px;
        height:260px;
        margin: 140px auto 0px;
        border-radius:10px;
        }
        #caixa-login-int {
        width:360px;
        height:240px;
        background-color:#fdfdfd;
        position:absolute;
        margin:10px;
        border-radius:5px;
        box-shadow:0px 0px 7px black;
        overflow:hidden;
        }
        #caixa-login-title {
        height:45px;
        text-align:center;
        font: bold 14px/45px sans-serif;
        border-top-left-radius:5px!important;
        border-top-right-radius:5px!important;
        border-bottom: 1px solid #bfc3c5;
        color:#555555!important;
        text-shadow:1px 0px 1px white;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffcc+100,febf01+100,ffffcc+100 */
background: #ffffcc; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmNjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZlYmYwMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmY2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left,  #ffffcc 100%, #febf01 100%, #ffffcc 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(100%,#ffffcc), color-stop(100%,#febf01), color-stop(100%,#ffffcc)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #ffffcc 100%,#febf01 100%,#ffffcc 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #ffffcc 100%,#febf01 100%,#ffffcc 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #ffffcc 100%,#febf01 100%,#ffffcc 100%); /* IE10+ */
background: linear-gradient(to right,  #ffffcc 100%,#febf01 100%,#ffffcc 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffcc', endColorstr='#ffffcc',GradientType=1 ); /* IE6-8 */


        }
        .input-div {
        margin:20px;
        padding:5px;
        background-color:#f2f5f7;
        border-radius:3px;
        }
        .input-div input {
        width:310px;
        height:35px;
        padding-left:5px;
        font:normal 13px sans-serif;
        border-radius:3px;
        border:1px solid #bfc4c6;
        outline:none!important;
        }
        .input-div:hover{
        background-color:#e0f1fc;
        }
        .input-div:hover input {
        border-color:#7dc6dd;
        }
        #input-senha {
        margin-top:10px!important;
        }
        #botoes {
        width:310px;
        margin-left:25px;
        }
        #botao {
        float:right;
        background-color:#527899;
        padding:5px 15px;
        font: bold 12px sans-serif;
        border-radius:7px;
        text-shadow:0px 1px 0px white;
        border:1px solid #9eb9c3;
        color:#fff;
        }
        #botao:hover {
        cursor:pointer;
        }
        #conexao-auto {
        font: normal 12px sans-serif;
        }
      </style>
  </head>
  <body>
      <div id="caixa-login">
      <div id="caixa-login-int">
        <div id="caixa-login-title">Login</div>
        <div class="input-div" id="input-user">
            <input type="text" value="Nome de usuário">
        </div>
        <div class="input-div" id="input-senha">
            <input type="text" value="Senha">
        </div>
        <div id="botoes">
            <div id="botao">Login</div>
            <div id="conexao-auto"><input type="checkbox"/>Conexão automática</div>
        </div>
      </div>
  </body>
</html>

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Tupac em 19/08/15, 07:22 pm

Obrigado Rosa
avatar

Tupac
Usuário avançado

Masculino
Inscrito dia : 21/12/2014
Mensagens : 341
Pontos Ativos : 505

Ver perfil do usuário http://forum-larp.forumeiros.com https://www.facebook.com/LSAGTAV/ https://twitter.com/@WKhalifaBWR

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 19/08/15, 07:24 pm

Olá!

Irei configurar a página HTML para que logue em seu fórum, assim que estiver concluída, o informarei neste mesmo tópico.

Cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Novo Design do Registro.

Mensagem por Fraise em 26/08/15, 09:04 am

Segundo o regulamento do setor de suporte, tópicos com mais de 7 dias devem ser arquivados por abandono do próprio autor. Você poderá obter mais informações lendo este tópico:
Regras para a postagem de dúvidas

Caso ainda tenha dúvidas, aconselhamos que crie um novo tópico no setor de suporte, tendo em vista que este não deve ficar na seção por mais de 7 dias.
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum