Habillage:Refreshed

Cette page contient la documentation concernant Refreshed 4. Pour la documentation de Refreshed 3 et plus ancienne, voir Special:PermanentLink/3442971.

Manuel des habillages MediaWiki - catégorie

Refreshed État de la version : stable
Description	Un habillage net et moderne, initialement conçu pour être utilisé sur Brickimedia, et maintenant adapté à tous les wikis.
Auteur(s)	Brickimédia (Adam Carter, George Barnick, MtMNC, ShermanTheMythran, Jack Phoenix, Drew1200, SirComputer, Seaside98, Samantha Nguyen, Lewis Cawte), MacFan4000
Version actuelle :	4.0.7 (2023-04-03)
MediaWiki	1.39+
Licence	Licence publique générale GNU v2.0 ou supérieur
Téléchargement	Télécharger l'habillage Git [?]: télécharger la branche master de Git parcourir le dépôt (Phabricator · GitHub) historique des validations contributeurs au dépôt (GitHub) revue de code README.md
Exemple	Brickimedia Example on Skins wiki Wikimedia Skins Lab BS01 Wiki (très personnalisé)
Accroches utilisées EchoCanAbortNewMessagesAlert PageDeleteComplete PageSaveComplete
Accroches fournies RefreshedFooter RefreshedInSidebar
Téléchargements trimestriels	37 (Ranked 15th)
Utilisé par les wikis publics	41 (Ranked 42nd)
Habillage par défaut des wikis publics	19
Traduisez l'habillage Refreshed sur translatewiki.net
Problèmes :	Tâches ouvertes · Signaler un bogue

Refreshed est un habillage net et moderne. Il a été développé par les utilisateurs de la famille de wikis Brickimédia mais il est également bien adapté à d'autres fermes wiki et des wikis autonomes. Refreshed utilise un CSS réactif pour s'adapter aux appareils mobiles, et il est entièrement compatible avec les smartphones et les tablettes modernes.

L'apparence de l'habillage est facilement et largement personnalisable en utilisant CSS et LESS.

Refreshed 4.0.5 nécessite MediaWiki 1.35+. Les versions antérieures à Refreshed 4 nécessitent MediaWiki 1.28+.

Installer

• Téléchargez et placez le(s) fichier(s) dans un répertoire appelé Refreshed dans votre dossier skins/.
• Ajoutez le code suivant à la fin de votre fichier LocalSettings.php  :

  wfLoadSkin( 'Refreshed' );
  

• Si vous mettez à jour Refreshed 4.x vers une nouvelle version de l'habillage, assurez-vous de sauvegarder d'abord votre fichier custom.less avant de faire l'opération. Une fois la mise à jour terminée, remplacez la nouvelle copie de custom.less par votre ancienne copie.
•  Fait - Naviguer vers Special:Version sur votre wiki pour vérifier l'installation correcte de l'habillage.

Configurer

Choisir la manière d'adapter Refreshed

Refreshed 4 est construit avec LESS; vous pouvez donc tirer avantage des mixins et autres fonctionnalités pour personnaliser l'habillage intensément tout en écrivant quelques règles.

Méthode 1 : modifier custom.less

C'est la méthode la plus simple pour personnaliser Refreshed en utilisant LESS.

Refreshed contient un fichier de démarrage LESS situé sur refreshed/styles/screen/custom.less.

Modifiez ce fichier pour personnaliser l'habillage.

Dans ce fichier, vous pouvez accéder aux mixins LESS spécifiques au habillage disponibles à refreshed/styles/screen/mixins-public.less.

Vous pouvez également importer des mixins à l'échelle du wiki; voir Manuel:Règles de codage/CSS pour plus d'informations.

Si vous utilisez cette méthode, n'oubliez pas de sauvegarder votre fichier custom.less avant la mise à niveau.

Méthode 2 : modifier MediaWiki:Refreshed.css

Vous pouvez personnaliser Refreshed depuis l'interface de votre wiki en éditant MediaWiki:Refreshed.css.

Cela permet aux utilisateurs de personnaliser le habillage sans passer par le backend du site.

En prime, l'historique des pages du wiki fournit un contrôle de version pour votre CSS.

Malheureusement, MediaWiki ne fournit pas de LESS modèle de contenu à partir de la version 1.34.

Par conséquent, si vous souhaitez personnaliser l'habillage via l'interface du site, vous devez utiliser du vieux CSS simple au lieu de LESS.

Méthode 3 : utiliser Extension:Theme

Vous pouvez personnaliser Actualisé jusqu'à Extension:Theme .

Inscrivez-vous et configurez un thème pour Refreshed comme vous le feriez pour n’importe quel autre habillage.

Cette méthode vous permet de fournir plusieurs versions personnalisées de Refreshed parmi lesquelles les utilisateurs du wiki peuvent choisir.

De plus, si vous utilisez cette méthode, vous n'avez pas besoin de sauvegarder le fichier custom.less de Refreshed à chaque fois que vous mettez à niveau le habillage.

Vous pouvez utiliser LESS, mais notez que vos fichiers LESS personnalisés se trouveront quelque part dans le répertoire de l'extension de thème tandis que le fichier mixin spécifique au habillage mixins-public.less de Refreshed sera toujours dans le répertoire du skin Refreshed.

Par conséquent, si vous souhaitez utiliser les mixins de Refreshed dans vos fichiers LESS personnalisés, vous devrez @import le fichier mixin du répertoire du habillage Refreshed (peut-être avec une longue URL relative).

Personnalisation complémentaire

Logo/mot-symbole

Contrairement à de nombreux autres habillages, Refreshed utilise un mot-symbole au lieu d'un grand logo.

