On connaît tous ce moment de solitude. Vous êtes devant une promo alléchant sur une clé Steam, ou dans un magasin d’occas’ avec une boîte de jeu en main, et le doute s’installe : « Attends, est-ce que je ne l’ai pas déjà eu gratuitement sur l’Epic Games Store il y a six mois ? » ou « Je l’ai sur GOG ou sur Steam celui-là ? ».
Avec la multiplication des launchers (Steam, Epic, Ubisoft, EA, Amazon, GOG…), nos collections de jeux sont éparpillées façon puzzle. Si vous êtes comme moi, vous utilisez sûrement Playnite sur votre PC pour tout regrouper. C’est le roi des agrégateurs. J’utilisais Collectorz pour archiver mes jeux, jusqu’à ce qu’ils changent leur formule de licence pour un abonnement… Tchao’ Bye bises à ta mère! Playnite peut te remplacer.
Mais quand vous n’êtes pas devant votre PC ? Comment savoir ce qu’il y a dans votre bibliothèque ?
Aujourd’hui, je vous montre comment exporter votre base de données Playnite vers une page web hébergée chez vous (sur votre espace perso, ou autre).
On va voir deux méthodes :
- La Méthode « Light » (CSV) : Un tableau ultra-rapide et consultable sur mobile pour vérifier vos achats. En démo ici.
- La Méthode « Showcase » (HTML) : Une galerie visuelle avec jaquettes pour se saucer. En démo ici.
Et le meilleur ? C’est du site statique : pas de base de données à gérer, juste des fichiers à déposer sur un FTP ! Un simple hébergement sans PHP, sans SQL. (genre hébergement gratuit GitHub Pages, Netlify)
1. La Méthode « Light » : L’efficacité avant tout
C’est celle que j’utilise le plus. L’objectif est d’avoir une liste consultable instantanément sur smartphone, même avec une mauvaise 3G, pour faire une recherche rapide.
L’outil : L’extension « Exporter »
Playnite ne fait pas d’export CSV propre nativement. Il faut installer l’extension « Library Exporter Advanced » (via le menu F9 > Parcourir > Divers > saisir library exporter advanced > cliquez sur installer).
Une fois installée :
- Allez dans le menu principal > Extensions > Library Exporter Advanced > Ouvrir la fenêtre de l’export.
- Choisissez les colonnes qui vous interressent en plu du titre qui lui est sélectionné par défaut. Sauvegardez le fichier sous le nom
games.csv.
La mise en page : DataTables à la rescousse
Pour afficher ce CSV brut, on ne va pas coder du PHP. On va utiliser un petit fichier HTML magique qui utilise la librairie JS DataTables. Elle transforme votre fichier CSV en un tableau interactif, triable et avec recherche instantanée. (et aussi papa.parse qui me fait penser au papa pinguoin 🐧).
Copiez le code ci-dessous, collez-le dans un fichier index.html et placez-le dans le même dossier que votre games.csv :
<!DOCTYPE <strong>html</strong>>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ma Ludothèque</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css">
<style>body{padding:20px;background:#f0f2f5}.card{padding:20px;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,0.1)}</style>
</head>
<body>
<div class="container">
<div class="card bg-white">
<div class="d-flex justify-content-between align-items-center mb-3">
<h2 class="m-0">🎮 Ma Collection</h2>
<span id="lastUpdate" class="text-muted small"></span>
</div>
<table id="gameTable" class="table table-striped w-100"></table>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.4.1/papaparse.min.js"></script>
<script>
$(document).ready(function() {
const csvFile = "games.csv";
// Récupère la date du fichier pour l'afficher
fetch(csvFile, {method:'HEAD'}).then(r=>{
if(r.headers.get('Last-Modified'))
$('#lastUpdate').text("MàJ : " + new Date(r.headers.get('Last-Modified')).toLocaleDateString());
});
// Lit le CSV et construit le tableau
Papa.parse(csvFile, {
download: true, header: true, skipEmptyLines: true,
complete: function(results) {
var cols = [];
if(results.data.length>0) for(var k in results.data[0]) cols.push({title:k, data:k});
$('#gameTable').DataTable({
data: results.data, columns: cols, responsive: true, pageLength: 25,
language: {url:'//cdn.datatables.net/plug-ins/1.13.6/i18n/fr-FR.json'}
});
}
});
});
</script>
</body>
</html>
Envoyez index.html et games.csv sur votre FTP dans le même répertoire (/www/).
Boom!
Vous avez votre moteur de recherche personnel de votre collection. Léger, accessible et recherche rapide.
2. La Méthode « Showcase » : Pour le plaisir des yeux
Si vous voulez montrer votre collection à des amis ou avoir une expérience type « Netflix », on passe à l’export graphique.
L’outil : L’extension « HTML Exporter »
Toujours dans Playnite, cherchez l’extension « HTML Exporter ».
Elle va générer un mini-site complet avec les images, les notes, les descriptions et les filtres.
⚠️ Attention au poids !
Si vous avez plus de 1000 jeux voir beaucoup plus comme un ‘amis’ à moi… Exporter les images en haute qualité va créer un dossier de plusieurs Go. Pour le web, c’est inutile.
Dans les réglages de l’extension :
- Limitez la largeur des images (Covers) à 400px.
- Baissez la qualité JPEG à 70%.
Vous obtiendrez un dossier (avec un index.html et des dossiers images) à uploader tel quel sur votre FTP, par exemple dans un sous-dossier /gallery.
Le Setup Idéal du « Routard IT »
Personnellement, j’ai combiné les deux.
J’ai créé un sous-domaine library.ougier.net :
- À la racine : La version CSV (super légère). C’est ma page par défaut.
- Un bouton en haut : « Voir la Galerie » qui renvoie vers le sous-dossier de l’export HTML complet.
Et pour les plus énervés d’entre vous (je sais qu’il y en a), sachez que tout ça s’automatise très bien. Un petit script avec WinSCP ou Rclone permet de synchroniser le dossier d’export de votre PC vers votre FTP en un double-clic.
Fini les doublons, fini les doutes. Vos données sont chez vous, bien rangées, accessibles partout et sans abonnement.
Happy Gaming !
Laisser un commentaire