JScript

Programação & Desenvolvimento


Você não está conectado. Conecte-se ou registre-se

Tópicos Recentes v1.07 - mod_recent_topics

4 participantes

Ir para baixo  Mensagem [Página 1 de 1]

JScript

JScript
Administradores
Administradores



Tópicos Recentes v1.07 - mod_recent_topics
Widget [Tópicos Recentes] semelhante ao do IPB

Créditos: JScript
Nota: Versão release, fase de implementação.
- Editando Templates
Aceda em:

Painel de Controle
Visualização -> Templates -> Portal


Selecione o template mod_recent_topics e substitua o conteúdo dele
pelo código abaixo:
Código:

<!-- JScript - 2013-07-08 - http://jscript.forumeiros.com -->
<!-- BEGIN scrolling_row -->
<div class="module main">
 <div class="main-head"><div class="h3">Tópicos Recentes</div></div>
    <div id="mod_recent_topics" class="main-content _sbcollapsable" style="margin: 0px; overflow: visible;">
        <ul class="ipsList_withminiphoto" style="margin: 0px !important;">
            <!-- BEGIN recent_topic_row -->
            <li class="clearfix">
                <!-- BEGIN switch_poster -->
                <a href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}" class="ipsUserPhotoLink left">
                    <img src="" alt="Foto" class="ipsUserPhoto ipsUserPhoto_mini"
                       style="width: 30px; height: 30px; border: 1px solid rgb(213, 213, 213); background: none repeat scroll 0% 0% rgb(255, 255, 255);
                            box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); padding: 1px;">
                </a>
                <!-- END switch_poster -->
                <div class="list_content" style="margin-left: 40px; word-wrap: break-word;">
                    <a onmouseover="document.getElementById('comments_scroll_container').stop();"
                       onmouseout="document.getElementById('comments_scroll_container').start();" class="ipsType_small" style="font-size: 12px;"
                       href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE} - criado em {scrolling_row.recent_topic_row.S_POSTTIME}">{scrolling_row.recent_topic_row.L_TOPIC_TITLE}
                    </a>
                    <p class="desc ipsType_smaller" style="color: rgb(119, 119, 119);">
                        <!-- BEGIN switch_poster -->
                        <a onmouseover="document.getElementById('comments_scroll_container').stop();"
                           onmouseout="document.getElementById('comments_scroll_container').start();"
                           href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}" style="font-size: 11px !important;">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}
                        </a>
                        <!-- END switch_poster -->

                        <!-- BEGIN switch_poster_guest -->
                        {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}
                        <!-- END switch_poster_guest -->

                        &nbsp;- {scrolling_row.recent_topic_row.S_POSTTIME}
                    </p>
                </div>
            </li>
            <!-- END recent_topic_row -->
 </ul>
</div>
</div>

<script type="text/javascript">
//<![CDATA[
$(function(){
 div_marquee('mod_recent_topics', 'comments_scroll_container', '{SCROLL_WAY}', '{SCROLL_STEP}', '{SCROLL_DELAY}', '{SCROLL_HEIGHT}');
});
//]]>
</script>
<!-- END scrolling_row -->

