Menu apenas em font awesome

4 participantes

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

Tópico resolvido Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 14:53

Detalhes da questão


Endereço do fórum: http://inpanemwetrust.forumeiros.com/
Versão do fórum: phpBB3

Descrição


Boa tarde!

Tenho duas questões relacionadas a serem resolvidas:

1ª: Como posso fazer com que o meu menu seja construído apenas com Font Awesome, sem os links estarem acompanhados das palavras: inicio, perfil, grupos e etc...?

2ª: Para este mesmo menu, consegui adicionar font Awesome com o código:

Código:
.mainmenu > img {
  display: none;
}
 
a.mainmenu::before {
  content: "\f015";
  font-family: FontAwesome;
  display: inline;
  font-color: #fff;
  margin-right: 5px;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 25px;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
 
a.mainmenu[href*="memberlist"]::before {
  content: "\f0c0";
}
 
a.mainmenu[href*="profile?mode=editprofile"]::before {
  content: "\f2c2";
}

a.mainmenu[href*="privmsg?folder=inbox"]::before {
  content: "\f0e0";
}

Gostaria de saber quais variáveis devo usar para adicionar diferentes ícones para login e logout e para mostrar um ícone em Font Awesome diferente quando houver novas mensagens.

OBS: Quando falo variáveis, me refiro ao link [href*="variável"].


Obrigada desde já!
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Principal contribuidor

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por Fraise 22.04.18 17:06

Boa tarde!

Considerando a sua primeira questão, acede a Painel de Controle >> Visualização >> Página inicial >> Cabeçalho & Navegação e em "Exibir apenas as imagens no menu de navegação", selecione a opção Sim.

Quanto à sua outra questão, crie um novo tópico, tendo em vista que só é viável uma dúvida por tópico.

Atenciosamente,
Fraise.

Tópico movido de 'Questões sobre códigos' para 'Questões sobre o painel de administração'
Fraise

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Membro desde : 26/06/2015
Mensagens : 6307
Pontos : 7774

https://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 17:08

Olá, as novas mensagens se refere a isto?
Código:
.new-message:before {
    color: red;
}
Isso vai deixar a cor em vermelho da nova mensagem..

Teste para ver o mesmo.

Ah, quando se refere a variáveis está especificando atributos que estão inclusos no html da página.

Se olhar bem o seguinte código:
Código:
[href^="/register"] /* Se registrar-se */
[href^="/login"]   /* Login ou conectar */
[href^="/login?logout="]   /* Sair da conta */


De uma forma simples são links que estão no menu do seu fórum, se clicar no lado direito e copiar link vai conseguir completar o código referente ao menu.

Ex:
http://inpanemwetrust.forumeiros.com/login

/login

Ajudeiro, 
Virus.


Última edição por virus em 22.04.18 17:21, editado 3 vez(es) (Motivo da edição : edit variaveis.)
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 17:48

Muito obrigada Fraise, funcionou!

Oi Virus, a cor do icone da nova mensagem não mudou com o código que você me passou.
Também não funcionaram os links para login e logout, ficou aparecendo apenas um quadro branco no lugar do ícone.

https://prnt.sc/j8mq17
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 17:56

Pode ser a versão do fontawesome.
A atual que está implementada em seu fórum e a 4.7.0

Se me engano você pegou essa: https://fontawesome.com/icons/sign-in-alt?style=solid

Que é font awesome 5.0

Veja para 4.7.0:
https://fontawesome.com/v4.7.0/icons/

Pode atualizar para o 5.0, mas ai teria que trocar o link :X

Até mais.
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 18:07

Perfeito, muito obrigada mesmo! Agora só falta mudar a cor do ícone quando tiver uma nova mensagem.

Você pode me ajudar com isso também?
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 18:21

PrettyGirl escreveu:Perfeito, muito obrigada mesmo! Agora só falta mudar a cor do ícone quando tiver uma nova mensagem.

Você pode me ajudar com isso também?

Retire o seu fórum de manutenção para que eu possa verificar uma coisa
Sorry :9 Disponibilize uma conta não consigo criar uma conta em seu fórum.



Última edição por virus em 24.04.18 19:03, editado 1 vez(es)
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 18:30

Acabei de autorizar a inscrição de novos membros.
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 18:34

\o/ Siga esses passos para liberar a inscrição:
Painel de Controle Seta Usuários & Grupos Seta Usuários Seta Opções dos usuários
Autorizar as novas inscrições : Sim

Quando liberar me avisa  Feliz
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 18:37

já está autorizado!
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 19:01

@PrettyGirl o seu fórum ainda não consigo me registrar poderia criar uma conta teste para mim?

Agradeço se criar. E ainda está bloqueado a inscrição provável que não tenha salvado ;o ou tenha outra opção atrapalhando.
Painel de Controle Seta Geral Seta Fórum Seta Configuração
Fórum de férias : Não.
E Salve.

Ajudeiro,
Virus.


Última edição por virus em 24.04.18 19:02, editado 1 vez(es)
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 19:19

Enviei a conta por MP!
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por virus 22.04.18 20:45

Feliz Não consegui fazer via CSS acredito que seja por causa de algumas limitações por não ser uma imagem por exemplo.

Vai em:
Painel de Controle Seta Módulos Seta HTML & JAVASCRIPT Seta Gestão dos códigos JavaScript
Criar um novo Javascript
Titulo: Qualquer
Investimento: Em todas  as páginas.

E adicione o seguinte código:
Código:
(function($){
    var newmessager = $('.'+'new-message');
    newmessager
        .closest('a.mainmenu[href="/privmsg?folder=inbox"]')
        .css("color", "red");
})(jQuery);


 
Até e edite a parte red  por uma cor em hexadecimal ex: #123456 e deixe entre as aspas assim como o red está.
Color Picker


Ajudeiro,
Virus.


Última edição por virus em 23.04.18 3:29, editado 2 vez(es) (Motivo da edição : edit')
virus

virus
Membro destaque

Masculino
Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 22.04.18 21:35

Não funcionou Triste
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por MateusAnjosV 22.04.18 22:04

Hi, troca o código do Virus por esse:
Código:
$(function(){
 $('.new-message').parents('a.mainmenu').css('color', 'red');
});

E se não funcionar, faz o que eu te pedi por mp - conta - please.
MateusAnjosV

MateusAnjosV
Membro do fórum

Masculino
Membro desde : 16/10/2015
Mensagens : 1717
Pontos : 2372

http://holder.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por PrettyGirl 23.04.18 2:22

Funcionou, muito obrigada! Muito feliz
PrettyGirl

PrettyGirl
Nível 5

Feminino
Membro desde : 06/02/2017
Mensagens : 49
Pontos : 77

http://wonderlandresources.forumeiros.com/

Ir para o topo Ir para baixo

Principal contribuidor

Tópico resolvido Re: Menu apenas em font awesome

Mensagem por Fraise 23.04.18 2:31

Tópico resolvido


Movido para "Questões resolvidas".
Fraise

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Membro desde : 26/06/2015
Mensagens : 6307
Pontos : 7774

https://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

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