Pomoc:Podświetlanie składni

Rozszerzenie jest domyślnie włączone na Fandomie.
Porównanie wikitekstu z włączonym lub wyłączonym podświetlaniem składni

Porównanie wikitekstu z włączonym lub wyłączonym podświetlaniem składni

Podświetlanie składni (ang. Syntax highlighting) to funkcja zaprojektowana z myślą o poprawie czytelności kodu na Fandomie. Jego zadaniem jest podświetlanie odpowiednim kolorem elementów kodu, co ułatwia zrozumienie jego struktury i działania.

Występuje w trzech głównych formach – podświetlania wikitekstu, podświetlania kodu CSS/JS/szablonów/Lua oraz jako znacznik używany na stronach.

Podświetlanie w edytorze

Podświetlanie wiki tekstu

Zrzut ekranu przedstawiający edycję angielskiego odpowiednika tej strony z włączonym podświetlaniem składni w wikikodzie.

Podświetlanie wikikodu

Wikitekst to główny budulec artykułów na całym Fandomie, jednak jego zrozumienie – zwłaszcza na bardziej złożonych stronach – może być trudne.

Podświetlanie składni ma na celu to uporościć, dodając kolory do fragmentów kodu.

Główne kolory tekstu:

  • niebieski (dodger blue) = podstawowe elementy wikitekstu (nagłówki sekcji, linie poziome, pogrubienia i kursywa, listy etc.), sekcje wewnątrz linków
  • zielony (japanese laurel) = tagi HTML i encje,
  • ciemnoczerwony = magiczne słowa, funkcje parsera, tagi zamykające HTML, gdy brakuje tagów otwierających
  • pomarańczowy = parametry szablonów
  • fioletowy = szablony
  • różowy = tabele
  • szary = komentarze
  • kolor linków zdefiniowany w Kreatorze motywu = linki
    • Nazwy artykułów w linkach wewnętrznych (w obrębie wiki) są dodatkowo podkreślone

Warto zauważyć, że podświetlanie składni może również pośrednio wskazywać błędy – przykładowo, niedomknięte nawiasy linków spowodują podświetlenie całego tekstu artykułu po nawiasie otwierającym.

Podświetlanie kodu

Strony zawierające kod CSS/JS, szablony infoboksów czy moduły Lua korzystają z bardziej zaawansowanego systemu podświetlania składni.

Oprócz poprawy czytelności, to podświetlanie pomaga również zauważyć błędy składniowe – np. potencjalne błędy JavaScriptu.

Preferencje użytkownika

Jeśli nie chcesz korzystać z podświetlania składni, możesz je wyłączyć z poziomu górnego paska narzędzi w edytorze. Dokładny sposób włączania/wyłączania funkcji zależy od używanego edytora kodu źródłowego.

VisualEditor – tryb źródłowy
W trybie źródłowym VisualEditora (zwanym też „edytorem wikitekstu 2017”), opcja ta znajduje się w rozwijanym menu w prawym górnym rogu:
Syntaxhighlight-ve-source
Edytor źródłowy
W edytorze źródłowym (zwanym też „wikiedytorem” lub „edytorem wikitekstu 2010”), znajduje się ona w środkowej części górnego paska:
Syntaxhighlight-wikieditor
AceEditor
W edytorze Ace (zwanym też „CodeEditorem”) znajduje się ona po lewej stronie górnego paska, pod ikoną nawiasów.
Syntaxhighlight-ace-editor

Wyłączenie podświetlania składni w ten sposób wyłączy je na czas obecnie wykonywanej edycji. Jeśli nie chcesz całkowicie pozbyć się tej funkcji, wystarczy odwiedzić zakładkę 'Edycja' w twoich preferencjach i zaznaczyć opcję "Nie podświetlaj składni wikitekstu w trybie źródłowym".

Znacznik <syntaxhighlight>

Znacznik <syntaxhighlight> umożliwia wyróżnienie składni kodu bezpośrednio w treści strony – przydatne np. na stronacg dokumentacji szablonów. Lista wspieranych języków znajduje się na MediaWiki.org. 

<syntaxhighlight lang="css">
.class {
    font-size: 110%;
}
</syntaxhighlight>
.class {
    font-size: 110%;
}

Numery linii

Znacznik <syntaxhighlight> pozwala na dodanie numerów linii za pomocą atrybutu line: 

<syntaxhighlight lang="css" line>
.class {
    font-size: 110%;
}
</syntaxhighlight>
.class {
    font-size: 110%;
}

Aby zmienić numer początkowy numerowania linii użyj atrybutu start: 

<syntaxhighlight lang="css" line start="12">
.class {
    font-size: 110%;
}
</syntaxhighlight>
.class {
    font-size: 110%;
}

Możesz też wyróżnić wybrane linie przy pomocy atrybutu highlight: 

<syntaxhighlight lang="css" line start="12" highlight="2,5">
.tomato {
    color: red;
}
.banana {
    color: yellow;
}
</syntaxhighlight>
.tomato {
    color: red;
}
.banana {
    color: yellow;
}

Kopiowanie kodu

Aktualizacja do MediaWiki 1.43 w 2025 roku dodała nowy atrybut copy, pozwalający na dodanie przycisku łatwego kopiowania kodu do schowka: 

<syntaxhighlight lang="css" copy>
.banana {
    color: yellow;
}
</syntaxhighlight>
.banana {
    color: yellow;
}

Inline

Znacznik <syntaxhighlight> pozwala na dodanie kodu wewnątrz akapitu za pomocą atrybutu inline: 

<syntaxhighlight lang="html" inline><div>Banan<span class="banana">Banan</span> jest owocem.</div></syntaxhighlight>

<div>Banan<span class="banana">Banan</span> jest owocem.</div> 

Aby zmienić kolor tekstu, użyj klasy <syntaxhighlight lang="css" inline>.banana</syntaxhighlight>.

Aby zmienić kolor tekstu, użyj klasy .banana.

Zobacz też

Dalsze wsparcie

Szukasz dalszego wsparcia lub masz pytanie? Sprawdź poniższe linki, aby dowiedzieć się więcej.