PmWiki: Test/Skin<->Markup Test Page

Side Bars

Header/Footer

Site Pages

Test: Skin Test Assortment

A skin test page

Also see SkinTest-Compact for a newer skin-comparison page.
Use this page to see how various wiki markup looks when you are using the Skins that are installed on pmwiki.org. If you discover some important Test Markup missing please use one of the edit links to add it.

Skin Selector (edit)

Choose the skin to try from the list on the right, or reset to the PmWiki skin:

Note: This list only includes skins that are installed on pmwiki.org. To see the skins that are missing from this list, install them on your local copy of PmWiki.

Text Tests (edit)

Lorem ipsum dolor sit amet, consectetuer adipiscing ^elit. Nulla eget lacus ?. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus. Aliquam mi velit, interdum et, feugiat ut, dictum eget, eros. Cras vulputate sapien vitae massa. Vestibulum eget wisi. Nulla ac justo non metus bibendum sagittis. Phasellus nonummy odio quis ante. Nunc vel lectus a lacus porttitor consequat.

Proin venenatis. Praesent arcu. Vestibulum aliquet pellentesque odio. In viverra quam sed magna dapibus fringilla. Duis eleifend ante ac eros. Fusce nunc. Vivamus lectus magna, fringilla vel, ultricies id, convallis quis, mi. Mauris eros erat, dapibus eget, vestibulum dapibus, luctus ut, eros. Nullam id dolor. Aenean ut tortor. Duis in nulla at ante viverra faucibus. Donec pulvinar gravida est. Sed nec est vel pede fringilla varius. Pellentesque ac felis. Ut luctus, arcu nec pretium dapibus, lorem enim varius purus, at varius ipsum metus nec leo.

Small text. Normal text. Large text.
Large monospaced. Normal monospaced. Small monospaced.
Strong text. Emphasized text. Super^script and Sub_script.

Indented text. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus.

Double-indented text. Proin venenatis. Praesent arcu. Vestibulum aliquet pellentesque odio. In viverra quam sed magna dapibus fringilla. Duis eleifend ante ac eros. Fusce nunc. Vivamus lectus magna, fringilla vel, ultricies id, convallis quis, mi.

Hanging indented (outdented) text. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus.

"Double" Hanging indented (outdented) text. Proin venenatis. Praesent arcu. Vestibulum aliquet pellentesque odio. In viverra quam sed magna dapibus fringilla. Duis eleifend ante ac eros. Fusce nunc. Vivamus lectus magna, fringilla vel, ultricies id, convallis quis, mi.

Definition: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus.

Heading Tests (edit)

XXXXX Heading

XXXXX Subheading

XXXXX Sub-subheading

XXXXX Sub-sub-subheading

Level 2 Heading (Link)

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus. Aliquam mi velit, interdum et, feugiat ut, dictum eget, eros. Cras vulputate sapien vitae massa.

Level 3 Heading (Link)

Level 4 Heading (Link)

List Tests (edit)

Ordered List

Top level
1. second-level
2. second-level
3. second-level
  1. third-level
  2. third-level
4. second-level
  1. third-level
    1. fourth-level
      1. fifth-level
      2. fifth-level
    2. fourth-level
top-level
top-level

Unordered List

Animals
- Dogs
  - Spot
  - Rover
- Cats
  - Boots
  - Felix
Plants
- Trees
  - Deciduous
    - Oak
    - Elm
    - Muberry
  - Evergreen
    - Pine
      - Aleppo
      - Ponderosa
    - Spruce
      - Blue
      - Oriental
    - Fir
      - Silver
      - Noble

Image Tests (edit)

Image With Text on Left (Float)

%lfloat%Attach:pmwiki-32.gif%%
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Donec vitae purus non mauris dapibus congue. Nulla
facilisi. Curabitur non quam. Vivamus sem orci, euismod
sed, faucibus vitae, tristique vel, orci. Donec elementum.
Curabitur id dui. Aenean imperdiet, arcu in pulvinar
luctus, sapien eros pulvinar elit, vel mattis felis dolor
ut nunc. Ut viverra. Sed scelerisque vulputate pede.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec vitae purus non mauris dapibus congue. Nulla facilisi. Curabitur non quam. Vivamus sem orci, euismod sed, faucibus vitae, tristique vel, orci. Donec elementum. Curabitur id dui. Aenean imperdiet, arcu in pulvinar luctus, sapien eros pulvinar elit, vel mattis felis dolor ut nunc. Ut viverra. Sed scelerisque vulputate pede.

Image With Text on Right (Float)

