Estils wiki
Taula de continguts
Els fonaments
Els estils wiki permeten modificar el color i altres atributs de forma dels continguts.
Un estil wiki s'escriu usant signes de percentatge, per exemple %red%
o %bgcolor=lightblue%
.
Els estils wiki VS. els estils CSS
Els estils wiki, tal i com s'escriuen a les pàgines del wiki, no són exactament estils CSS o classes CSS. Els estils wiki ens permeten usar classes CSS predefinides per l'administrador/a, i definir noves combinacions d'estils, sense cap necessitat d'editar/actualitzar els fitxers CSS locals del servidor.
Noteu que PmWiki permet l'ús de class=
i style=
a les taules i als blocs de divisió, però aquests són atributs HTML directes, no són pas estils wiki; és necessari saber CSS per a usar-los.
El tipus de lletra i el color del text
L'ús més bàsic dels estils wiki és per canviar atributs del text com ara bé el color, el color de fons, o el tipus de lletra. PmWiki defineix diversos estils wiki per a canviar el color del text a %black%, %white%, %red%, %yellow%, %blue%, %gray%, %silver%, %maroon%, %green%, %navy%, i %purple%.
El cabàs conté %red% pomes, %blue% mirtils, %purple% albergínies, %green% llimes, %% i més. | El cabàs conté pomes, mirtils, albergínies, llimes, i més. |
Per a usar altres colors no predefinits, feu servir l'estil wiki %color=...%
. (Nota: el colors RGB (#rrggbb) sempre s'han d'especificar en lletres minúscules per a evitar conflictes amb les ParaulesWiki.)
També voldria algunes %color=#ff7f00% taronges%% ! | També voldria algunes taronges ! |
Per a canviar el color de fons, feu servir %bgcolor=...%
com a estil wiki:
Aquesta frase conté %bgcolor=green yellow% text groc sobre fons verd. | Aquesta frase conté text groc sobre fons verd. |
Per a més ajuda al voltant dels colors, vegeu WikiStyle Colors.
Justificació del text
Els estils wiki s'usen per a controlar la justificació del text
%center% El text està centrat. %right% Justificat a la dreta. | El text està centrat. Justificat a la dreta. |
i per a crear text flotant:
%rfloat% Aquest text flota cap a la dreta %rframe% flota cap a la dreta amb un marc Lorem ipsum dolor sit amet, consectetuer sadipscing elitr | Aquest text flota cap a la dreta flota cap a la dreta amb un marc Lorem ipsum dolor sit amet, consectetuer sadipscing elitr |
Abast
Els estils wiki també poden especificar un abast; sense aquesta especificació, l'estil s'aplica a tot el text posterior fins al pròxim estil wiki o el final del paràgraf, el que esdevingui abans. L'atribut apply=
i els seus àlies permeten canviar l'abast de l'estil com es mostra tot seguit:
atribut apply | àlies | l'estil s'aplica a... |
---|---|---|
%apply=img ...% | - | totes les imatges que segueixen fins que s'aplica un altre estil |
%apply=p ...% | %p ...% | el paràgraf actual |
%apply=pre ...% | - | el text amb pre-format actual |
%apply=list ...% | %list ...% | la llista actual |
%apply=item ...% | %item ...% | els item de la llista actual |
%apply=div ...% | - | el div actual |
%apply=block ...% | %block ...% | el bloc actual, sigui un paràgraf, una llista, un ítem d'una llista, un encapçalament o una divisió. |
Per tant, %p color=blue%
és el mateix que %apply=p color=blue%
, i %list ROMAN%
és el mateix que %apply=list list-style=upper-roman%
.
Alguns àlies d'estil predefinits també usen apply, així %right%
és un àlies de %text-align=right apply=block%
.
Exemple: Aplicació d'un estil a un paràgraf:
%p bgcolor=#ffeeee% La especificació de l'estil wiki al principi d'aquesta línia s'aplica a tot el paràgraf, fins i tot si hi ha %blue% altres especificacions d'estils wiki%% al bell mig del paràgraf. |
La especificació de l'estil wiki al principi d'aquesta línia s'aplica a tot el paràgraf, fins i tot si hi ha altres especificacions d'estils wiki al bell mig del paràgraf. |
Nota: Un estil wiki aplicat només tindrà efecte si està a la línia que comença l'element que es suposa que ha de modificar. En altres paraules un estil wiki situat a la tercera línia d'un paràgraf no pot canviar els atributs del paràgraf:
Després de la primera línia del paràgraf, intentem aplicar %apply=p color=blue% per canviar el color. Açò no funciona perquè l'estil ve després de la primera línia del paràgraf. | Després de la primera línia del paràgraf, intentem aplicar per canviar el color. Açò no funciona perquè l'estil ve després de la primera línia del paràgraf. |
Tanmateix, aquest %apply=p color=red% paràgraf ''serà'' en roig perquè l'estil del bloc té lloc en la primera línia del seu text. | Tanmateix, aquest paràgraf serà en roig perquè l'estil del bloc té lloc en la primera línia del seu text. |
* Ací hi ha un ítem d'una llista * %list red% Uups, és massa tard per a canviar l'estil de la llista! |
|
Blocs més grans
Es pot usar el bloc >>EstilWiki<<
per tal d'aplicar un estil wiki a un bloc gran d'elements.
L'estil s'aplica fins trobar el pròxim >><<
.
>>blue font-style:italic bgcolor=#ffffcc<< Quelcom posterior a la línia de dalt es formatarà amb cursiva i color blau, Açò inclou text amb pre-format %red%color roig%% * llistes -> elements sagnats >><< | Quelcom posterior a la línia de dalt es formatarà amb cursiva i color blau, Açò inclou text amb pre-format color roig
elements sagnats
|
Fixeu-vos que la directiva (:div style="..." class="...":)
no funciona del mateix mode que >>EstilWiki<<
, només pot contenir un estil normal HTML i atributs de classe.
Els atributs HTML "class" i "style" per a taules i divisions
Els estils wiki només són les ordres entre %...%
signes de percentatge.
Tables, Table directives i els blocs de divisió (:div:) permeten a les autores més avançades incorporar atributs HTML/CSS class=
i style=
. Noteu que aquests atributs no són Estils Wiki, per a usar-los cal tenir coneixements de CSS.
(:table style="font-style:italic; color:green; border:1px solid blue; background-color:#ffffcc":) (:cellnr:) Quelcom posterior a la línia de dalt es formatarà amb cursiva i color verd, Açò inclou text amb pre-format %red%color roig%% * llistes -> elements sagnats (:tableend:) |
|
Fixeu-vos que la directiva (:div style="..." class="...":)
no funciona del mateix mode que >>EstilWiki<<
, només pot contenir un estil normal HTML i atributs de classe.
Àlies d'estil personalitzats
Es pot usar l'atribut define=
per definir un àlies (o drecera) a qualsevol estil wiki.
Posteriorment es pot tornar a usar aquest àlies per a especificar altres estils wiki.
%define=box block bgcolor=#ddddff border="2px dotted blue"% %box% [@ací un text aleatòri@] %box font-weight=bold color=green% [@ací un text aleatòri@] | |
%define=avis green%
i després useu al document %avis%
en lloc de %green%
. Així, si després decidiu que els avisos s'han de mostrar d'un mode diferent, és molt més fàcil canviar la definició (una) que totes les repeticions de %green%
al text.
%pre%
és el mateix que %class=pre%
.
Àlies d'estil predefinits
PmWiki defineix algunes àlies per als estils.
- Color del text:
%
black%
,%
white%
,%
red%
,%
yellow%
,%
blue%
,%
gray%
,%
silver%
,%
maroon%
,%
green%
,%
navy%
,%
purple%
(àlies per a%color=...%
) - Justificació:
%center%
i%right%
- Imatges i capses
- Flotant a esquerra o dreta:
%rfloat%
i%lfloat%
- Elements emmarcats:
%frame%
,%rframe%
, i%lframe%
- Mida de miniatura:
%thumb%
- Flotant a esquerra o dreta:
- Obre l'enllaç a una finestra nova:
%newwin%
(àlies per a%target=_blank%
) - Comentaris:
%comment%
(àlies per a%display=none%
) - Llistes ordenades:
%decimal%
,%roman%
,%ROMAN%
,%alpha%
,%ALPHA%
(vegeu també Cookbook:OutlineLists)
Atributs dels estils wiki
Els atributs d'estil reconeguts a dintre d'una especificació d'estil wiki són:
------------ CSS ------------- --HTML-- color bgcolor class background-color margin id text-align padding hspace text-decoration border vspace font-size float target font-family list-style rel font-weight width* accesskey font-style height* value display Especials: define, apply
Els atributs de les dos primeres columnes corresponen a les propietats CSS amb el mateix nom. Els atributs de l'última columna només s'apliquen a elements específics:
class=
iid=
assignen una classe o identificador CSS a un element HTMLtarget=nom
obri el subsegüent enllaç a una finestra del navegador anomenada "nom"rel=nom
identifica la relació de la pàgina de destí d'un enllaçaccesskey=x
usa 'x' com una drecera de teclat per al subsegüent enllaçvalue=9
estableix el número per a l'ítem actual de la llista ordenada
Habilitar els estils
Un administrador/a pot habilitar els estils que no estan llistats a dalt modificant el fitxer local/config.php
.
Per exemple per habilitar l'atribut "line-height
" cal afegir la línia:
$WikiStyleCSS[] = 'line-height';
Definir l'abast d'altres elements HTML
Per poder aplicar estils wiki a altres elements HTML podeu afegir-los a $WikiStyleApply
. Per exemple per a permetre donar format a les files de les taules o a les àncores, etc.
Per aplicar un format a les etiquetes d'àncora, afegiu al config.php
:
$WikiStyleApply['link'] = 'a';
Aleshores, podeu aplicar una classe o estil a l'àncora:
%apply=link red%[[WikiStyles | enllaç de prova]] |
O, per aplicar un atribut ID a una fila TR d'una taula, afegiu al config.php
:
$WikiStyleApply['row'] = 'tr';
Aleshores, amb les taules avançades, podeu tenir:
(:cellnr:) %apply=row id=el_meu_id_estil bgcolor=pink% contingut de la cel·la
I també a les taules simples:
|| border=1 || %apply=row id=el_meu_id_estil% 1 || 2 || 3 || 4 ||
Nota: l'estil %apply=row...%
hauria d'estar a la mateixa línia que (:cellnr:)
.
Exemples
WikiStyleExamples? conté exemples per com usar els estils wiki.
Problemes coneguts
- Quan es defineixen estils, els símbols de percentatge (com:
%block width=50% %
) s'han de substituir per "pct". PmWiki convertirà el "pct" en "%" (CSS vàlid). - Si especifiqueu múltiples valors per a un atribut, com ara bé
border="2px solid blue"
assegureu-vos de tancar els valors entre cometes. - Assegure-vos d'usar lletres en minúscula per als colors RGB en hexadecimal,
%color=#aa3333%
funcionarà,%color=#AA3333%
pot no funcionar.
Vegeu també
- CustomWikiStyles?
- PmWiki:List Styles Styles for use in wiki lists
- WikiStylesPlus Lots of useful Wikistyles (rollovers, code blocks, notes, warnings, outlines)
Traducció de PmWiki.WikiStyles -
Pàgina original a PmWikiCa.WikiStyles -
Retroenllaços