Help:Extension:CodeMirror/sv

Tillägg CodeMirror erbjuder syntaxmarkering i wikitext för wikitextredigerare. Detta kan göra redigering lättare genom att använda färger och skuggningar för att visuellt separera vanlig text från länkar, mallar och annan wikitext-formatering.

Användning

Aktivering

CodeMirror kan aktiveras genom att sätta Enable syntax highlighting i dina inställningar. I WikiEditor (även känd som 2010-redigeraren, aktiverad med preferensen Aktivera redigeringsverktygsraden), kan den också växlas på och av med hjälp av höjdpunktsknappen " Syntax" i verktygsfältet. I 2017-redigeraren kan du aktivera CodeMirror genom att klicka på "Page options"-knappen i verktygsfältet, sedan välja "Syntax highlighting".

Tangentbordskortkommandon

Vissa tangentbordsgenvägar gäller inte för 2017-redigeraren, som har sina egna tangentbordskortkommandon.

You can review keyboard shortcuts by opening the help dialog with Ctrl+⇧ Shift+/.

List of keyboard shortcuts
Genväg Genväg (macOS) Beskrivning
Navigering
Alt+ Ctrl+ Flytta markören ett ord till vänster.
Alt+ Ctrl+ Flytta markören ett ord till höger.
Alt+ Alt+ Flytta de valda raderna upp en rad.
Alt+ Alt+ Flytta de valda raderna neråt.
⇧ Shift+Alt+ ⇧ Shift+Alt+ Duplicera de markerade raderna och behåll markeringen på den övre kopian.
⇧ Shift+Alt+ ⇧ Shift+Alt+ Duplicera de markerade raderna och behåll markeringen på den nedre kopian.
Escape Escape Reducera flera markeringar till huvudområdet, eller till en markör om det bara finns en markering.
Textstilar
Ctrl+b ⌘ Command+b Gör den markerade texten fet.
Ctrl+i ⌘ Command+i Gör den markerade texten kursiv.
Ctrl+k ⌘ Command+k Infoga länk
Ctrl+⇧ Shift+6 ⌘ Command+⇧ Shift+6 Gör den markerade texten till dator kod.
Ctrl+⇧ Shift+5 ⌘ Command+⇧ Shift+5 Gör den markerade texten med genomstruken.
Ctrl+, ⌘ Command+, Gör den markerade texten till subscript
Ctrl+. ⌘ Command+. Gör den markerade texten till superscript.
Ctrl+u ⌘ Command+u Stylera den markerade texten som understruken
Avsnittsformatering
Ctrl+[ ⌘ Command+[ Ta bort indrag från de markerade raderna.
Ctrl+] ⌘ Command+] Lägg till indrag för de markerade raderna.
Ctrl+7 Ctrl+7 Gör markerad text förformaterad.
Ctrl+8 ⌘ Command+8 Formatera som blockcitat.
Ctrl+1-6 ⌘ Command+1-6 Lägg till en rubrik på den angivna nivån (1 till 6).
Söker
Ctrl+f ⌘ Command+f Öppna sökpanelen.
Ctrl+g ⌘ Command+g Hitta nästa förekomst i söksträngen.
⇧ Shift+Ctrl+g ⇧ Shift+⌘ Command+g Hitta föregående förekomst av söksträngen.
Ctrl+d ⌘ Command+d Välj nästa förekomst av det aktuella urvalet eller ordet, vilket skapar flera urval.
Ctrl+Alt+g ⌘ Command+Alt+g Öppna gå-till-rad-panelen.
Infoga
Ctrl+↵ Enter ⌘ Command+↵ Enter Infoga en tom rad under den aktuella raden.
Ctrl+k ⌘ Command+k Infoga en referens.
Ctrl+/ ⌘ Command+/ Infoga en kommentar eller gör den markerade texten till en kommentar.
Kodvikning
Ctrl+⇧ Shift+[ ⌘ Command+Alt+[ Vikning den aktuellt markerade koden.
Ctrl+⇧ Shift+] ⌘ Command+Alt+] Öppna den markerade koden.
Ctrl+Alt+[ Ctrl+Alt+[ Fäll ihop all kod.
Ctrl+Alt+] Ctrl+Alt+] Expandera all kod.
Övrigt
Ctrl+⇧ Shift+/ Ctrl+⇧ Shift+x Visa hjälpdialogen för tangentbordsgenvägar.
Ctrl+⇧ Shift+, ⌘ Command+⇧ Shift+, Öppna CodeMirror-inställningar-panelen.
Ctrl+⇧ Shift+x ⌘ Command+⇧ Shift+x Växla visning av redigeraren mellan höger-till-vänster och vänster-till-höger.
Markörsmodifierare
Ctrl+click ⌘ Command+click Lägg till en ytterligare markör eller markering till det klickade området.
Ctrl+click on page titles ⌘ Command+click on page titles Öppna länkar i wikitextkoden.
Alt+click and drag Alt+click and drag Gör en rektangulär markering.

