SyntaxHighlighting in MediaWiki

First, I attempted to install the extension specifically designed for this purpose: MediaWiki Extension:SyntaxHighlight

To check if all requirements were met, I used this PHP test script provided by ChatGPT:

Test-Script PHP

The script tests the server environment for compatibility with the SyntaxHighlight extension. It checks for PHP functions, Python installation and version, the availability of the Pygments library and directory permissions for the MediaWiki installation.

Ensures PHP functions `shell_exec` and `proc_open` are enabled.
Verifies Python is installed, correctly configured, and meets the required version (3.4+).
Confirms that PHP can execute Python code.
Checks if Pygments (`pygmentize`) is installed and functional.
Ensures the MediaWiki directory has proper permissions.

<?php
echo "<h1>SyntaxHighlight Extension Debugger</h1>";
echo "<p>This script checks the server environment for compatibility with the <a href='https://www.mediawiki.org/wiki/Extension:SyntaxHighlight' target='_blank'>SyntaxHighlight extension</a>. The goal is to ensure that PHP, Python, and required functions are correctly configured to enable syntax highlighting on your MediaWiki installation.</p>";

// 1. Check if required PHP functions are enabled
$disabledFunctions = explode(',', ini_get('disable_functions'));

if (in_array('shell_exec', $disabledFunctions)) {
    echo "<p style='color:red;'>Error: 'shell_exec' is disabled in this PHP configuration. This is required for the SyntaxHighlight extension.</p>";
} else {
    echo "<p style='color:green;'>'shell_exec' is enabled.</p>";
}

if (in_array('proc_open', $disabledFunctions)) {
    echo "<p style='color:red;'>Error: 'proc_open' is disabled in this PHP configuration. This is required for the SyntaxHighlight extension.</p>";
} else {
    echo "<p style='color:green;'>'proc_open' is enabled.</p>";
}

// 2. Test Python installation and version
$output = shell_exec('python3 --version 2>&1');
if (empty($output)) {
    echo "<p style='color:red;'>Error: Python is not installed or not available in the system PATH. Please ensure Python 3.4+ is installed.</p>";
} else {
    echo "<p style='color:green;'>Python is installed and available: " . htmlspecialchars($output) . "</p>";
    $versionParts = explode(' ', $output);
    if (isset($versionParts[1]) && version_compare(trim($versionParts[1]), '3.4', '>=')) {
        echo "<p style='color:green;'>Python version is sufficient for the SyntaxHighlight extension (3.4+).</p>";
    } else {
        echo "<p style='color:red;'>Error: Python version is insufficient. Please install Python 3.4 or newer.</p>";
    }
}

// 3. Test if Python code can be executed
$pythonTest = shell_exec('python3 -c "print(\'Hello, World!\')" 2>&1');
if (empty($pythonTest)) {
    echo "<p style='color:red;'>Error: Python is unable to execute code. This may indicate a misconfiguration or missing components.</p>";
} else {
    echo "<p style='color:green;'>Python was able to execute code: $pythonTest</p>";
}

// 4. Check PATH environment variable
$path = getenv('PATH');
if ($path) {
    echo "<p style='color:green;'>PATH environment variable: " . htmlspecialchars($path) . "</p>";
} else {
    echo "<p style='color:red;'>Error: Unable to retrieve the PATH environment variable. This may cause issues with executing Python from PHP.</p>";
}

// 5. Test Pygments (pygmentize) availability
$pygmentizeOutput = shell_exec('which pygmentize');
if (empty($pygmentizeOutput)) {
    echo "<p style='color:red;'>Error: Pygments (pygmentize) is not installed or not available in the PATH. Please ensure it is installed using <code>pip3 install Pygments</code>.</p>";
} else {
    $pygmentizeOutput = shell_exec('echo "print(\'Hello World\')" | pygmentize -l python -f html 2>&1');
    echo "<p style='color:green;'>Pygments (pygmentize) is installed and produced the following output:</p>";
    echo "<code style='border:1px solid #ccc;padding:10px;background:#f9f9f9;'>" . htmlspecialchars($pygmentizeOutput) . "</code>"; // changed from pre to code for wiki markdown
}

// 6. Check MediaWiki directory permissions
$scriptDir = __DIR__;
$wikiDir = realpath($scriptDir . '/mediawiki'); // Adjust path if MediaWiki is elsewhere

if ($wikiDir && is_dir($wikiDir)) {
    echo "<p style='color:green;'>The MediaWiki directory was found at: $wikiDir.</p>";
    echo "<p>If this script is working correctly, the permissions for the MediaWiki installation should also allow the SyntaxHighlight extension to function, as they share the same domain and likely similar permissions. However, if issues persist, verify specific file and directory permissions in the MediaWiki setup.</p>";
} else {
    echo "<p style='color:red;'>Error: The MediaWiki directory was not found in the expected location ($scriptDir/../mediawiki). Please verify the path or manually check permissions.</p>";
}

// Final message
if (!in_array('shell_exec', $disabledFunctions) 
    && !in_array('proc_open', $disabledFunctions) 
    && !empty($output) 
    && version_compare(trim($versionParts[1]), '3.4', '>=') 
    && !empty($pygmentizeOutput) 
    && $wikiDir && is_dir($wikiDir)
    && !empty($pythonTest)) {
    echo "<h2 style='color:green;'>All requirements for the SyntaxHighlight extension appear to be met. If the extension is still not working, enable MediaWiki debug logs to investigate further.</h2>";
} else {
    echo "<h2 style='color:red;'>Some requirements are missing or misconfigured. Please review the errors above and verify permissions, Python installation, and PHP configuration.</h2>";
}
?>

My Results

PHP requirements are satisfied.
However, the Pygments library for Python is missing.

Since I do not have SSH access or administrative tools to install it on my web server, that was a problem.

Alternative Attempt: Prism.js

Next, I attempted to use Prism.js for syntax highlighting. However, this approach also failed.

I tried embedding Prism.js and its related CSS directly into MediaWiki, but unfortunately, that didn’t work either.

Final Solution: Custom Syntax Highlighting

The remaining viable option for me was to create custom syntax highlighting using JavaScript and CSS.

You can find the implementation in: