Adicionar CSS extra ao painel

Este filtro simplesmente adiciona CSS extra às paginas do painel WordPress. Isso pode ser útil para modificar páginas de painel WordPress e também as páginas criadas por plugins.

Um exemplo: de vez em sempre uso o plugin CodeStyling Localization, um ótimo plugin para traduções mas que para mim apresenta um problema (talvez seja muito específico para que o autor faço algo a respeito): o tamanho e a família da fonte não ajudam! Não sei quanto a maioria das pessoas, mas simplesmente não consigo lidar com fontes em tamanho de 11 pixel em resolução alta.

Até então o único jeito de remediar isso era usar zoom do navegador (para não apelar logo para a lente de aumento 😕 ) mas graças a este simples filtro, consegui adicionar um CSS para modificar as modais do Codestlying:

Você pode criar um plugin ou apenas adicionar o código a seguir no functions.php do tema atual mesmo:

```
function dkc_add_css_on_pages() {
```
```
    echo '
```

            #csp-dialog-msgid[style], #csp-dialog-msgid-plural[style] {font-size:14px!important; font-family:"Lucida Console"!important; color:#333; padding:10px;background:#D8E8F5;border:none;line-height:18px!important  }

```
 
```

            #csp-dialog-msgstr[style], #csp-dialog-msgstr-0[style], #csp-dialog-msgstr-1[style] {font-size:14px!important; font-family:"Lucida Console"!important; color:#000; background:#FAFCFE;border:none;padding:10px;line-height:18px!important }

            #csp-dialog-msgstr[style]:focus, #csp-dialog-msgstr-0[style]:focus, #csp-dialog-msgstr-1[style]:focus {font-size:14px!important;-webkit-box-shadow:  0px 1px 0px 2px #A6BFD3; box-shadow:  0px 1px 0px 2px #A6BFD3;:  0px 0px 10px 2px #A6BFD3;background:#f7f7f7}

```
 
```

            #csp-dialog-body strong {color:#85B7E0}

```
          ';
```
```
}
```

add_action('admin_head', 'dkc_add_css_on_pages');

Não é estranho que funções do tema funcionam para o painel? É por essas e outras que temas com scripts podem causar problemas de segurança…

Com o filtro e o CSS código acima, as janelas modais do Codestlying ficarão com o estilo que eu preciso para ~~não ficar cega de vez~~ é só questão de encontrar a classe e o identificador CSS dos elementos que quer mudar, de qualquer página dentro do painel.

Veja o antes e o depois:

A modal original

Como fica com o CSS novo:

A nova modal com fonte maior e mono espaçada!

Adicionar CSS extra ao painel

Sem estresse!

Um comentário sobre "Adicionar CSS extra ao painel"