<!-- BEGIN classical_row -->
<div class="module main">
 <div class="main-head"><h3>Tópicos Recentes</h3></div>
 <div id="mod_recent_topics" class="main-content _sbcollapsable" style="margin: 0px; overflow: visible;">
        <ul class="ipsList_withminiphoto" style="margin: 0px !important;">
            <!-- BEGIN recent_topic_row -->
            <li class="clearfix">
                <!-- BEGIN switch_poster -->
                <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}" class="ipsUserPhotoLink left">
                    <img src="" alt="Foto" class="ipsUserPhoto ipsUserPhoto_mini"
                       style="width: 30px; height: 30px; border: 1px solid rgb(213, 213, 213); background: none repeat scroll 0% 0% rgb(255, 255, 255);
                            box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); padding: 1px;">                
                </a>
                <!-- END switch_poster -->
                <div class="list_content" style="margin-left: 40px; word-wrap: break-word;">
                    <a href="{classical_row.recent_topic_row.U_TITLE}" class="ipsType_small" style="font-size: 12px;"
                       title="{classical_row.recent_topic_row.L_TITLE} - criado em {classical_row.recent_topic_row.S_POSTTIME}">{classical_row.recent_topic_row.L_TITLE}</a>
                    <p class="desc ipsType_smaller" style="color: rgb(119, 119, 119);">
                        <!-- BEGIN switch_poster -->
                        <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}" style="font-size: 11px !important;">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->

                        <!-- BEGIN switch_poster_guest -->
                        {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
                        <!-- END switch_poster_guest -->

                        &nbsp;- {ON} {classical_row.recent_topic_row.S_POSTTIME}
                    </p>
                </div>
            </li>
            <!-- END recent_topic_row -->
 </ul>
</div>
</div>
<!-- END classical_row -->
<script type="text/javascript">
//<![CDATA[
$(function () {
    /* DOM chached for fast execution! */
    var oTarget = $('#mod_recent_topics').find('ul.ipsList_withminiphoto > li');

 oTarget.each(function () {
        oThis = $(this); /* DOM chached for fast execution! */
        var load_container = oThis.children('a');
 var UserURL = load_container.attr('href');
        var def_img = "http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png"; /* In case request profile errors! */
        var sHtml = '<img src="' + def_img + '" alt="Foto" class="ipsUserPhoto ipsUserPhoto_mini" ' +
                    '    style="width: 30px; height: 30px; border: 1px solid rgb(213, 213, 213); background: none repeat scroll 0% 0% rgb(255, 255, 255);' +
                   '        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); padding: 1px;">';
        var UserIMG = sessionStorage.getItem(UserURL); /* Gets the avatar saved in local storage (Fastest!)*/

        /* If avatar alread saved, then no request member profile! */
        if(UserIMG) {
            load_container.children('img').attr('src', UserIMG);
        } else {
            /* if not, then only request per session!!! */            
            load_container.load(UserURL + ' #profile_tabs p img', function() {
                var imgTag = load_container.children('img');
                
                if (imgTag.length == 0) {
                    load_container.append(sHtml);
                    /* Saves the default avatar in local storage */
                    sessionStorage.setItem(UserURL, def_img);
                } else {
                    imgTag.attr('class','ipsUserPhoto ipsUserPhoto_mini');
                    imgTag.css({ 'width' : '30px', 'height' : '30px', 'border' : '1px solid rgb(213, 213, 213)', 'padding' : '1px',
                       'background' : 'none repeat scroll 0% 0% rgb(255, 255, 255)', 'box-shadow' : '0px 2px 2px rgba(0, 0, 0, 0.1)' });
                    /* Saves the member avatar in local storage */
                    sessionStorage.setItem(UserURL, imgTag.attr('src'));
                }
            });
        }
 });
});
//]]>
</script>
Não esqueça de publicá-lo!


- Resultado
Tópicos Recentes v1.07 - mod_recent_topics WSzVltZ

Link para visualização: http://jscript.forumeiros.com/
Nota: Funcionará também nas versões "scrolling"!!!
Precisa do template: http://jscript.forumeiros.com/t15-perfil-ipb-v14-20b-ipboard-343




PunBB Forumeiros


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Tópicos Recentes v1.07 - mod_recent_topics



Última edição por JScript em Ter 20 Ago 2013, 4:36 pm, editado 5 vez(es)

http://autoitbrasil.com

joelson0007

joelson0007
Moderadores
Moderadores

show de bola, pena que eu não estou na lista, ainda hehehehe

JScript

JScript
Administradores
Administradores

kkk, é mesmo... Mas é que no momento do "print" já tinha passado o teu tópico!

Fico feliz que tenha gostado,

JS

http://autoitbrasil.com

Convidado

avatar
Convidado

Muito bom este tópico, já coloquei no meu fórum. Muito Obrigado.

JScript

JScript
Administradores
Administradores

Olá!

Fico feliz por isso amigo, mas me informe se usa o perfil do membro que fiz ou se trocou no código o seguinte:
load_container.load(UserURL + ' #profile_tabs p img', function() {
Pois o trecho #profile_tabs p img faz a leitura diretamente da modificação que fiz no template do perfil...

JS

http://autoitbrasil.com

Convidado

avatar
Convidado

Utilizando no meu fórum. Obrigado.

JScript

JScript
Administradores
Administradores

@Hastag

Olá, então você também utiliza o perfil IPBoard que fiz ou apenas modificou o código?

Fico bastante feliz que tenha gostado e está utilizando-o,

JS

http://autoitbrasil.com

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Muito bom, sempre trazendo conteúdos ótimos hein Js? rs

http://wagneraugusto.com.br/

DiogoR.

DiogoR.
Membro
Membro

Olá,

Também existe outra forma visto que éssa é só para quem usa o Perfil IPB.
Acessem a estes links:


Até Mais...

JScript

JScript
Administradores
Administradores

@DiogoR.

Você só esqueceu de postar também o resultado sobre o meu código: http://jscript.forumeiros.com/t763-erro-widget-ultimos-assuntos-com-avatar#4975
Apenas o investimento estava errado...

JS

http://autoitbrasil.com

DiogoR.

DiogoR.
Membro
Membro

JScript escreveu:@DiogoR.

Você só esqueceu de postar também o resultado sobre o meu código: http://jscript.forumeiros.com/t763-erro-widget-ultimos-assuntos-com-avatar#4975
Apenas o investimento estava errado...

JS

Olá,

Para que fique mais explicito irei criar um novo tutorial para que todos possam perceber e dar as suas opiniões sobre o mesmo.

Até Mais....

Conteúdo patrocinado



Ir para o topo  Mensagem [Página 1 de 1]

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