Pour ajuster le mot-symbole/l'icône mobile de Refreshed, définissez $wgLogos[ 'wordmark' ] et $wgLogos[ 'icon' ] par le manuel. Lorsque les valeurs de $wgLogos ne sont pas définies, ou si vous utilisez une ancienne version de Refreshed, les messages d'interface ci-dessous sont utilisés à la place (s'ils sont définis).

• MediaWiki:Refreshed-this-wiki-wordmark - L'URL du mot-symbole affiché sur les mises en page "grand" et "moyen" du habillage. Ce mot-symbole est également affiché dans la barre latérale de la "petite" mise en page du habillage.
• MediaWiki:Refreshed-this-wiki-mobile-logo - L'URL du logo affiché sur la "petite" mise en page du habillage. Un graphique sans texte est recommandé.

Conseil aux administrateurs de wiki : Pour un affichage optimal sur l'habillage mobile de Refreshed, vous devez envisager d'utiliser des images réduites ou des images SVG afin que le logo ne s'affiche pas de manière floue sur les écrans des appareils mobiles "rétine" (PPI élevé).

Prise en charge des fermes de wikis

Refreshed a été conçu en pensant aux fermes wiki.

Par défaut, Refreshed n'affiche qu'un seul logo wiki.

L'habillage peut être configuré pour afficher également une liste déroulante avec des liens vers d'autres wikis.

Pour ajouter d'autres liens, modifiez MediaWiki:Refreshed-wiki-dropdown et ajoutez une ligne du formulaire suivant pour chaque wiki de la ferme.

* Wiki name|logo image URL|wiki URL

La liste déroulante apparaît dans l'en-tête sur les mises en page "grande" et "moyenne" du habillage.

Dans la "petite" mise en page, la liste déroulante apparaît dans la barre latérale.

Le troisième paramètre, l'URL du wiki, est par défaut la page principale du wiki mais peut être personnalisé avec MediaWiki:Refreshed-this-wiki-url.

Catégories d'en-tête et liste déroulante Explorer

La version actualisée 3.0 et supérieure comporte des "catégories d'en-tête".

Ce sont des listes déroulantes personnalisables dans l'en-tête qui contiennent des liens vers des pages wiki.

Pour modifier les catégories d'en-tête, modifiez MediaWiki:Refreshed-navigation et créez une liste similaire à celle-ci:

* Category 1
** MediaWiki:Refreshed-navigation|Entry 1
** MediaWiki:Refreshed-navigation|Entry 2
** MediaWiki:Refreshed-navigation|Entry 3
** MediaWiki:Refreshed-navigation|Entry 4
* Category 2
** MediaWiki:Refreshed-navigation|Entry 1
** MediaWiki:Refreshed-navigation|Entry 2
** MediaWiki:Refreshed-navigation|Entry 3
** MediaWiki:Refreshed-navigation|Entry 4
* Category 3
** MediaWiki:Refreshed-navigation|Entry 1
** MediaWiki:Refreshed-navigation|Entry 2
** MediaWiki:Refreshed-navigation|Entry 3
** MediaWiki:Refreshed-navigation|Entry 4

Les catégories d'en-tête apparaissent dans les dispositions "grand" et "moyen" de l'habillage.

Si la fenêtre n'est pas assez large pour contenir toutes les catégories d'en-tête, les catégories d'en-tête sont placées dans une seule liste déroulante intitulée "Explorer".

(Pour changer le nom de cette liste déroulante, modifiez MediaWiki:Refreshed-explore.)

Dans la "petite" disposition du habillage, les catégories d’en-tête apparaissent dans la barre latérale.

Pour afficher les catégories du titre dans une langue différente, allez sur MediaWiki:Refreshed-navigation/de où de est le code de la langue et créez la même liste dans la langue voulue.

Annonces

Refreshed ne contient pas de publicités par défaut, mais vous pouvez le configurer pour afficher Google Ads en plaçant le code suivant dans votre fichier LocalSettings.php.

function showRefreshedAdvert( &$footerExtra ) {
	$footerExtra = '
		<div id="advert">
			<p>' . wfMessage( 'refreshed-advert' )->escaped() . '</p>
			<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
			<!-- Refreshed ad -->
			<ins class="adsbygoogle"
				style="display:inline-block;width:728px;height:90px"
				data-ad-client="ca-pub-9543775174763951"
				data-ad-slot="7733872730"></ins>
			<script>
				(adsbygoogle = window.adsbygoogle || []).push({});
			</script>
		</div>';
	return true;
}
$wgHooks['RefreshedFooter'][] = 'showRefreshedAdvert';

Les valeurs de data-ad-client et data-ad-slot doivent correspondre aux valeurs que Google vous a fournies.

Pour pouvoir rendre vos annonces interactives sur différents appareils, ajoutez le CSS suivant à MediaWiki:Refreshed.css, ou MediaWiki:Global-refreshed.css si vous êtes dans une configuration de type ferme de wikis. Cela nécessite installation de GlobalCssJs.

(À partir de la version refreshed 4, vous pouvez également utiliser LESS pour personnaliser la façon dont les annonces s'affichent dans différentes tailles de fenêtre.)

@media (max-width: 500px) {
	.adsbygoogle {
		width: 320px;
		height: 50px;
	}
}

@media (max-width:799px) {
	.adsbygoogle {
		width: 480px;
		height: 60px;
	}
}

@media (min-width: 800px) {
	.adsbygoogle {
		width: 728px;
		height: 90px;
	}
}

Echo

Refreshed 4 prend en charge Echo de manière native.

Avatars utilisateur

Extension:SocialProfile

L'actualisation détecte automatiquement la présence de Extension:SocialProfile et charge les avatars des utilisateurs s'ils sont activés.

Avatars par défaut

Si les avatars SocialProfile ne sont pas activés, Refreshed affiche une icône générique à côté de votre nom d'utilisateur (ou par la liste déroulante "Connexion" si vous n'êtes pas connecté).

Vous pouvez personnaliser ces icônes génériques en éditant les pages suivantes.

• MediaWiki:Refreshed-icon-logged-in - L'URL d'un avatar par défaut pour les utilisateurs connectés.
• MediaWiki:Refreshed-icon-logged-out - L'URL d'un avatar par défaut pour les utilisateurs déconnectés.

Indicateurs de l'état des pages

La version refreshed 3 et supérieure prend en charge Indicateurs de statut des pages .

Par défaut, tous les indicateurs d'état de la page sont masqués sur la "petite" mise en page de l'habillage, mais vous pouvez ajouter des indicateurs individuels à la liste blanche avec le CSS suivant:

#mw-indicator-name { /* replace "name" with the indicator's "name" value */
	display: inline-block;
}

Galerie

Refreshed 4

• 
  La "grande" mise en page (largeur de fenêtre > 1000px)
• 
  La mise en page "moyenne" (720px <= largeur de la fenêtre <= 1000px)
• 
  La mise en page "petite" (largeur de fenêtre < 720px)
• 
  La barre de recherche dans la mise en page "petite"

Refreshed 3 et plus ancien

• 
  Refreshed 3 pour ordinateur de bureau
• 
  Refreshed 3 sur mobile
• 
  Refreshed 3 sur tablette
• 
  Conception refreshed avant la version 3.0 (version bureau)