Botão de voltar ao topo

3 participantes

Ver o tópico anterior Ver o tópico seguinte 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 : 2819

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 : 2819

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

Ir para o topo Ir para baixo

Principal Contribuidor
  • 0

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 : 18896
Pontos : 22793

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

Ir para o topo Ir para baixo

  • 0

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 : 2819

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

Ir para o topo Ir para baixo

Admineiro
  • 0

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 : 7806
Pontos : 9049

Ir para o topo Ir para baixo

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