Recent Changes - Search:

add Test page

hide

Test


hide

Topics

show

Changed

Visitor's book
Site map
pmwiki-2.3.32

Code Mirror

Edit this page to see the Code Mirror recipe in action.

Test also on PmWiki.MarkupMasterIndex

WikiTrails

<<|[[Code Mirror]]|>>
<|[[Code Mirror]]|>

^|[[Code Mirror]]|^

<< | Code Mirror | >> Code Mirror

Code Mirror

PageVariables, PageTextVariables

* {$Titlespaced}
* {{$Name}$Titlespaced}
* {{$Group}.{$Name}$Titlespaced}

# {$:variable}
# {{$Name}$:variable}
# {{$Group}.{$Name}$:variable}

(:variable:description:)
:variable:description
variable:description

>>pre<<
{*$variable}, {GroupName/PageName*$variable}
{*$:variable},  {GroupName.PageName*$:variable}

(:template each:)
{=$variable}, {<$variable}, {>$variable},
{=$:variable}, {<$:variable}, {>$:variable},
{$$variable}
>><<
  • Code Mirror
  • Code Mirror
  • Code Mirror
  1. description
  2. description
  3. description
variable
description
variable:description

, {GroupName/PageName*$variable} description, {GroupName.PageName*$:variable}

(:template each:) {=$variable}, {<$variable}, {>$variable}, {=$:variable}, {<$:variable}, {>$:variable}, {$$variable}

Basic markup

>>pre<<
Normal text
''emphasis''
'''strong'''
'''''strong emphasis'''''
@@monospace@@
'*bold*'
'~italic~'
'*'~bold italic~'*' '~'*italic bold*'~'
''emphasis '''strong emphasis''' emphasis''
'''''strong emphasis ''' emphasis''
'''''strong emphasis '' strong'''
'''''' what happens here ''''''
'''''' or here
'' emphasis ''' emphasis strong '''''
''' strong ''  emphasis strong '''''

z [+ a {- b {+ c [- d -] e +} f -} g +] h

'' one [+ two {+ three {- four '^five^' -} six +} seven +] ''''' eight [- nine -] ''' 
>><<

Normal text emphasis strong strong emphasis monospace bold italic bold italic italic bold emphasis strong emphasis emphasis strong emphasis emphasis strong emphasis strong ' what happens here ' or here emphasis emphasis strong strong emphasis strong

z a b c [- d -] e f g h

one two three four five six seven eight nine

>>pre<<
[-small-], [--smaller--]
[+big+], [++bigger++]
'-small-', '+big+'
'^superscript^', '_subscript_'
{+inserted+} (underscore) {+inserted+}
{-deleted-} (strikethrough) {-deleted-} (strikethrough)
[@escaped code@]
[=escaped text=]
[=[[~skiwi]] 2015 Apr 12 10:52=] remove bracketing to test
[=[[~skiwi]]=] remove bracketing to test
>><<

small, smaller big, bigger small, big superscript, subscript inserted (underscore) inserted deleted (strikethrough) deleted (strikethrough) escaped code escaped text [[~skiwi]] 2015 Apr 12 10:52 remove bracketing to test [[~skiwi]] remove bracketing to test

----  horizontal line
 ---- not a horizontal line
-> test \ join line \
test \\ line break \\
broken line
[[<<]] line break [[<]] clear left [[>]] clear right
-< with trailing spaces \\       
with more trailing spaces \      
showing markup effectivity
!!!!!! heading
!!!!!!! heading too
 !!!! not a heading

horizontal line

---- not a horizontal line

test \ join line test \\ line break
broken line


line break
clear left >? clear right

with trailing spaces \\

with more trailing spaces \ showing markup effectivity

heading
! heading too

!!!! not a heading

Lists

* bullet
# number
#*#* check correct highlighting
** indented {+list+}
## indented {-bullet-}
-> indent
-< hanging '''indent'''
--> more ''indented''
--< more hanging indent
 **** not a list
:definition:list
::subitem:definition list
:::subsubitem : definitionlist
:: not a definition list
  • bullet
  1. number
  2. *#* check correct highlighting
    • indented list
    1. indented bullet
indent
hanging indent
more indented
more hanging indent

**** not a list

definition
list
subitem
definition list
subsubitem
definitionlist

:: not a definition list

Block markup

