Mostrar fragmentos de código en Blogger (2023)
Si quieres mostrar fragmentos de código en tu blog como este:
var edad = 17;
if (edad >= 18) {
print('Es mayor de edad');
} else {
print('Es menor de edad');
}
Puedes utilizar la librería highlight.js. Para agregarla en tu blog debes editar el HTML de tu blog:
Una vez dentro del editor de HTML debes agregar las siguientes lineas de código:
<link href='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/styles/default.min.css' rel='stylesheet'/>
<script src='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/highlight.min.js'/>
<script>
hljs.configure({cssSelector: "code"});
hljs.highlightAll();
</script>
El código anterior debe ser agregado justo antes de la etiqueta <head> como se puede ver en la siguiente imagen:
Ahora el código que quieres mostrar lo debes escribir dentro de las etiquetas <pre><code></code></pre> para bloques de código o dentro de <code></code> para código entre líneas.
Por ejemplo para mostrar el fragmento de código al inicio de este artículo se debe escribir de la siguiente forma:
<pre><code>
var edad = 17;
if (edad >= 18) {
print('Es mayor de edad');
} else {
print('Es menor de edad');
}
</code></pre>
Aqui una imagen de cómo se vería en el editor:
Muchas gracias por leer este articulo, espero les sea de ayuda para mejorar las entradas en sus blogs.