Funktioner

CodeMirror-inställningar

MediaWiki-version:
1.44

De flesta funktioner som dokumenteras här kan inaktiveras eller aktiveras av enskilda användare. För att öppna inställningspanelen, tryck på Ctrl+⇧ Shift+, (eller ⌘ Command+⇧ Shift+, på MacOS). Om du använder WikiEditor, kan du också komma åt dina CodeMirror-inställningar genom att klicka på -knappen i Avancerad-avsnittet i verktygsfältet. Dina CodeMirror-inställningar kommer att kommas ihåg över olika enheter och sessioner.

Matchning av hakparenteser

Matchning av hakparenteser

När markören ligger direkt bredvid en hakparentes markerar funktionen den matchande hakparentesen.

Kodvikning

MediaWiki-version:
1.43
Kod vikning på w:Barack Obama.

Kodvikning låter dig fälla mallparametrar, tilläggstaggar och andra kodblock. Detta kan göra det betydligt lättare att hantera stora, komplexa mallar.

Användning

När en markör eller markering täcker någon del av den stödda syntaxen visas ett verktygstipsikon $ikon strax ovanför texten. Klicka på den för att vika ihop koden, lämnar endast mall- eller taggnamnet.

Ihop fälld kod kommer att ha mall eller tag namn följt av ellipsikon $ikon. Om du klickar på den, kommer koden att återgå till sitt ursprungliga tillstånd.

Tangentbordskortkommandon
Genväg Genväg (macOS) Beskrivning
Ctrl+⇧ Shift+[ ⌘ Command+Alt+[ Fäll ihop den aktuellt markerade koden.
Ctrl+⇧ Shift+] ⌘ Command+Alt+] Expandera den markerade koden.
Ctrl+Alt+[ Ctrl+Alt+[ Fäll ihop all kod.
Ctrl+Alt+] Ctrl+Alt+] Expandera all kod.

Anpassning

Om du vill behålla tangentbordsgenvägen för vikning av mallar men dölja den visuella komponenten kan du göra det genom att lägga till följande i din personliga CSS:[1]

.cm-tooltip-fold {
	display: none;
}

Autokomplettering

MediaWiki-version:
1.44
Exempel som visar autokomplettering av parserfunktioner.

Denna funktion erbjuder autokomplettering av magiska ord, parser extension tags, och URL-protokoll. Om du anger {{# bör du se en lista över alla parserfunktioner som börjar med #. Liknande, visar skrivning av dubbla understreck (__) en lista med magiska ord som skrivs på dubbla understreck. Du kan fortsätta skriva för att begränsa sökningen. Använd piltangenterna för att välja önskad text och tryck på ↵ Enter- eller Tab ↹-tangenten för att göra ditt val. Autokomplettering fungerar inte för mallar eller för magiska ord eller parserfunktioner som inte börjar med # eller __.

Öppna länkar i wikitext

MediaWiki-version:
1.44

Du kan snabbt öppna länkar som angetts i wikitexten. Detta genom att hålla nere Ctrl-tangenten (eller ⌘ Command på MacOS) och klicka på en sidtitel i länksyntaxen, till exempel [[Main Page]]. Klicka på detta fall skulle öppna Huvudsida i en ny flik.

This feature also works for template names and file names.

Line numbering

Note how the line numbering knew to account for the lines contained in the collapsed templates.

When enabled, line numbers are automatically displayed in all editors. On the Wikimedia wikis, it is only enabled for specific namespaces of specific wikis.[2]

Line numbers will take into account any hidden lines, such as those through code folding.

Highlight the active line

MediaWiki-version:
1.44

In your CodeMirror preferences, you can select "Highlight the active line" to enable this feature, which can make it easier to tell which line of text the cursor is on, especially on large pages.

Line wrapping

MediaWiki-version:
1.44

Line wrapping is the default behaviour in most editors. Sometimes you may want to disable this, especially when writing complex wikitext or other code. You can disable line wrapping in your CodeMirror preferences.

Multiple cursors and selections

You can add additional cursors or selections by holding the Ctrl key (or ⌘ Command on MacOS) and clicking on the desired content or cursor placement. After doing so, any changes you make will be applied to all the selections at the same time.

You can also press Ctrl+d (or ⌘ Command+d on MacOS) to select the next occurrence of the current selection or word, which create multiple selections. This can be useful as a quick find and replace feature.

Highlight special characters

By default, CodeMirror will highlight non-printable control characters and other characters such as non-breaking spaces. Control characters appear as a red dot, while non-breaking spaces are displayed as a faint gray dot. Hovering over these characters will show a tooltip stating which character it is.

If desired, you can disable this feature in your CodeMirror preferences.

Colorblind mode

For users who have difficulty distinguishing between colors, CodeMirror offers a colorblind-friendly mode. This feature can be activated on wikis with CodeMirror enabled with "Enable colorblind-friendly scheme for syntax highlighting when editing wikitext" in your preferences.

With the colorblind-friendly scheme active, the colors of the following page elements change:

Headings, symbols, signatures, section names, magic words#E4A400
Templates#9C3A00
HTML tags, references, mathematical expressions#56B4E9
Variables#009E73

In addition, background highlights and colors are removed from all text and objects. Bolding and underlining behavior remains unaffected.

Bidi isolation

This feature is currently a work-in-progress. See phab:T358804 for more information.

On right-to-left pages, CodeMirror can isolate HTML and other tags as bidirectional text, which can improve readability. The standard algorithm for the layout of text places neutral punctuation characters between right-to-left text on the wrong side. With bidi isolation, we can correct this so it reads more legibly:

CodeMirror without bidi isolation
CodeMirror with bidi isolation

Color and style customization

This is a partial list of the CodeMirror CSS classes. The complete list of default CodeMirror styling definitions is on Gerrit.

The colors and styles used in CodeMirror can be overridden by defining your own styles for the classes in the table below in your personal CSS.[1] Please be aware that changing some things like the line height or font size may not work in the 2017 wikitext editor.

CSS class(es) Element CodeMirror styling
.cm-mw-skipformatting leading space foo bar
.cm-mw-list asterisk or number sign * foo bar, # foo bar
.cm-mw-signature,
.cm-mw-hr
signature, horizontal rule , ----
.cm-mw-indenting colons ::: foo bar
.cm-mw-html-entity HTML entities &
.cm-mw-comment HTML comment <!-- comment -->
.cm-mw-apostrophes-bold,
.cm-mw-apostrophes-italic
bold and italic '''bold''' ''italic''
Headings
.cm-mw-section-1 level 1 heading[3] = Heading =
.cm-mw-section-2 level 2 heading[3] == Heading ==
.cm-mw-section-3 level 3 heading === Heading ===
.cm-mw-section-4 level 4 heading ==== Heading ====
.cm-mw-section-5 level 5 heading ===== Heading =====
.cm-mw-section-6 level 6 heading ====== Heading ======
.cm-mw-section-header equal signs ==
Templates
example {{cite book|title=foo bar}}
.cm-mw-template other template content foo bar
.cm-mw-template-name template name cite book
.cm-mw-template-argument-name template parameters title=
.cm-mw-template-delimiter pipe |
.cm-mw-template-bracket opening/closing brackets {{ }}
.cm-mw-template-ground
.cm-mw-template2-ground
.cm-mw-template3-ground
whole template
(the number is the level of nesting)
{{foo|{{cite book|title=foo bar}}}}
Variables
example {{{foo|bar}}}
.cm-mw-templatevariable variable bar
.cm-mw-templatevariable-name triple-braced variable name foo
.cm-mw-templatevariable-bracket opening/closing brackets {{{ }}}
.cm-mw-templatevariable-delimiter pipe |
Parser functions
example {{#assessment: A | High }}
.cm-mw-parserfunction parser function parameters High
.cm-mw-parserfunction-name parser function name PAGENAME #invoke
.cm-mw-parserfunction-bracket opening/closing brackets {{ }}
.cm-mw-parserfunction-delimiter delimiter :
Extension tags
Note: Extension may use their own styles and rules for highlighting text within the extension tag.
example <poem style="padding: 1em;">string
whole line
string</poem>
.cm-mw-exttag text inside tags string
.cm-mw-exttag-name,
.cm-mw-ext-poem[4]
tag name poem
.cm-mw-exttag-bracket opening/closing brackets < >
.cm-mw-tag-ref reference content <ref>{{cite web|url=https://example.org}}</ref>
.cm-mw-exttag-attribute
.cm-mw-exttag-attribute-value
reference attributes style="padding: 1em;"
HTML tags
example <span style="foo">foo bar</span>
.cm-mw-htmltag-name HTML tag span
.cm-mw-htmltag-bracket opening/closing brackets < >
.cm-mw-htmltag-attribute
.cm-mw-htmltag-attribute-value
parameters and values style="foo"
superscript
subscript
foo<sup>bar</sup>
foo<sub>bar</sub>
Pre-formatted text
.cm-mw-tag-pre pre-formatted text <pre>foo bar</pre>
.cm-mw-tag-nowiki nowiki text <nowiki>foo bar</nowiki>
Internal links
example [[foo bar]] [[foo#section|bar]]
.cm-mw-link-pagename internal link target foo bar
.cm-mw-link # character #section
.cm-mw-link-tosection characters after the # #section
.cm-mw-link-bracket opening/closing brackets [[ ]]
.cm-mw-link-text link label (no additional formatting)
.cm-mw-link-delimiter pipe |
.cm-mw-pagename internal link targets foo bar
External links
example https://www.example.org
[https://www.example.org]
[https://www.example.org example.org]
.cm-mw-extlink,
.cm-mw-free-extlink
external link target www.example.org
.cm-mw-extlink-protocol,
.cm-mw-free-extlink-protocol
protocol https://
.cm-mw-extlink-text link label (no additional formatting)
.cm-mw-extlink-bracket opening/closing brackets [ ]
Tables
example {| class="wikitable"
|-
! Header text !! Header text
|-
| Example || Example
|}
.cm-mw-table-bracket opening/closing brackets and pipe {| |}
.cm-mw-table-delimiter row and column separators | |- !
.cm-mw-table-definition
.cm-mw-table-definition-value
table classes and styles class="wikitable"
.cm-mw-table-caption caption text |+ caption
Other
.cm-mw-double-underscore magic words __TOC__
.cm-mw-list semicolon (definition lists) ;Foo:Bar
.cm-special-char-nbsp non-breaking space · ·
.cm-specialChar control characters

Notes

  1. 1 2 Din personliga CSS finns på Special:MyPage/common.css. Du kan också få dina ändringar att gälla globalt om GlobalCssJs är installerad. På Wikimedia-wikis är din globala CSS på meta:Special:MyPage/global.css.
  2. Controlled by the $wgCodeMirrorLineNumberingNamespaces configuration setting. See Extension:CodeMirror#Configuration for more information.
  3. 1 2 The size is not changed in the 2017 wikitext editor.
  4. Where "poem" is the name of the tag.