FANDOM


Niekompletne tłumaczenie

Ta strona lub jej fragmenty są wciąż nieprzetłumaczone. Przetłumacz ją na odpowiedni język (Polski).

Ten artykuł jest przewodnikiem po instalacji kodu na Fandomie.

Importy CSS-u na Fandomie

Na Fandomie reguła CSS @import może efektywnie importować zestaw styli do postaci:

  • zminifikowanej i zwiększającej wydajność
  • wyglądającej przejrzyściej
  • czyniącej pamięć podręczną spójną

Rozpatrz poniższe przykłady.

Przykłady użycia @import

Po lewej stronie znajduje się klasyczny przykład użycia kilku reguł @import, natomiast po prawej stronie przedstawiono w jaki sposób można je scalić do jednej linii, co wiąże się również z ich minifikacją i zwiększeniem wydajności:

Powtórzone importy — brzydkie i wolne

  1. @import url("/index.php?title=MediaWiki:LocalCSS1.css&action=raw&ctype=text/css");
  2. @import url("/index.php?title=MediaWiki:LocalCSS2.css&action=raw&ctype=text/css");
  3. @import url("https://dev.fandom.com/index.php?title=MediaWiki:InterWikiCSS.css&action=raw&ctype=text/css");
  4. /* CSS */

Jeden import — czysty i wydajny

  1. @import url("/load.php?mode=articles&only=styles&articles=MediaWiki:LocalCSS1.css|MediaWiki:LocalCSS2.css|u:dev:MediaWiki:InterWikiCSS.css");
  2. /* CSS */

Umieszczanie reguł @import

Reguły importowania muszą być umieszczanie na samym początku strony, przed jakimikolwiek innymi regułami, w innym wypadku nie będą działać. Poniżej znajduje się przykład poprawnego umieszczenia:

Błędne umieszczenie

  1. /* CSS */
  2. @import url("/load.php?mode=articles&only=styles&articles=MediaWiki:LocalCSS1.css|MediaWiki:LocalCSS2.css|u:dev:MediaWiki:InterWikiCSS.css");

Prawidłowe umieszczenie

  1. @import url("/load.php?mode=articles&only=styles&articles=MediaWiki:LocalCSS1.css|MediaWiki:LocalCSS2.css|u:dev:MediaWiki:InterWikiCSS.css");
  2. /* CSS */

Jest również możliwe importowanie arkuszy CSS za pośrednictwem JavaScriptu, przy użyciu reguły importArticles (szczegóły).

Importy JavaScriptu na Fandomie

Deklaracja importArticles została zaprojektowana w taki sposób, aby wydajnie importować pakiet skryptów:

  • w celu przyspieszenia strony.
  • uczynienia kodu czystszym.
  • połączenia wielu żądań HTTP w jeden transfer danych.
  • oraz pozwolenia na jednoczesne szybkie i efektywne ładowanie oraz wykonywanie wielu skryptów.

Jeżeli zainstalowałeś wiele różnych skryptów, twój plik JavaScript prawdopodobnie zawiera wiele niepotrzebnych reguł importowania.

Przykłady użycia importArticles

Jeśli twój plik JavaScript zawiera kilka linii kodu o tytułach importScript, importScriptPage, lub importArticles, z całą pewnością możesz je połączyć! Rozważ poniższy przykład. Po lewej stronie znajduje się przykład tego, jak aktualnie może wyglądać twój plik JavaScript, po prawej zaś, sposób w jaki możesz poprawić swój kod.

Powtórzone importy — brzydkie i wolne

  1. importScriptPage('Script1.js', 'dev');
  2. importScript('MediaWiki:Script2.js');
  3. importArticle({
  4.   type: 'script',
  5.   article: 'u:dev:Script3/code.js'
  6. });
  7. importScriptPage('Page1.js', 'wiki');
  8. importScriptPage('Page2.js', 'wiki');

Jeden import — czysty i wydajny

  1. importArticles({
  2.     type: 'script',
  3.     articles: [
  4.         'u:dev:Script1.js',
  5.         'MediaWiki:Script2.js',
  6.         'u:dev:Script3/code.js',
  7.         'u:wiki:Page1.js',
  8.         'u:wiki:Page2.js'
  9.     ]
  10. });

Uwagi na temat importowania JavaScriptu

Uwaga: W tym przykładzie zwróć szczególną uwagę umieszczenie przecinków i innych znaków interpunkcyjnych. U osób które nie są zaznajomione z programowaniem (a nawet u tych, które są), częstym błędem podczas pisania kodu jest przypadkowe usunięcie, przegapienie lub nieprawidłowe umieszczenie krytycznych symboli, jak przecinki i cudzysłowy. Może to spowodować błąd składni, który zepsuje cały kod. Podczas używania importArticles należy postępować zgodnie z przykładem podanym na tej stronie.

Innym podejściem do tematu importowania kodu jest użycie MediaWiki:ImportJS, ale istnieje wiele więcej do importArticles niż tylko to!

HTML and wikitext markup on Fandom

Location Source

How to switch to source mode and make your code look cleaner.

Source mode is designed to handle complex HTML codes on an article, allowing to reduce the amount of unwanted code that is sometimes automatically added. Source mode is the best way to edit if you are using templates, or HTML tags such as <span>, <p>, and <div>.

Here are some useful tips:

  • When you see Double Brackets Icon in the edit area of visual mode, it refers to a template, or content with code that is not supported or too complex for the visual editor to handle. In source mode you will see this content in full.
  • When you see Comment Icon in the edit area of visual mode, it refers to a comment. In source mode, you will see this content as <!-- -->.
  • MediaWiki has a special language called wikitext to make editing easier. This language is supported in visual mode and will not break as easily as HTML.
  • Some HTML tags like <u> or <s> are supported in visual mode.
  • You can also enter source mode when creating or replying to threads in a forum, or when using a message wall by clicking Comment Source Modus underneath the edit area.
  • You can edit templates in source mode only.

Zobacz więcej

Community content is available under CC-BY-SA unless otherwise noted.

Fandom may earn an affiliate commission on sales made from links on this page.

Stream the best stories.

Fandom may earn an affiliate commission on sales made from links on this page.

Get Disney+