ShiftActif fórum

[TUTORIAL] Widget de últimos membros registrados Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo [TUTORIAL] Widget de últimos membros registrados 405374159 ao fórum de suporte e de informações técnicas ShiftActif. Aqui, solucionamos suas dúvidas sobre os tutoriais exclusivos fornecidos pela nosso subfórum de tutoriais além de suporte opcional ao Forumeiros.com, Blogger e temas grátis do Criarumblog.com! Você encontrará FAQs, astúcias em códigos e efeitos especiais em CSS, Javascript e outros para complementar seu fórum ou Blog!
Venha participar desta grande comunidade!!! [TUTORIAL] Widget de últimos membros registrados 1660898911
ShiftActif fórum

[TUTORIAL] Widget de últimos membros registrados Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo [TUTORIAL] Widget de últimos membros registrados 405374159 ao fórum de suporte e de informações técnicas ShiftActif. Aqui, solucionamos suas dúvidas sobre os tutoriais exclusivos fornecidos pela nosso subfórum de tutoriais além de suporte opcional ao Forumeiros.com, Blogger e temas grátis do Criarumblog.com! Você encontrará FAQs, astúcias em códigos e efeitos especiais em CSS, Javascript e outros para complementar seu fórum ou Blog!
Venha participar desta grande comunidade!!! [TUTORIAL] Widget de últimos membros registrados 1660898911

[TUTORIAL] Widget de últimos membros registrados

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

  • 0

[TUTORIAL] Widget de últimos membros registrados Empty [TUTORIAL] Widget de últimos membros registrados

Mensagem por Shek Sex 27 Jul - 10:01


[TUTORIAL] Widget de últimos membros registrados Grpes_et_ut

Últimos membros registrados


O sonho de todos os administradores de hoje é ter um conteúdo inovador, e queremos propor isso. Neste tutorial vamos reproduzir com código JS, os últimos membros registrados no fórum em widget.


--> Tutoriais <--
Widget de últimos membros registrados



- CSS para cada versão:
Antes de tudo, vamos adicionar o CSS para manter personalizado quando o efeito estiver concluido. Em Painel de controle > Visualização > Imagens e Cores > Cores > Folha de estilo CSS >. Lembre-se de escolher o CSS para sua versão:

PhpBB2
Código:
.ultmembro .row1 div{
  display: inline !important;
}

PhpBB3
Código:
.ultmembro .box-content a img{
  display: none !important;
}

.ultmembro .box-content div{
  display: inline !important;
}

PunBB
Código:
.ultmembro .main-content div{
  display: inline !important;
}
.ultmembro .main-content a img{
  display: none !important;
}

Invision
Código:
.ultmembro .box-content div{
  display: inline !important;
}

Selecione o CSS do seu fórum e Salve!


- Javascript para cada versão:
As páginas javascript ativas em seu fórum possibilita inserir scripts e jquery para personalizar seu fórum, contudo é importante saber que qualquer script encontrado na internet acabam por não surgir efeito nos fóruns.

Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts >>
[TUTORIAL] Widget de últimos membros registrados Painel13
[TUTORIAL] Widget de últimos membros registrados 110111Arrow Título Correspondente ao nome da página JavaScript/jQuery que será criada.
[TUTORIAL] Widget de últimos membros registrados 110210Arrow Localização- São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. Pode ser na galeria, nos fóruns ou sub-fóruns. Vamos ver algumas opções:
No índice : O código será aplicado ao índice do fórum.
No portal : O código será aplicado ao Portal do fórum.
Nos sub-fóruns (Fóruns) : O código será aplicado nos Fóruns e Sub-fóruns.
Sobre os temas : O código será aplicado aos tópicos do fórum.
Na galeria : O código será aplicado na sua Galeria de imagens.
Em todas as páginas : O código será aplicado em todas as páginas do fórum.
[TUTORIAL] Widget de últimos membros registrados 110310Arrow Código JavaScript Campo destinado para receber os códigos JavaScript e jQuery.
[TUTORIAL] Widget de últimos membros registrados 110410Arrow Habilitar o gerenciamento dos códigos JavaScript Ao selecionar a opção sim, estará ativando a função páginas Javascript no seu fórum. Se selecionar não, as páginas serão desabilitadas no fórum.

Selecione em Investimento, a opção "Em todas as páginas".
PhpBB2
Código:
jQuery(document).ready(function(){jQuery('#fa_ticker_block:first').after('');

$('.membro1').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(0)');
$('.membro2').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(1)');
$('.membro3').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(2)');
$('.membro4').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(3)');
$('.membro5').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(4)');
$('.membro6').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(5)');
$('.membro7').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(6)');
$('.membro8').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(7)');
$('.membro9').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(8)');
$('.membro10').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .forumline td:has("span.gen a.gen") a.gen:eq(9)');
$('.ultmembro').css('width','200px');
});

PhpBB3
Código:
jQuery(document).ready(function(){jQuery('#fa_ticker_block:first').after('');
    $('.membro1').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(0)');
    $('.membro2').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(1)');
    $('.membro3').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(2)');
    $('.membro4').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(3)');
    $('.membro5').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(4)');
    $('.membro6').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(5)');
    $('.membro7').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(6)');
    $('.membro8').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(7)');
    $('.membro9').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(8)');
    $('.membro10').load('/memberlist?mode=joined&order=DESC&submit=Ok&username #memberlist .avatar-mini a:eq(9)');
    $('.ultmembri').css('width','200px');
    });

PunBB
Código:
jQuery(document).ready(function(){jQuery('#fa_ticker_block:first').after('');
$('.membro1').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(0)');
$('.membro2').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(1)');
$('.membro3').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(2)');
$('.membro4').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(3)');
$('.membro5').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(4)');
$('.membro6').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(5)');
$('.membro7').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(6)');
$('.membro8').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(7)');
$('.membro9').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(8)');
$('.membro10').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .frm-form .avatar-mini a:eq(9)');
$('.ultmembro').css('width','200px');
});

Invision
Código:
jQuery(document).ready(function(){jQuery('#fa_ticker_block:first').after('');
$('.membro1').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(0) .popmenubutton a .membername');
$('.membro2').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(1) .popmenubutton a .membername');
$('.membro3').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(2) .popmenubutton a .membername');
$('.membro4').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(3) .popmenubutton a .membername');
$('.membro5').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(4) .popmenubutton a .membername');
$('.membro6').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(5) .popmenubutton a .membername');
$('.membro7').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(6) .popmenubutton a .membername');
$('.membro8').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(7) .popmenubutton a .membername');
$('.membro9').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(8) .popmenubutton a .membername');
$('.membro10').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(9) .popmenubutton a .membername');
$('.ultmembro').css('width','200px');
});

[TUTORIAL] Widget de últimos membros registrados Error Informações
O código Javascript da versão Invision está em testes BETA pela equipe. Você poderá ver o nome repetido em alguns casos!


- Código HTML no widget:
Para cada versão, use os seguintes códigos:

PhpBB2
Código:
<tr>
<td class="row1"><div class="numar 1">1.</div> <div class="membro1"></div> <br /><div class="numar 2">2.</div> <div class="membro2"></div> <br /><div class="numar 3">3.</div> <div class="membro3"></div> <br /><div class="numar 4">4.</div> <div class="membro4"></div> <br /><div class="numar 5">5.</div> <div class="membro5"></div> <br /><div class="numar 6">6.</div> <div class="membro6"></div> <br /><div class="numar 7">7.</div> <div class="membro7"></div> <br /><div class="numar 8">8.</div> <div class="membro8"></div> <br /><div class="numar 9">9.</div> <div class="membro9"></div> <br /><div class="numar 10">10.</div> <div class="membro10"></div>
</tr></td>

PhpBB3
Código:
<div class=" ultmembro"><div class="box-content"><div class="numar 1">1.</div> <div class="membro1"></div> <br /><div class="numar 2">2.</div> <div class="membro2"></div> <br /><div class="numar 3">3.</div> <div class="membro3"></div> <br /><div class="numar 4">4.</div> <div class="membro4"></div> <br /><div class="numar 5">5.</div> <div class="membro5"></div> <br /><div class="numar 6">6.</div> <div class="membro6"></div> <br /><div class="numar 7">7.</div> <div class="membro7"></div> <br /><div class="numar 8">8.</div> <div class="membro8"></div> <br /><div class="numar 9">9.</div> <div class="membro9"></div> <br /><div class="numar 10">10.</div> <div class="membro10"></div>

PunBB
Código:
<div class="ultmembro"><div class="main-content"><div class="numar 1">1.</div> <div class="membro1"></div> <br /><div class="numar 2">2.</div> <div class="membro2"></div> <br /><div class="numar 3">3.</div> <div class="membro3"></div> <br /><div class="numar 4">4.</div> <div class="membro4"></div> <br /><div class="numar 5">5.</div> <div class="membro5"></div> <br /><div class="numar 6">6.</div> <div class="membro6"></div> <br /><div class="numar 7">7.</div> <div class="membro7"></div> <br /><div class="numar 8">8.</div> <div class="membro8"></div> <br /><div class="numar 9">9.</div> <div class="membro9"></div> <br /><div class="numar 10">10.</div> <div class="membro10"></div>

Invision
Código:
<div class="ultmembro">
<div class="box-content">
<div class="numar 1">1.</div> <div class="membro1"></div> <br />
<div class="numar 2">2.</div> <div class="membro2"></div> <br />
<div class="numar 3">3.</div> <div class="membro3"></div> <br />
<div class="numar 4">4.</div> <div class="membro4"></div> <br />
<div class="numar 5">5.</div> <div class="membro5"></div> <br />
<div class="numar 6">6.</div> <div class="membro6"></div> <br />
<div class="numar 7">7.</div> <div class="membro7"></div> <br />
<div class="numar 8">8.</div> <div class="membro8"></div> <br />
<div class="numar 9">9.</div> <div class="membro9"></div> <br />
<div class="numar 10">10.</div> <div class="membro10"></div>
</div>
</div>


  • Posso listar a quantidade desejada?
    Sim, mas você deve deletar um trecho do Javascript e do HTML. Por exemplo, quero que mostre somente nove membros. Então, você vai ao Javascript e deletará:
    Código:
    $('.membro10').load('/memberlist?mode=joined&order=DESC&submit=Ok&username .member-list .member:eq(9) .popmenubutton a .membername');
    E no HTML no widget, deletará:
    Código:
    <div class="numar 10">10.</div> <div class="membro10"></div>

  • Resultado:
    [TUTORIAL] Widget de últimos membros registrados Result47





© ShiftActif


[TUTORIAL] Widget de últimos membros registrados Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Widget de últimos membros registrados
Shek

Shek
Administrador

Masculino
Idade : 30
PointActif's : 7411
ReputActifs : 97
Mensagens : 2777
Inscrição : 13/04/2011

Localização : Vilhena - RO
100%

https://shiftactive.blogspot.com/

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos