FANDOM


m (Voir aussi)
m (Voir aussi)
Ligne 147 : Ligne 147 :
 
*[[Aide:CSS]]
 
*[[Aide:CSS]]
 
*[[Aide:CSS et JS avancés]]
 
*[[Aide:CSS et JS avancés]]
 
[[de:Hilfe:Einbinden von zusätzlichem CSS und JS]]
 
[[en:Help:Including additional CSS and JS]]
 
[[es:Ayuda:Incluyendo JavaScript y CSS adicional]]
 
[[fi:Ohje:Ylimääräisen JavaScriptin ja CSS:n lisääminen]]
 
[[it:Aiuto:Includere CSS e JS aggiuntivi]]
 
[[ko:도움말:자바 스크립트 및 CSS 불러오기]]
 
[[nl:Help:Bijkomende JavaScript en CSS laden]]
 
[[pt:Ajuda:Como incluir JavaScript e CSS adicionais]]
 
[[ru:Справка:Включение дополнительных JS и CSS]]
 
[[uk:Довідка:Ввімкнення додаткових JS і CSS]]
 
[[vi:Trợ giúp:Bao gồm JavaScript và CSS bổ sung]]
 
[[zh:Help:導入更多JavaScript與CSS]]
 

Version du janvier 22, 2016 à 12:47

La méthode JavaScript globale importArticles() fournit une interface commune pour inclure des articles qui contiennent des scripts ou des styles sur un wikia.

La fonctionnalité est similaire aux méthodes importScriptPage() et importStylesheetPage() existantes. Toutefois, importArticles() peut importer des articles d'autres wikias, combiner plusieurs articles en un seul, les minifier et les restituer en une seule requête. Cela réduit la taille des fichiers et la charge Web, permettant à un wikia avec un grand nombre de fichiers supplémentaires de charger beaucoup plus vite.

Utilisation

La méthode importArticles() se base sur des définitions de module pour charger des articles. En gros, un module est un objet JavaScript avec des propriétés clés/valeurs. Les propriétés suivantes sont nécessaires pour chaque module :

  • type - cette propriété indique le type d'articles que le module contient. Les types acceptés sont :
  • articles - les articles que vous souhaitez importer. Consultez la section « Déterminer l'emplacement des articles ci-dessous pour plus d'informations sur que vous pouvez y mettre.

N'importe quel nombre de modules peut être passé à importArticles(). Toutefois, tous les articles d'un module doivent être du même type.

Bulb

Cache

Les liens générés par importArticles() (et les techniques avancées décrites ci-dessous) sont en cache pour 10 minutes maximum. Aussi, quand vous effectuez une modification vous pouvez partir du principe que, après 10 minutes, tous les utilisateurs visitant votre wikia auront la version mise à jour des fichiers JS et CSS si importArticles() est utilisé.

Déterminer l'emplacement des articles

Une syntaxe simple est utilisée pour déterminer l'emplacement des articles que vous essayez d'importer. Elle est très similaire aux, et compatible avec les, liens interwiki :

(Préfixe:<NomWiki>:)<Article>

Ci-dessus, tout ce qui est entre parenthèses est optionnel, et tout ce qui est entre chevrons indique ce que l'utilisateur doit saisir. Les deux-points sont utilisés pour séparer la chaîne en différents segments pour le parsing. Les préfixes indiquent comment vous souhaitez trouver l'article et sont généralement suivis par le nom d'un wikia, sauf dans le cas du wikia local.

Articles locaux

Les articles sur le wikia local se trouvent avec leur titre, de la même façon que quand vous créez un lien vers un article. Ils n'ont pas besoin de préfixe ou de nom de wikia bien que, par commodité, il y a un préfixe local (ou « l » en plus court). Par exemple, si vous souhaitez importer l'article MediaWiki:Common.js, la chaîne suivante fonctionne dans importArticles :

MediaWiki:Common.js

Articles externes

Les articles d'autres wikias se trouvent de la même façon que vous créez habituellement un lien vers un article externe. Toutefois, contrairement aux articles locaux, les articles externes nécessitent l'utilisation d'un préfixe et d'un nom de wikia pour déterminer de quel wikia les importer. Wikia supporte la recherche de wikias par leur URL. Les recherches par URL sont réalisées avec le préfixe url (ou « u » en plus court). Par exemple, si vous souhaitez importer l'article {{#NewWindowLink:http://dev.wikia.com/index.php?title=Highlight/code.css%7CHighlight/code.css}} de {{#NewWindowLink:http://dev.wikia.com%7CDeveloppers Wiki}}, la chaîne suivante fonctionne dans importArticles :

u:dev:Highlight/code.css

Cette syntaxe fonctionne aussi dans d'autres langues. Par exemple, si vous souhaitez importer l'article {{#NewWindowLink:http://it.onepiece.wikia.com/index.php?title=MediaWiki:Common.js%7CMediaWiki:Common.js}} de {{#NewWindowLink:http://it.onepiece.wikia.com%7COne Piece Wiki italophone}} :

u:it.onepiece:MediaWiki:Common.js

Utilisation avancée

En coulisses, la méthode importArticles() effectue trois tâches indispensables :

  1. Générer une URL correctement formatée pour être utilisée avec ResourceLoader.
  2. Vérifier les modules passés en paramètre pour s'assurer qu'ils sont correctement formatés.
  3. Signaler les erreurs éventuelles à l'utilisateur.

Néanmoins, utiliser cette méthode n'est pas forcément nécessaire pour profiter des avantages qu'offrent la combinaison et la minification d'articles en une seule requête. Si vous le souhaitez, vous pouvez générer manuellement une URL et charger les ressources par d'autres moyens, avec des déclarations @import dans le CSS ou jQuery.getScript dans le JavaScript par exemple.

Si vous pouvez inclure de nombreux paramètres dans l'URL, les paramètres suivants sont sûrement les plus utiles :

Paramètre Description
mode Indique à ResourceLoader de charger des articles. Doit être défini à « articles ».
articles La liste des articles. Si plusieurs articles sont indiqués en paramètre, ils doivent être séparés par une barre verticale (« | »).
only Le type d'articles à importer. Doit être défini soit à « scripts » soit à « styles ».
debug Ce paramètre n'est pas nécessaire par défaut mais peut être défini à « true » pour désactiver la minification des fichiers afin de faciliter la correction des bugs dans les articles importés.

Au final, vous devriez obtenir une URL qui ressemble à ceci :

/load.php?mode=articles&articles=One.css|Two.css&only=styles

Elle peut être utilisée conjointement avec @import, comme ici :

@import url("/load.php?mode=articles&articles=One.css|Two.css&only=styles");

Si le CSS se situe sur un autre Wikia ou sur des sites autres que Wikia comme Dropbox, l'url doit commencer par http:// ou https:// comme par exemple dans ce fichier de ressources :

@import url("https://dl.dropboxusercontent.com/s/0p9ay0nqibx2wr7/manga_list.css");

Cela utilisera le fichier CSS du site Web source pour importer tout ce qui se trouve sur la page CSS. Si le fichier de feuille de style est modifié en dehors de Wikia et que la syntaxe d'importation avec le fichier brut est utilisée, un changement immédiat sera appliqué. Les pages CSS qui ont été modifiées en utilisant l'importation seront en état d'attente avant que les modifications prennent effet. Elles doivent contenir le code qui personnalise l'interface de Wikia afin de prendre effet si le CSS importé provient d'une autre source Internet non hébergée sur Wikia.

L'utilisation de JavaScript provenant de sites tiers peut entraîner des risques de sécurité et ne ne doit être importé que d'un site hébergé par Wikia.


Exemples

Importer deux articles JavaScript, un du wikia local et un d'un wikia externe :

importArticles({
    type: "script",
    articles: [
        "MediaWiki:MyCustomJavaScript.js",
        "external:dev:MediaWiki:External_include.js"
    ]
});

Importer deux articles de feuille de style, un du wikia local et un d'un wikia externe :

importArticles({
    type: "style",
    articles: [
        "MediaWiki:Common.css",
        "external:starwars:MediaWiki:External_include.css"
    ]
});

Importer plusieurs modules avec un seul appel de méthode :

importArticles({
    type: "script",
    articles: [
        "MediaWiki:MyCustomJavaScript.js",
        "external:dev:MediaWiki:External_include.js"
    ]
}, {
    type: "style",
    article: "MediaWiki:Common.css"
});

Exemples de syntaxe alternative

La méthode importArticles() prend aussi en charge des syntaxes simplifiées et alternatives pour les cas d'utilisation communs. Par commodité, la méthode importArticle() est aussi définie.

Inclure un seul fichier du wikia local en utilisant une définition de module :

importArticle({
    type: "style",
    article: "MediaWiki:Common.css"
});

Voir aussi

Sauf mention contraire, le contenu de la communauté est disponible sous licence CC-BY-SA .