Botão de voltar ao topo

3 participantes

Ir para baixo

Tópico resolvido Botão de voltar ao topo

Mensagem por Thoth 25.05.21 2:46

Detalhes da questão


Endereço do fórum: https://testefdd.forumeiros.com/
Versão do fórum: ModernBB

Descrição


Boa noite, prezados.

Gostaria de solicitar vossa ajuda para implementar uma função no fórum, seria um botão de voltar ao topo, similar ao que temos aqui no FDF, conforme imagem abaixo.

Botão de voltar ao topo Sem_tz13

Seria um botão que ficasse fixo no rodapé, e não flutuante.
Desde já agradeço!

Atenciosamente,
Thoth
Thoth
Hiper Membro

Membro desde : 01/11/2011
Mensagens : 2197
Pontos : 2820

https://testefdd.forumeiros.com/ https://www.youtube.com/@LMCanalTech/featured

Ir para o topo Ir para baixo

Tópico resolvido Re: Botão de voltar ao topo

Mensagem por Thoth 26.05.21 2:56

Boa noite, prezados.

Venho dar up no tópico após o período de 24 horas.
Desde já agradeço!

Atenciosamente,
Thoth
Thoth
Hiper Membro

Membro desde : 01/11/2011
Mensagens : 2197
Pontos : 2820

https://testefdd.forumeiros.com/ https://www.youtube.com/@LMCanalTech/featured

Ir para o topo Ir para baixo

Tópico resolvido Re: Botão de voltar ao topo

Mensagem por Shek 26.05.21 13:44

Olá Thoth, quanto tempo hein?! Muito feliz É bom vê-lo por aqui novamente.

Pois bem, presumo que deseja incluir tal botão no rodapé, certo? Eu não me recordo bem se a versão ModernBB contém ícones do Google Icons ou do FontAwesome, porém, você poderá incluir o FontAwesome para inserir o ícone para o topo, lendo este tópico: https://ajuda.forumeiros.com/t103208-tutorial-instalacao-do-font-awesome-no-forum
Existe uma versão atualizada dos ícones. Leia este artigo: https://shiftactive.blogspot.com/2020/01/font-awesome-5-gratis.html

Após instalar o ícone, acesse seu template overall_footer_end e procure pelo link de seu Painel administrativo na variavel {ADMIN_LINK}. Insira abaixo da </div> o código a seguir:
Código:
            <div class="footerBackToTop">
              <a href="#top" class="buttonTop"><i class="fas fa-chevron-up"></i></a> 
            </div>
Caso não queira ícones, use a imagem do ícone, substituindo o <i class="fas fa-chevron-up"></i> por:
Código:
<img src="https://i.servimg.com/u/f21/18/45/41/65/top10.png" />

Deixei incluso a class footerBackToTop para usar CSS para personalizar caso deseje. Piscada Exemplo:
Código:
.footerBackToTop .buttonTop:hover {
    background-color: #444;
}
.footerBackToTop .buttonTop {
    border-radius: 50px;
    background-color: black;
    padding: 10px;
}

.footerBackToTop {
    margin: 0px 0px 20px 0px;
}
Atenciosamente,
Shek King
Shek
Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 19006
Pontos : 22969

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Botão de voltar ao topo

Mensagem por Thoth 26.05.21 14:45

@Shek

Muito obrigado, meu amigo!
Por aqui resolvido.

Para Shek:

Mais uma vez agradeço a ajuda.

Atenciosamente,
Thoth
Thoth
Hiper Membro

Membro desde : 01/11/2011
Mensagens : 2197
Pontos : 2820

https://testefdd.forumeiros.com/ https://www.youtube.com/@LMCanalTech/featured

Ir para o topo Ir para baixo

Tópico resolvido Re: Botão de voltar ao topo

Mensagem por tikky 26.05.21 16:02

Tópico resolvido


Movido para "Questões resolvidas".
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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