%rfloat%Attach:pmwiki-32.gif%%
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Donec vitae purus non mauris dapibus congue. Nulla
facilisi. Curabitur non quam. Vivamus sem orci, euismod
sed, faucibus vitae, tristique vel, orci. Donec elementum.
Curabitur id dui. Aenean imperdiet, arcu in pulvinar
luctus, sapien eros pulvinar elit, vel mattis felis dolor
ut nunc. Ut viverra. Sed scelerisque vulputate pede.

A Centered Image

(:table width=100%:)
(:cell align=center:)
Attach:pmwiki-32.gif
(:tableend:)

Two Images

Attach:pmwiki-32.gif
Attach:pmwiki-32.gif Attach:pmwiki-32.gif

Image With Text on Right (Table)

(:table width=100% style='background-color:#f6f9f9;':)
(:cell bgcolor=white:)
Attach:pmwiki-32.gif
(:cell:)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus.  Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus. 
(:tableend:)

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus.

Image With Text on Left (Table)

(:table width=100% style='background-color:#f6f9f9;':)
(:cell:)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus.  Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus. 
(:cell bgcolor=white:)
Attach:pmwiki-32.gif
(:tableend:)

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget lacus. Sed malesuada ligula. In ultrices urna. Maecenas et dolor vel ipsum gravida commodo. Ut a lectus.

Large Image

%width=300px%Attach:pmwiki-32.gif

Table Tests (edit)

(:table width=75%  border=1 cellpadding=5px cellspacing=0:)
(:cell:) table 75% wide
(:cell align=center:) centred cell
(:cell align=right:) right aligned cell
(:cellnr:) next row
(:cell align=center:) centred cell
(:cell align=right:) right aligned cell
(:tableend:)

table 75% wide	centred cell	right aligned cell
next row	centred cell	right aligned cell

This table, styled with "smaller"-sized fonts in the <table> tag

||width=75% align=center style="background-color: #eeeeee; font-size: smaller;"
||! ||! Dr.||! Cr.||
||Wages and Salaries Income || || 190||

	Dr.	Cr.
Wages and Salaries Income		190

should look like this one. which has the font size set in each cell:

(:table width=75% align=center style='background-color: #eeeeee;':)
(:cell style='font-size: smaller;':)
(:cell style='font-size: smaller; text-align:right;':)
'''Dr.'''
(:cell style='font-size: smaller; text-align:right;':)
'''Cr.'''
(:cellnr style='font-size: smaller; text-align:left;':)
Wages and Salaries Income
(:cell style='font-size: smaller; text-align:right;':)
(:cell style='font-size: smaller; text-align:right;':)
190
(:tableend:)

	Dr.	Cr.
Wages and Salaries Income		190

Long Tables

Very long horizontal tables to see the effect with the right sidebar

Tables

Header 1	Header 2	Header 3	Header 4	Header 5	Header 6	Header 7	Header 8	Header 9	Header 10	Header 11	Header 12	Header 13	Header 14	Header 15
A 1	A 2	A 3	A 4	A 5	A 6	A 7	A 8	A 9	A 10	A 11	A 12	A 13	A 14	A 15
B 1	B 2	B 3	B 4	B 5	B 6	B 7	B 8	B 9	B 10	B 11	B 12	B 13	B 14	B 15
C 1	C 2	C 3	C 4	C 5	C 6	C 7	C 8	C 9	C 10	C 11	C 12	C 13	C 14	C 15

TableDirectives

Header 1

Header 2

Header 3

Header 4

Header 5

Header 6

Header 7

Header 8

Header 9

Header 10

Header 11

Header 12

Header 13

Header 14

Header 15

A 1

A 2

A 3

A 4

A 5

A 6

A 7

A 8

A 9

A 10

A 11

A 12

A 13

A 14

A 15

B 1

B 2

B 3

B 4

B 5

B 6

B 7

B 8

B 9

B 10

B 11

B 12

B 13

B 14

B 15

C 1

C 2

C 3

C 4

C 5

C 6

C 7

C 8

C 9

C 10

C 11

C 12

C 13

C 14

C 15

Block Tests (edit)

With Bulleted List

bulleted string
bulleted string
bulleted string

Suspendisse nisl tellus, tincidunt ac, adipiscing in, tincidunt.

bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string
bulleted string

normal string

Form Tests (edit)

Forms

(:input form:)
(:input select name=FIRST value=1:)(:input select name=FIRST value=2:)[==]
(:input select name=SECOND value=3:)(:input select name=SECOND value=4:)
(:input end:)

Kmarie

SkinTestHeadings Test heading markup for Test.SkinTestAssortment
SkinTestImages Test image markup for Test.SkinTestAssortment
SkinTestLists Test list markup for Test.SkinTestAssortment
SkinTestMenu Menu for Test.SkinTestAssortment
SkinTestSelectSkin List of skins for Test.SkinTestAssortment
SkinTestTables Test table markup for Test.SkinTestAssortment
SkinTestText Test of Text markup for Test.SkinTestAssortment

Site