[TUTORIAL] Limitar o número de imagens na assinatura

Resultado após a aplicação dos passos abaixo

(carregue na imagem para aumentar)

Instalação do código JavaScript

Painel de Controle Módulos HTML e Javascript Gestão dos códigos Javascript Criar um novo javascript

Habilitar o gerenciamento dos códigos Javascript - Permite ativar os scripts personalizados criados pelo administrador no fórum. Este recurso não tem qualquer impacto nos scripts nativos do fórum.

Tìtulo - Cria um título para identificar o script a ser modificado mais tarde na lista de scripts do fórum.

Investimento - Define o local em específico que este script será executado. Você pode investir o script para vários locais no fórum (Todas as páginas) ou pode definir para certos locais disponíveis na tela de investimento. Neste caso, em todas as páginas.

Código Javascript - Espaço destinado a receber o script que será ativado pelo administrador. Antes de aplicar o script ao fórum, é importante revisá-lo para ter certeza de seu funcionamento.

Código:

// ZONA EDITABLE
const NUM_MAX_IMAGENES = 3;
const TEXTO_ERROR = 'Você ultrapassou o limite delimitado de imagens nas assimaturas. Limite:';
// FIN ZONA EDITABLE
 
if (encontrarParametroGET('mode') === 'editprofile' && encontrarParametroGET('page_profil') === 'signature') {
  document.addEventListener('DOMContentLoaded', function() {
    document.getElementsByName('submit')[0].addEventListener('click', function(e) {
      var textoFirma = $('#text_editor_textarea').sceditor('instance').val();
      if (numeroImagenes(textoFirma) > NUM_MAX_IMAGENES) {
        e.preventDefault();
        if (!document.getElementById('error_max_images')) {
          var divError = document.createElement('div');
          divError.id = 'error_max_images';
          divError.innerHTML = TEXTO_ERROR + ' <strong>' + NUM_MAX_IMAGENES + '</strong>';
          var post = document.getElementById('message-box') ? document.getElementById('message-box') : document.getElementsByClassName('sceditor-container')[0];
          post.prepend(divError);
        }
      }
    });
  });
}
 
function encontrarParametroGET(nombreParametro) {
    var resultado = null,
        tmp = [];
    var items = location.search.substr(1).split('&');
    for (var index = 0; index < items.length; index++) {
        tmp = items[index].split('=');
        if (tmp[0] === nombreParametro) resultado = decodeURIComponent(tmp[1]);
    }
    return resultado;
}
 
function numeroImagenes(texto) {
  return texto.split('[img]').length-1;
}

Instalação do código CSS

Painel de controle Visualização Imagens e Cores Cores Folha de estilo CSS

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

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

Desativar o CSS base - Desativa o CSS base da versão de seu fórum, e permite que somente o CSS personalizado do fórum opere em todo o fórum.

Melhorar 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.

Código:

#error_max_images {
  border: 1px solid #630b0b;
  background-color: #ff0000b3;
  padding: 4px;
  border-radius: 3px;
  color: white;
  width: 79%;
}