[TUTORIAL] Adição de imagens no fundo do SCEditor

por Chanp 30.06.20 17:51

Adição de imagens no fundo do SCEditor

A personalização de um fórum é fundamental para que este tenha sucesso. Portanto, por meio deste tutorial, será possível personalizar a área de texto, ou editor, do seu fórum, podendo adicionar imagens como no Fórum dos Fóruns.

ADIÇÃO DE IMAGENS NO FUNDO DO SCEDITOR

TUTORIAIS, DICAS E ASTÚCIAS

Instalação do Código CSS

CSS, na verdade, significa "Cascading Style Sheets" e sua principal função é personalizar um determinado conteúdo exibido em um determinado lugar na página. Cada versão de fórum (phpbb2, phpbb3, punbb, invision, modernBB e awesomeBB) possui uma classe diferente e, nessas classes, podem ser adicionadas as "propriedades". Caso queira conhecer alguns tipos de classes, poderá consultar mais informações no seguinte link: Elaborar um código CSS.

Painel de controle Seta Branca

Visualização Seta Branca

Imagens e Cores Seta Branca

Cores

Folha de estilo CSS

[TUTORIAL] Adição de imagens no fundo do SCEditor Stylea10

[TUTORIAL] Adição de imagens no fundo do SCEditor 110111

Salvar CSS - Salva todo o CSS em arquivo TXT no seu computador. Em outras palavras, permite criar um backup do seu CSS personalizado.

[TUTORIAL] Adição de imagens no fundo do SCEditor 110210

Forçar o CSS base do fórum - Força o CSS padrão da versão do seu fórum, ignorando o CSS personalizado. Caso queira verificar o CSS base do fórum, basta clicar no link "Ver CSS base do fórum".

[TUTORIAL] Adição de imagens no fundo do SCEditor 110310

Desativar o CSS de base - Desativa o CSS de base da versão de seu fórum e permite que somente o CSS personalizado do fórum seja considerado.

[TUTORIAL] Adição de imagens no fundo do SCEditor 110410

Melhorar seu CSS - Com essa função ativa, a capacidade de carregamento da página é aumentada, facilitando a navegação nas páginas de seu fórum. Mas é importante lembrar que, para que a função funcione normalmente como prometida, você terá que adicionar o código correto na folha de estilo.

Desse modo, adicione na sua folha de estilo CSS o seguinte código:

Código:: .sceditor-container iframe, .sceditor-container textarea { background: url(IMAGEM.png) no-repeat 50% 50% transparent!important; }

Para que esse código tenha efeito, você deverá alterar a IMAGEM.png pelo link de alguma imagem em um formato suportado. É recomendada a utilização dos formatos png, jpg, jpeg ou gif. Caso você não tenha uma imagem ou esta imagem não tenha opacidade, você pode solicitá-la na Seção de Criações Gráficas.

Resultado

[TUTORIAL] Adição de imagens no fundo do SCEditor RyM81hn

Hitskin.com

[TUTORIAL] Adição de imagens no fundo do SCEditor