Detalhes da questão

Endereço do fórum: http://forumchavesechapolin.foruns.com.pt/
Versão do fórum: PhpBB3

Descrição

Olá Novamente hoje estou com uma dúvida sobre um código que eu vi em um fórum, porém era para outra versão do phpbb, e queria deixar essa área assim

Onde eu vi:http://www.bestskins.net/t4247-tutorialrazao-por-editar-ipb

Bom dia!

Na sua versão, basta ir para ACP >> Visualização >> Templates >> Geral >> viewtopic_body e depois, localizar a variável:

Código:

{postrow.displayed.EDITED_MESSAGE}

Ao encontrá-la, basta atribuir uma div com um atributo class ou id, como preferir.

Em seguida, acesse ACP >> Visualização >> Imagens e cores >> Folha de estilos CSS >> e lá adicione o CSS de acordo com as definições que fez no seu HTML do template. Se for uma DIV, use o jogo da velha, e se for uma class, use o ponto + seletor.

Assista este vídeo para compreender, caso tenha dúvidas:

Atenciosamente,
SHek

Shek escreveu:Bom dia!

Na sua versão, basta ir para ACP >> Visualização >> Templates >> Geral >> viewtopic_body e depois, localizar a variável:

Código:

{postrow.displayed.EDITED_MESSAGE}

Ao encontrá-la, basta atribuir uma div com um atributo class ou id, como preferir.

Em seguida, acesse ACP >> Visualização >> Imagens e cores >> Folha de estilos CSS >> e lá adicione o CSS de acordo com as definições que fez no seu HTML do template. Se for uma DIV, use o jogo da velha, e se for uma class, use o ponto + seletor.

Assista este vídeo para compreender, caso tenha dúvidas:

https://www.youtube.com/watch?v=XCLl7RR1bgg

Atenciosamente,
SHek

Eu não entendi não sei quase nada sobre códigos, não teria só a opção de adicionar css?

Olá!

Mas... O que de fato não entendeu? É só dizer o que não entendeu que vamos explicar.

Shek escreveu:Olá!

Mas... O que de fato não entendeu? É só dizer o que não entendeu que vamos explicar.

A parte que eu não entendi foi:

Na sua versão, basta ir para ACP >> Visualização >> Templates >> Geral >> viewtopic_body e depois, localizar a variável:

Código:

{postrow.displayed.EDITED_MESSAGE}

Ao encontrá-la, basta atribuir uma div com um atributo class ou id, como preferir.

Em seguida, acesse ACP >> Visualização >> Imagens e cores >> Folha de estilos CSS >> e lá adicione o CSS de acordo com as definições que fez no seu HTML do template. Se for uma DIV, use o jogo da velha, e se for uma class, use o ponto + seletor.

Certo, então a dúvida é sobre O que é uma DIV? Ou... Sobre o que é um atributo class ou id? Por favor, especifique sua dúvida.

Irei explicar:

O que é um SELETOR:

O que é um atributo class ou id:

Aqui tem uma explicação: http://www.htmlprogressivo.net/2014/01/DIV-tag-Criando-divisoes-logicas-estruturais-em-site-HTML-CSS.html

No seu caso, é só incluir uma <div class=''></div> na variável que citei, e personalizar com CSS.

A questão é: Você sabe como fazer isso? Podemos ensiná-lo a fazer, se quiser aprender, é claro.

Shek escreveu:Certo, então a dúvida é sobre O que é uma DIV? Ou... Sobre o que é um atributo class ou id? Por favor, especifique sua dúvida.

Irei explicar:

O que é um SELETOR:

O que é um atributo class ou id:

Aqui tem uma explicação: http://www.htmlprogressivo.net/2014/01/DIV-tag-Criando-divisoes-logicas-estruturais-em-site-HTML-CSS.html

No seu caso, é só incluir uma <div class=''></div> na variável que citei, e personalizar com CSS.

A questão é: Você sabe como fazer isso? Podemos ensiná-lo a fazer, se quiser aprender, é claro.

Sim eu quero entender como se faz e utiliza esses códigos.

Olá, veja esse vídeo:


O que você tem que fazer é :
1° Passo: Acessar:

Painel de Controle -> Visualização -> Templates -> Geral

2° Passo: Procurar o template viewtopic_body e depois abri-lo para modificar.
3° Passo: Localizar a variável: {postrow.displayed.EDITED_MESSAGE}
4° Passo: Deletar essa variável e adicionar no lugar dela isto:

Código:

<div class="editarpersonalizado">{postrow.displayed.EDITED_MESSAGE}</div>

5° Passo: Ver o vídeo que te mandei
6° Passo: Acessar sua folha de estilo css
7° Passo: Atribuir propriedades a essa classe:

.editarpersonalizado

Como assim?? Simples... vou deixar um exemplo:
EX: Adicione esse código em sua folha de estilo css:

Código:

.editarpersonalizado {
border:1px solid blue;
color: write;
background: #000;
font-size:15px;
}

Entendeu? só conseguimos fazer essa "personalizada" por causa da div que coloquei...

Até mais.

Deu quase certo agora é só arrumar o tamanho

usei esse código

Código:

.editarpersonalizado {
background: #ffebc8 url(http://imgur.com/PIQA4LA.png) no-repeat 6px 10px;
border: 1px solid #ecc272;
color: #ac6328;
font-family: "Trebuchet MS",tahoma,helvetica,arial,sans-serif;
font-size: 11px;
font-style: normal;
font-variant: normal;
font-weight: 700;
line-height: 18px;
margin-top: 15px;
padding: 8px 8px 8px 28px;
text-shadow: #fffaf1 0 1px 0;
}
.entry-content p:not(:empty) br {display: none;}

EDIT Agora está dando em todos os posts era só para os editados
@while

Para o caso de todas aparecem personalizada... Você pode resolver isso com este script:

Código:

  $(function()) {
    if(isEmpty($('.editarpersonalizado'))) {
        $('.editarpersonalizado ').hide();
     }
  }

Adicione para os tópicos, nas suas Páginas .JS.

Sobre aumentar o tamanho, basta você incluir o height como propriedade, e definir com o valor que deseja. Ou seja: height: 12px; por exemplo. Quanto maior o valor, maior será o objeto.

Até mais

Shek escreveu:Para o caso de todas aparecem personalizada... Você pode resolver isso com este script:

Código:

  $(function()) {
    if(isEmpty($('.editarpersonalizado'))) {
        $('.editarpersonalizado ').hide();
     }
  }

Adicione para os tópicos, nas suas Páginas .JS.

Sobre aumentar o tamanho, basta você incluir o height como propriedade, e definir com o valor que deseja. Ou seja: height: 12px; por exemplo. Quanto maior o valor, maior será o objeto.

Até mais

O Código não funcionou :/
E o Tamanho ficou bom mais as letras não seguiram

#Ajuda

Ajuda @While