Prism

Escribe código con formato dentro de worpress

https://prismjs.com

Es un archivo.js y un archivo.css que tiene estilos para un motón de lenguajes pincha en dowload para la descarga de los archivos:

Seleccionamos la versión minificada (1), el tema (2) y nos desplazamos para abajo para seleccionar los lenguajes (3):

En mi caso elijo batch y C y volvemos a bajar:

Pinchamos en download js y download css:

Vamos a nuestro servidor y tu-web/wp-content/themes/nombre_tema_activo

Y dentro pegamos los 2 archivos de antes:

Ahora descargamos el archivo function.php y le añadimos esto al final:

// Function to add prism.css and prism.js to the site

function add_prism() {

    // Register prism.css file

    wp_register_style(

        'prismCSS', // handle name for the style

        get_stylesheet_directory_uri() . '/prism.css' // location of the prism.css file

    );

    // Register prism.js file

    wp_register_script(

        'prismJS', // handle name for the script

        get_stylesheet_directory_uri() . '/prism.js' // location of the prism.js file

    );

    // Enqueue the registered style and script files

    wp_enqueue_style('prismCSS');

    wp_enqueue_script('prismJS');

}

add_action('wp_enqueue_scripts', 'add_prism');

Una imagen de cómo se vería el functions.php:

Lo subimos al servidor y actualizamos:

Ahora en donde queramos poner el código, pinchamos en el + del editor de wiorpress y elegimos html personalizado

Y escribimos:

<pre><code class="language-bash">escribe lo que quieras</code></pre>

<pre><code class="language-js">escribe lo que quieras</code></pre>

<pre><code class="language-html">escribe lo que quieras</code></pre>

Otros lenguajes:

https://prismjs.com/download#themes=prism-okaidia&languages=markup+css+clike+javascript

Ejemplos:

<pre><code class=»language-bash»>

#!/bin/bash
function help() {
   

 Usage: 
   ./make.sh {all/dsk/rom/cass/clean}

   Generates a dsk or rom or cass file from the BAS files in source folder and Images 
 in assets folder.

   On Clean parameter, it cleans up all previously produced object files.

EndOfHelpMessage
   
   exit 1
}

</code></pre>

<pre><code class=»language-js»>

var express = require('express'); //Import the module
var app = express(); //Now we have an express app
const path=require('path');

//settings
app.set('port',  process.env.PORT || 3000);

//start de server
var server = app.listen(app.get('port'), () => {
	console.log('Server on port',app.get('port'));
});

//Static files
app.use(express.static(path.join(__dirname, 'public'))); //host everything in the public directory

</code></pre>

<pre><code class=»language-c»>

#include "src/game.c"

void main(void) 
{
  game_init();
}
 

</code></pre>