Série Como Fazer - Link para Retornar ao Topo da Página

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

Série Como Fazer - Link para Retornar ao Topo da Página

jsmoraes
This post was updated on .
Muitas vezes a página de uma aplicação possui muitas respostas, e por vezes estando no meio delas gostaríamos de um retorno rápido.

Atualmente temos que rolar a página até seu final ou rolar para seu início.

Resolvi criar um link após cada mensagem para que esta navegação fosse rápida e imediata.



Primeiro criei uma macro nova:
<macro name="jsm_return_to_topo">
        &laquo;
        <a href="#Top">Retornar ao Topo</a>
</macro>

Segundo alterei a macro de nome calssic_row, onde instalo o link se não for a ultima mensagem.

<override_macro name="classic_row" requires="node_list">
    <n.if.has_small_avatar>
        <then.current_node.classic_row_with_small_avatar/>
        <else.current_node.classic_row_with_big_avatar/>
    </n.if.has_small_avatar>
    <n.if.is_last_element>
        <then.current_node.mark_as_visited/>

        <else>
           <div id="topic-footer" class="weak-color" style="padding-bottom:1em">
               <n.page_node.jsm_return_to_topo/>
           </div>
        </else>


    </n.if.is_last_element>
            
</override_macro>

nota de revisão: 02/12/2013
Verifiquei posteriormente que não é necessário a intervenção abaixo.  Ao que parece já existiria esta âncora,<br/>
E em posição bem mais adequada. Portanto,  ignore-a.  


E finalmente alterei a macro topic_html, instalando a âncora para o link bem no topo da página.

<override_macro name="topic_html" requires="servlet">
    <n.topic_min_html>
        <head>

            <a name="Top" id="Top"></a>

            <n.topic_common_head/>
            <n.topic_head/>
            <n.topic_meta/>
            <n.increment_view_count/>
        </head>
        <body>      
            <n.page_node.topic_hardcoded_notices/>
            <n.newsflash/>
            <n.topic_header/>
            <n.topic_controls/>
            <n.topic_contents.view_contents.page_node.topic_rows/>
            <n.topic_footer/>
            <n.report_inappropriate_content_panel/>
        </body>
    </n.topic_min_html>
</override_macro>
Testei em todas as minhas aplicações e funcionaram perfeitamente: forum, blog, News e Album.

nota de revisão: 02/12/2013
Verifiquei que faltou a inclusão da chamada da macro em uma outra macro;  blog_post_footer

<override_macro name="blog_post_footer" requires="node">
    <div class="blog-footer">

        <n.page_node.jsm_return_to_topo/>&nbsp;

        <n.if.not.is_locked_topic>
            <then>
                <n.permalink/>
                &nbsp;
                <img src="/images/icon_message.png" align="absmiddle" height="14" width="15"/>
                <n.if.has_replies>
                    <then.comments_link/>
                    <else>
                        <a href="[n.new_post_path/]" rel="nofollow"><t>Leave a comment</t></a>
                    </else>
                </n.if.has_replies>
            </then>
        </n.if.not.is_locked_topic>
    </div>
</override_macro>
Observatório de Astronomia de Vilatur - W. Herschel
Saquarema - RJ - Brasil
http://www.astronomia.pousadavilatur.com.br