[TUTORIAL] Widget "Login" personalizado
ShiftActif fórum :: Central ShiftActif :: :: Tutoriais
Página 1 de 1 • Compartilhe
[TUTORIAL] Widget "Login" personalizado
Widget Login personalizado |
Com um pequeno código em HTML, vamos criar um efeito em um widget ao qual não será mais necessário usar-mos-ei o widget pré-definido de Login, podendo personalizar quando desejado.
--> Tutoriais <--
Widget "Login" personalizado
Widget "Login" personalizado
1º - Gestão dos widgets do fórum:
Vamos criar um widget personalizado em nosso fórum e adicionar o código, como criar de forma correcta um widget, tendo em conta todas as suas opções:
(carregue na imagem para aumentar)
Nome do widget - Terá de colocar um título para o widget, de forma a poder identifica-lo na lista dos widgets pessoais do Painel de Controle. |
Utilizar um table type - Caso opte pale opção "Sim" o widget terá a moldura padrão dos restantes widgets, caso opte por "Não" o conteúdo não estará rodeado por qualquer moldura. |
Título do widget - Neste campo, terá de atribuir um título, o que será visualizado no seu fórum. Caso tenha marcado a opção "Não" na opção anterior, colocar ou não um título será indiferente. |
Fonte do widget - Aqui deverá colocar o conteúdo do widget, poderá colocar variáveis mas não poderá colocar BBcode e sim HTML. Veremos nos pontos seguintes como poderá utilizar o editor HTML. |
Salvar - Por fim, após colocar o conteúdo, terá de "Salvar" o seu widget personalizado. |
2º - Código HTML necessário para reproduzir o efeito:
Agora, você poderá copiar e colar no nosso novo widget o código abaixo, personalizando os pontos desejados:
- Código:
<form action="/login" method="post" name="form_login">
<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" /></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" />
<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://2img.net/i/fa/admin/icones/small_ico/utilisateur.png"/> Registrar-se</a><br></br>
<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
</form>
3º - Autorizações do widget:
Para deixar-mos o trabalho muito bem feito, vamos aplicar um outro efeito que o próprio widget já tem, que é as autorizações. Depois de criar e adicionar o widget a coluna de widgets do fórum, você vai editar as permissões de visualização dele, clicando no botão :
Deixe esse widget visível apenas aos Convidados, já que ele não terá utilidade nenhuma para os que já estiverem logados no fórum.
- Posso aplicar um efeito CSS?
Pode. Basta você adicionar uma DIV ou uma SPAN contendo o atributo CLASS com o valor CSS. Por exemplo:<div class="plogin">CÓDIGO DO SEU WIDGET</div> - Resultado:
© Shiftactif
Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Widget "Login" personalizado |
Tópicos semelhantes
» [TUTORIAL] Criar uma página de login personalizada
» [TUTORIAL] Mudar informações da página de Login
» [TUTORIAL] Esconder perfil personalizado 1.0
» [TUTORIAL] Esconder perfil personalizado
» [TUTORIAL] Criar um formulário personalizado.
» [TUTORIAL] Mudar informações da página de Login
» [TUTORIAL] Esconder perfil personalizado 1.0
» [TUTORIAL] Esconder perfil personalizado
» [TUTORIAL] Criar um formulário personalizado.
ShiftActif fórum :: Central ShiftActif :: :: Tutoriais
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
|
|