Name: Tremplin Numérique
Price range: $$$

Beaucoup préfèrent utiliser Jellyfin plutôt que Plex car il est gratuit et open source, prend en charge des fonctionnalités telles que le transcodage matériel et fonctionne sur presque tout. Bien que le thème Jellyfin par défaut soit fonctionnel, il est un peu ennuyeux à regarder au quotidien.

Heureusement, il existe un bon nombre de thèmes que vous pouvez importer, et vous pouvez même tenter de créer le vôtre.

Sommaire

Comment fonctionnent les thèmes Jellyfin

Vous pouvez créer un thème pour Jellyfin en utilisant CSS, ce qui permet aux sites Web d'appliquer différents styles. Étant donné que Jellyfin présente vos médias à la consommation à l'aide d'une interface Web, les thèmes ne sont en fait que des relookages de l'apparence par défaut.

L'avantage de cette approche est que les thèmes sont légers, peuvent être facilement modifiés à la volée et la plupart doivent être reflétés dans les clients que vous utilisez pour accéder à votre serveur. Nous avons testé de nombreux thèmes et les nouveaux looks étaient immédiatement visibles dans l'application officielle Jellyfin pour iPhone (même sur l'écran de connexion) et l'application LG webOS TV.

Les thèmes sont des projets communautaires et, en tant que tels, ils s'appuient sur les tests de la communauté pour découvrir et résoudre les problèmes. Même si vous n'allez pas « casser » votre installation Jellyfin en installant un thème, vous risquez de rencontrer quelques bugs lors de vos voyages.

La présentation de base de Jellyfin étant assez rigide, les thèmes ne modifient pas massivement l'ambiance du logiciel. Les images d’arrière-plan et la pochette habituelles apparaissent aux mêmes endroits, mais la palette de couleurs et l’apparence globales peuvent différer. Vous remarquerez peut-être d'autres changements subtils comme des coins plus arrondis et un logo Jellyfin légèrement différent en haut de l'écran.

Comment installer manuellement les thèmes Jellyfin

Il existe deux manières d'installer et de gérer les thèmes Jellyfin : manuellement ou à l'aide d'un plugin. Les deux sont simples, en particulier compte tenu de la manière dont les auteurs de thèmes rendent leurs thèmes facilement accessibles avec quelques lignes de code simples. C'est une bonne idée d'apprendre à le faire manuellement, même si vous souhaitez continuer et installer le plugin (ne vous inquiétez pas, vous pouvez utiliser les deux méthodes côte à côte).

Pour installer manuellement un thème Jellyfin, affichez votre interface Web Jellyfin et cliquez sur votre icône d'utilisateur dans le coin supérieur droit de l'écran. Sous « Administration », cliquez sur « Tableau de bord » pour afficher le menu d'administration. Vous verrez maintenant un menu de barre latérale, sous la section « Serveur », cliquez sur « Branding ».

Si vous ne voyez pas « Branding », vous utilisez peut-être une version obsolète de Jellyfin. Essayez de rechercher la section « Affichage » ou pour de meilleurs résultats, découvrez comment mettre à jour Jellyfin vers la dernière version.

Vous verrez quelques champs apparaître, dont un qui dit « Code CSS personnalisé », qui est ce que nous utiliserons. C'est ici que vous collez le code d'importation du fichier CSS de thème que vous souhaitez utiliser, ainsi que tous les fichiers CSS supplémentaires (comme des thèmes enfants ou des correctifs pour les utilisateurs ultra-larges).

Nous aborderons la recherche de thèmes dans une seconde, mais dans ce champ, vous collerez du code qui ressemble à :

@import url('https://code-url-here.example/theme.css');

Il n'est pas rare de coller une autre ligne de code après cela, mais vous devez toujours importer le fichier principal « theme.css » en premier.

Pour supprimer un thème, supprimez simplement tout CSS que vous avez ajouté à ce champ. Toutes les modifications que vous apportez ici ne seront pas reflétées dans le panneau d'administration, mais elles le seront dans l'interface principale de Jellyfin. Vous devrez actualiser la page ou supprimer l'application pour voir les modifications.

Comment installer les thèmes Jellyfin à l'aide d'un plugin

Alternativement, vous pouvez installer et gérer les thèmes Jellyfin à l'aide du plugin Jellyfin Skin Manager. Pour ce faire, ouvrez l'interface Web de Jellyfin, cliquez sur votre nom dans le coin supérieur droit de l'écran, puis sous « Administration », cliquez sur « Tableau de bord ».

Dans la barre latérale, cliquez sur « Plugins », puis cliquez sur « Gérer les référentiels » suivi de « Nouveau référentiel ». Entrez un nom (j'ai choisi « jellyfin-skin-manager » et collez l'URL suivante dans le champ « URL du référentiel » :

https://raw.githubusercontent.com/danieladov/JellyfinPluginManifest/master/manifest.json

Cliquez maintenant à nouveau sur « Plugins » dans la barre latérale et actualisez la page. Recherchez « skin » et filtrez par « Tous », et vous devriez voir le « Skin Manager » apparaître.

Cliquez dessus, puis cliquez sur « Installer » et lisez la clause de non-responsabilité. Une fois que vous êtes satisfait d'avoir compris les risques liés à l'utilisation de plugins tiers, cliquez à nouveau sur « Installer » pour continuer.

Maintenant, redémarrez Jellyfin. Vous pouvez le faire facilement si vous utilisez un ordinateur de bureau exécutant Windows, macOS ou Linux en cliquant sur l'icône de la barre d'état système et en choisissant « Redémarrer ». Si vous exécutez Jellyfin dans un conteneur, vous devrez redémarrer le conteneur.

Une fois Jellyfin redémarré, retournez à la page « Plugins » dans le tableau de bord d'administration et cliquez sur Skin Manager. Cliquez sur le nouveau bouton « Paramètres » et utilisez le menu déroulant pour définir un thème. Vous pouvez également cliquer sur « Personnalisé » et définir votre propre thème.

Essentiellement, tout ce que ce plugin fait est de gérer pour vous la case « Code CSS personnalisé » sur la page « Branding », en appliquant des correctifs et des thèmes enfants si nécessaire en fonction des cases sur lesquelles vous cliquez. Vous remarquerez que vous ne disposez que d'un nombre limité de thèmes parmi lesquels choisir ; le projet aurait probablement besoin d'une mise à jour (cela fait environ un an depuis que des modifications ont été apportées au moment de la rédaction).

Quelques thèmes pour démarrer

Le projet Awesome Jellyfin propose une liste organisée de thèmes que vous pouvez parcourir. Il y a ici un certain chevauchement entre le plugin Skin Manager, mais un bon nombre de thèmes uniques parmi lesquels choisir. Chacun a sa propre page GitHub, et beaucoup proposent des variations subtiles ou des correctifs à utiliser sur des appareils spécifiques.

En plus de cela, cela vaut la peine de visiter le tableau d'assistance Thèmes et styles du Forum Jellyfin. De nombreux auteurs utilisent des mégathreads pour leurs versions et demandent des commentaires et des suggestions à la communauté. C'est un endroit idéal à visiter si vous rencontrez des problèmes après avoir installé quelque chose. Vous trouverez de nombreux projets intéressants publiés ici, comme ZestyTheme qui combine plusieurs des projets thématiques les plus réussis de la communauté.

Allez encore plus loin avec vos propres thèmes et votre propre image de marque

Envie de créer vos propres thèmes ? Le projet Jellyfin propose une documentation détaillée sur la manière de modifier le CSS dans cet objectif. Vous pouvez également télécharger et séparer des thèmes créés par d’autres pour voir ce qui les motive. Vous devriez probablement comprendre comment travailler avec du CSS moderne avant de commencer !

Vous pouvez également vous rendre sur la page « Marque » dans le tableau de bord d'administration et ajouter votre propre image de démarrage et des clauses de non-responsabilité pour rendre votre serveur Jellyfin un peu plus unique.