Como disponibilizar códigos de programação em WordPress sem plugins
Author: Ricardo Soares - Postado em: 06/01/2015
Relacionado as categorias: Diversos, Tecnologia | Leave a Comment
O que fazemos é uma técnica antiga, teoricamente funciona para qualquer versão do WordPress, basta alterar o arquivo style.css adicionando neste novas formatações para a TAG “PRE” e criar a TAG “code”. Vale lembrar que é interessante dar uma ulhada no arquivo para ver se existe alguma formatação pre-definida destas entidades e o impacto que esta implementação teria no blog como um todo, mas segundo o que sei as templates padrões até hoje não fazem uso destas TAGs e por conta disto dificilmente haveria problemas.
Após a alteração o código ficará parecido com o abaixo
Exemplo de código;
Se Tudo "ok"; então;
Mostrar "Ficou Ok";
Fim Se;
Claro que não tem a coloração de código mas funciona para qualquer linguagem posto que não formata o código, a técnica simplesmente formata o texto entre as TAGs “PRE/CODE” conforme indicado o que é melhor do que simplesmente colocar o código como texto simples e ainda não demanda de instalação de plugins.
Abaixo o código a ser alterado no style.css
pre, code{
font-family: Consolas, 'Liberation Mono', Courier, monospace;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 13px;
direction: ltr;
text-align: start;
color: #323232;
}
pre {
border: 1px dashed #000;
margin: 10px;
padding:10px;
background: #FFFFB3;
box-sizing: border-box;
margin: 5px 5px 5px 5px;
padding: 10px 10px 10px 10px;
word-wrap: normal;
letter-spacing: normal;
orphans: auto;
text-indent: 0px;
text-transform: none;
widows: auto;
word-spacing: 0px;
-webkit-text-stroke-width: 0px;
background-color: #E8E8E8;
}
code {
white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap;
word-wrap: break-word;
}
Comments
Leave a Reply