>>frame<<
block
>><<
(:div:)
div
(:divend:)
[@ pre
formatted
@]
[= prevent
formatting
=]
(:article1 id=article class="glossary":)(:article1end:)
(:section2 id=s1:)(:section2end:)
(:header:)(:headerend:)
(:footer:)(:footerend:)
(:aside:)(:asideend:)
(:address:)(:addressend:)
(:nav:)(:navend:)
>>rframe<<
right block
>>lframe<<
left block
>><<

block

div

 pre
formatted

prevent formatting

(:article1end:)
(:section2end:)
(:headerend:)
(:footerend:)

Links

>>pre<<
!!! External links
https://kiwiwiki.co.nz
[[https://kiwiwiki.co.nz]]
[[https://kiwiwiki.co.nz"tool tip"]]|is this a caption
[[https://kiwiwiki.co.nz | link text]]|or is this?
[[link text -> https://kiwiwiki.co.nz]] | [-caption-]
[[link text -> https://kiwiwiki.co.nz]]continued

>><<
>>pre<<
!!! Page links
[[PageName]]
[[page name]]
[[page (name)]]
[[PageName | link text]] or [[Page Name | [link text] ]]
[[PageName | + ]] (titled link)
[[PageName | # ]] (anonymous numerical reference link)
[[PageName"tool tip"]]
[[link text -> PageName]]
[[#anchor]] (to create an anchor)
[[#anchor | link text]] (to refer to an anchor)
[[anchor | # ]] (anonymous numerical reference link)
[[PageName#anchor | link text]] (to refer to an anchor in another page)
>><<

Page links

PageName page name page link text or [link text] Page Name (titled link) [1] (anonymous numerical reference link) PageName link text (to create an anchor) link text (to refer to an anchor) [2]? (anonymous numerical reference link) link text (to refer to an anchor in another page)

>>pre<<
!!! WikiGroup links
[[GroupName/]] or [[Group name/]]
[[GroupName"tool tip"]]
[[GroupName.]]
[[GroupName/PageName]] or [[GroupName/page name]]
[[(GroupName.)page name]]
[[~Author Name]]
[[~Author Name | +]]
[[~Author Name | #]]
[[~Author Name | link text]]
[[~Author Name"tool tip"]]
[[!Category Name]]
>><<
>>pre<<
!!! [[PmWiki/InterMap]] links
[[Path:/path/local_document.html]]
[[Wikipedia:WikiWikiWeb]]
>><<
>>pre<<
Attach:LinkImageExample.png
Attach:LinkImageExample.png"link image example"
Attach:LinkImageExample.png|[-Link image example 1-]
[[Attach:LinkImageExample.png]]
[[Attach:LinkImageExample.png"link image example"]]
[[Attach:LinkImageExample.png]]|[-Link image example 2-]

https://kiwiwiki.nz/pmwiki/uploads/Test/CodeMirror/LinkImageExample.png|[-caption 1-]
[[{$FullName} | https://kiwiwiki.nz/pmwiki/uploads/Test/CodeMirror/LinkImageExample.png]]|[- caption 2 -]
>><<
link image example

Link image example 1

Attach:LinkImageExample.png Attach:LinkImageExample.png Attach:LinkImageExample.png|Link image example 2


caption 1

caption 2

Comments

%comment% comment to end of line
%comment newwin% another comment to eol
%newwin comment% comment to eol
before %comment% a comment %% and after
before %comment newwin% a comment %% after
start %newwin comment% a comment %% end

comment to end of line another comment to eol comment to eol before a comment and after before a comment after start a comment end

(:comment this is a comment:) followed by text
(:commentthis is not a comment:) followed by text

followed by text (:commentthis is not a comment:) followed by text

>>comment<<
this is a comment
>><<
 >>comment<< ''not a comment''
 >><<
>>this is a comment here<< ''inside a comment''
>><<
>>this is notacomment<< ''not a comment here''
>><<

this is a comment

>>comment<< not a comment >><<

not a comment here

Simple tables

||width=*
||[[PmWiki/Tables]] |||| '''test''' || '''simple'''||''table''||  
|| '''Document Info''' ||||
|| ''Category''||[[!FAQ]] ||
|| ''Modified''||{$LastModified}||
|| ''[[{$Name}?action=diff | by]]''||{$LastModifiedBy}||

Tablestestsimpletable
Document Info
CategoryFAQ
Modified2022 May 14 14:42
byDfaure

Advanced tables

(:table class="tabtable":)
(:headnr:) Heading content
(:head:)
!!! heading cell content
(:cellnr:)
'''new row content'''
(:cell:) ''cell content''
(:cellnr colspan=2:)
||!Test: ||example||with: colon ||
||Test:  ||example||without colon ||
(:tableend:)
Heading content

heading cell content

new row content

cell content
Test:examplewith: colon
Test:examplewithout colon

Combination markup

>>pre<<
{+''inserted italic''+}
'''[-bold smaller-]'''
>><<

inserted italic bold smaller

>>pre<<
(:include PageName:)
(:include PageName#start#end lines=n paras=n:)
(:include PageName1 PageName2 PageName3:)
Attach:image.png, Attach:"my doc.docx", Attach:'download.zip'
Path:/pathto/filename.ext, news:, gopher:, nap:, file:, tel:+64-00-0000-0000, geo:
(:redirect PageName#anchor status=301 from=name quiet=1:)
(:nogroupheader:)
(:nogroupfooter:)
(:description a broad range of tests for CodeMirror:)
(:keywords CodeMirror, test:)
(:nolinkwikiwords:)
(:linebreaks:)
>><<

Used by Code Mirror

variable: variable from Test.PageName

Attach:image.png Δ, Attach:"my doc.docx", Attach:'download.zip' Path:/pathto/filename.ext, news:, gopher:, nap:, file:, tel:+64-00-0000-0000, geo: (:redirect PageName#anchor status=301 from=name quiet=1:)

Nested markup

''[[Test/]]''
[[Test/ | ''test group'']]

:xxx: [[CodeMirror]] yyy  [[HomePage]]
:xxx: [[CodeMirror]] yyy: [[HomePage]]
xxx:  [[CodeMirror]] yyy: [[HomePage]] 
xxx:  [[CodeMirror]] yyy  [[HomePage]]
xxx   [[CodeMirror]] yyy: [[HomePage]]
xxx   [[CodeMirror]] yyy  [[HomePage]]
xxx::  [[CodeMirror]] yyy: [[HomePage]]
::xxx  [[CodeMirror]] yyy: [[HomePage]]

||!Test: ||example||without colon ||
||Test:  ||example||with: colon ||

Shouldn't be a link, no? file:

Test
test group

xxx
CodeMirror yyy HomePage
xxx
CodeMirror yyy: HomePage
xxx: CodeMirror yyy: HomePage

xxx CodeMirror yyy: HomePage
xxx CodeMirror yyy HomePage

xxx:: CodeMirror yyy: HomePage
xxx CodeMirror yyy
HomePage
Test:examplewithout colon
Test:examplewith: colon

Shouldn't be a link, no? file:

!! Illustration for the PmWiki Cookbook page
Text in a paragraph can be formatted '''strong''', ''emphasis'', {+inserted+}, {-deleted-}, [+bigger+], [-smaller-], and '^superscript^', or '_subscript_'.

Lists and indentation of various types are highlighted:
* bullets
## numbers
:definition: lists
--> indentation
---< hanging indentation

[@Escaped code@], [=escaped text=], @@monospace@@, and %red%formatting%% can be seen, as can line joins \
and [[<<]] line breaks \\
not to mention the horizonal rule.
----
||width=*
||! Simple tables ''work'' '''very''' nicely ||||
|| showing %red%highlighted%% || markup ||
(:div2 class=example:) Directives
themselves are coloured
(:div2end:)
(:table class='tabtable':)
(:cellnr:)Advanced table markup
(:cell:)is coloured
(:tableend:)
(:if true:)
>>block markup<<
is shown
>><<
(:ifend:)
[[#anchor]]
Of course [[https://pmwiki.org/ | links]] of all [[#anchor|types]] show up.

A variety of {$variables} and {$:pagetextvariables} can be seen, and %comments% are grayed out%%. Another comment example is
>>comment<<
Inside the comment.
>><<

Enjoy!

Illustration for the PmWiki Cookbook page

Text in a paragraph can be formatted strong, emphasis, inserted, deleted, bigger, smaller, and superscript, or subscript.

Lists and indentation of various types are highlighted:

  • bullets
    1. numbers
definition
lists
indentation
hanging indentation

Escaped code, escaped text, monospace, and formatting can be seen, as can line joins and
line breaks
not to mention the horizonal rule.


Simple tables work very nicely
showing highlightedmarkup
Directives

themselves are coloured

Advanced table markup is coloured

is shown


Of course links of all types show up.

A variety of and can be seen, and are grayed out. Another comment example is

Inside the comment.

Enjoy!

tahi
Page last modified on 2022 May 14 14:42

Edit -
History -
Recent Changes -
WikiHelp -
Search -
email page as link -> mailto:?Subject="KiwiWiki: Code Mirror"&Body=