Personalização do "Enviar" e "Pré-visualizar"

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

Atendido / Resolvido Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 16.03.20 19:45

Detalhes da questão


Endereço do fórum: https://empireofwars.forumotion.com/
Versão do fórum: PunBB

Descrição


Gostaria de saber como colocar os botoes assim

https://prnt.sc/rhdrwg

Ja agora estou a tirar as ideias deste forum aqui

http://invision-virus.com/
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 16.03.20 20:10

Olá @empireofwars,

Adicione na sua folha de estilo, o seguinte código:
Código:
.frm-buttons input[type="submit"] {
    background:#212121 url(http://invision-virus.com/forum/public/style_images/light/topic_button.png) repeat-x top;
    color:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    border-color:#212121
}
 .frm-buttons input[name="preview"] {
    background:#eee;
    border-color:#ddd;
    color:#464646;
    -moz-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2)
}
 .frm-buttons input[type="submit"]:not([name="preview"]):hover {
    color:#fff
}


Cordialmente,
pedxz.


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 16.03.20 20:30

Nao ficou 100% interessante mas gostei.

E possivel trocar a ordem dos botoes?
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 16.03.20 20:43

Altere para:
Código:
.frm-buttons {
  margin-left: auto;
  margin-right: auto;
  width: 23%;
  border-top: 0px!important;
}
.frm-buttons input[type="submit"] {
     background:#212121 url(http://invision-virus.com/forum/public/style_images/light/topic_button.png) repeat-x top;
     color:#fff;
     -moz-border-radius:3px;
     -webkit-border-radius:3px;
     border-radius:3px;
     -moz-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
     -webkit-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
     box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
     border-color:#21212;
    float:left;
}
 .frm-buttons input[name="preview"] {
     background:#eee;
    border-color:#ddd;
    color:#464646;
    -moz-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
  float:right;
}
 .frm-buttons input[type="submit"]:not([name="preview"]):hover {
     color:#fff
}


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 16.03.20 20:45

Ficou centrado em vez de ficar a direita
https://prnt.sc/rheqrn
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 16.03.20 20:48

Desculpe!
Código:
.frm-buttons {
  margin-left: auto;
  margin-right: auto;
  width: max-content;
  border-top: 0px!important;
  float: right;
}
.frm-buttons input[type="submit"] {
    background:#212121 url(http://invision-virus.com/forum/public/style_images/light/topic_button.png) repeat-x top;
    color:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    border-color:#21212;
}
 .frm-buttons input[name="preview"] {
    background:#eee;
    border-color:#ddd;
    color:#464646;
    -moz-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
}
 .frm-buttons input[type="submit"]:not([name="preview"]):hover {
    color:#fff
}


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 16.03.20 20:59

Nao funcionou, dessa maneira os botoes encontram-se default, como nao sofresse alteracao
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 16.03.20 21:06

Acidentalmente removi uma vírgula do código em cima, altere para:
Código:
.frm-buttons {
  margin-left: auto;
  margin-right: auto;
  width: max-content;
  border-top: 0px!important;
  float: right;
}
.frm-buttons input[type="submit"] {
    background:#212121 url(http://invision-virus.com/forum/public/style_images/light/topic_button.png) repeat-x top;
    color:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #5c5c5c, 0px 2px 3px rgba(0,0,0,0.2);
    border-color:#212121
}
 .frm-buttons input[name="preview"] {
    background:#eee;
    border-color:#ddd;
    color:#464646;
    -moz-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    box-shadow:inset 0 1px 0 0 #f1f1f1, 0px 2px 3px rgba(0,0,0,0.2);
    float:right;
}
 .frm-buttons input[type="submit"]:not([name="preview"]):hover {
    color:#fff
}


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 16.03.20 21:17

PErfeito, muito obrigado mesmo.

Por ultimo e ainda a ver com isso, e possivel alterar o nome dos botoes?

Enviar - Postar
Previsualizar - Opções
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 17.03.20 14:18

@empireofwars escreveu:(...)
Por ultimo e ainda a ver com isso, e possivel alterar o nome dos botoes?

Enviar - Postar
Previsualizar - Opções

Não é possível, lamento Triste


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

  • 0

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por Klanxi 17.03.20 17:33

Boa tarde,

@Pedxz é possivel fazer essa alteração sim, com este JS abaixo, dá para alterar tudo que for necessário.

@empireofwars Adicione este script abaixo com investimento nos tópicos:
Código:
jQuery(document).ready(function(){
      jQuery('input[name="post"]:submit').attr('value', 'Postar');
 
});
jQuery(document).ready(function(){
      jQuery('input[name="preview"]:submit').attr('value', 'Opções');
 
});

Cumprimentos,
Klanxi
Klanxi

Klanxi
Nível 5

Masculino
Inscrito dia : 30/08/2018
Mensagens : 40
Pontos Ativos : 71

https://ajuda.forumeiros.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por empireofwars 17.03.20 17:36

Resultou, obrigado
empireofwars

empireofwars
Nível 8

Masculino
Inscrito dia : 16/03/2020
Mensagens : 115
Pontos Ativos : 161

https://empireofwars.forumotion.com/

Atendido / Resolvido Re: Personalização do "Enviar" e "Pré-visualizar"

Mensagem por pedxz 17.03.20 17:41

Questão resolvida

Esta questão foi dada como resolvida pelo seu autor, e por esse motivo será marcada como resolvida e movida para o arquivo de questões resolvidas desta área.


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Inscrito dia : 13/01/2017
Mensagens : 5831
Pontos Ativos : 6937

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum