For at placere et billede i en side, indtast billedets adresse (URL) i opmærkningsteksten. En alternativ tekst (brugt til værktøjstip og til browsere der ikke viser billeder), placeres i dobbelte anførselstegn umiddelbart efter billedURLen. En billedtekst kan følge efter, adskilt af en lodret streg (|), og kan indeholde enkel formatering
http://pmichaud.com/img/misc/pc.jpg"Paper clips" | [- %newwin% [[ Wikipedia:Paper_clips | Papirklips ]] er ''sjove'' at arbejde med. -] |
Billeder kan også angives som uploadede filer (dvs. Attach:billede.jpeg
og ved at bruge InterMap-links.
Som standard understøtter PmWiki følgende billedtyper:
(Se også Uploads og Bemærkninger herunder, for billedfiler der mangler endelser.)
For at oprette et link til et billede (som http://pmichaud.com/img/misc/pc.jpg, i modsætning til at vise selve billedet), brug dobbelte firkantede paranteser til at opmærke linket, som i [[http://pmichaud.com/img/misc/pc.jpg]]
eller [[Attach:billede.jpeg]]
.
For at få et billede til at linke til et andet sted, brug billedet som linktekst, som i
[[http://pmwiki.org/ | http://pmichaud.com/img/misc/pc.jpg"PmWiki"]] |
eller [[http://example.com|Attach:Gruppenavn./billede.jpeg]]
.
Værktøjstips eller altenativ tekst
Et værktøjstip, eller en alternativ tekst, kan blive vist når musemarkøren hænger over billedet, ved at placere beskrivelsen i dobbelte anførselstegn umiddelbart efter billedets URL. Beskrivelsen kan ikke indeholde nogen formatering.
http://pmichaud.com/img/misc/pc.jpg"Farvede papirklips" |
Billedtekster
En billedtekst kan tilføjes til et billede ved at bruge en lodret streg og billedteksten.
http://pmichaud.com/img/misc/pc.jpg | '''Figur 1''' |
Billedjustering
Normalt vises billeder "på linjen" med den omgivende tekst.
Brug %center%
for at centrere et billede.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. %center%http://pmichaud.com/img/misc/pc.jpg"Papirklips"%% | Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. |
Brug %right%
til at højrejustere et billede.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. %right% http://pmichaud.com/img/misc/gem.jpg%% | Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. |
Flydende billeder
For at venstre- eller højrejustere et billede med tekst flydende omkring det, brug wikitypografierne %lfloat%
eller %rfloat%
.
%lfloat text-align=center margin-top=5px margin-right=25px margin-bottom=5px margin-left=25px% http://pmichaud.com/img/misc/gem.jpg | '''Rock on!''' '''Billedet er venstrejusteret, med marginer indstillet; billedteksten er centreret; teksten flyder omkring billedet på højre side''' Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. | Billedet er venstrejusteret, med marginer indstillet; billedteksten er centreret; teksten flyder omkring billedet på højre side Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. |
Opmærkningen [[<<]]
bryder flydende tekst, og teksten fortsætter ved bunden af billedet.
%lfloat% http://pmichaud.com/img/misc/gem.jpg '''Billedet er ventrejusteret, og teksten flyder omkring højre side af billedet. Teksten efter opmærkningen ''[@[[<<]]@]'' fortsætter under billedet.''' [[<<]] Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. | Billedet er ventrejusteret, og teksten flyder omkring højre side af billedet. Teksten efter opmærkningen |
Brug typografierne %lframe%
eller %rframe%
til at få et bilede til at flyde og placere en ramme omkring billedet og dets billedtekst. Rammen kan formateres med wikitypografier.
%rframe% http://pmichaud.com/img/misc/gem.jpg | '''Rock on!''' '''Billedet er højrejusteret, og teksten flyder omkring billedets venstre side.''' Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. | Billedet er højrejusteret, og teksten flyder omkring billedets venstre side. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. |
%cframe width=100px bgcolor=lightblue border='3px solid red' padding=20px% http://pmichaud.com/img/misc/gem.jpg |
Eksempel der viser mangel på fuld breddeindstilling:-
%cframe width=50px bgcolor=lightblue border='3px solid red' padding=20px% http://pmichaud.com/img/misc/gem.jpg |
Brug %block rframe%
til at sætte flere billeder og billedtekster til at blive stablet lodret i en højreflydende ramme.
%block rframe width=300px%http://pmichaud.com/img/misc/gem.jpg\\ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\\\ http://pmichaud.com/img/misc/bubble.jpg\\ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.%% Tekst der følger efter den definerede blok flyder omkring rammens venstre side. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. |
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tekst der følger efter den definerede blok flyder omkring rammens venstre side. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. |
Ændring af billeders størrelse
For at ændre et billedes størrelse via wikitypografier, brug %width=50px%
eller %height=50px%
foran billedet. wikitypografien %thumb%
er en anvendelig genvej til %width=100px%
.
%width=50px% http://pmichaud.com/img/misc/bubble.jpg \ %height=50px% http://pmichaud.com/img/misc/bubble.jpg \ %thumb% http://pmichaud.com/img/misc/bubble.jpg |
Bemærk: At ændre størrelsen på et billede via wikitypografier ændrer kun hvordan billedet vises i en browser; det reducerer ikke overførelsesstørrelsen af selve billedet - så at ændre størrelsen via wikitypografier er ikke en acceptabel måde at generere en side fuld af billeder, eller 'gallery'.
Hvis du vil have et billede med ændret størrelse inden i et link, er du nødt til at angive størrelsen før linket, og lukke det af med en %%.
%width=60%[[http://pmwiki.org/ | http://pmichaud.com/img/misc/pc.jpg"PmWiki"]]%% \ %height=60%[[http://pmwiki.org/ | http://pmichaud.com/img/misc/pc.jpg"PmWiki"]]%% \ |
For at åbne linket i et nyt vindue, skal du placere %newwin% før størrelsesangivelsen.
%newwin%[[http://pmwiki.org/ | http://pmichaud.com/img/misc/pc.jpg"PmWiki"]]%% |
Billeder der har fået ændret deres størrelse ved brug af %thumb%
kan også gøres flydende med rammer, og gøres til links.
%lframe thumb% [[http://pmichaud.com/img/misc/bubble.jpg | http://pmichaud.com/img/misc/bubble.jpg"Spræng boblen"]] | [-Boble-] %lframe thumb% http://pmichaud.com/img/misc/pc.jpg"Klips billetten" | [-Papirklips-] %lframe thumb% [[DocumentationIndex | http://pmichaud.com/img/misc/gem.jpg"Besøg dokumentationsindekset"]] | [[DocumentationIndex | [-Rock On-]]] |
Billeder som links
For at bruge et billede som link, angiv et billede i stedet for tekst i links-opmærkningen.
[[Links | http://pmichaud.com/img/2003/atc-1.gif"Information om wikilinks"]] |
Bemærkninger
- En billedfil der mangler en korrekt endelse kan vises ved at tilføje en "falsk" endelse til URLen. For eksempel, hvis URLen er
http://example.com/script/tux
, tilføj en falsk forespørgselsstreng i enden med den ønskede endelse (fxhttp://example.com/script/tux?format=.png
). Hvis forespørgselsstrenge er upassende, bør en fragmentidentifikator virke, fxhttp://example.com/script/tux#file.png
. - Relativ bredde er mulig ved at bruge procenter.
%width=10pct% http://pmichaud.com/img/misc/bubble.jpg \ %height=30pct% http://pmichaud.com/img/misc/bubble.jpg |
- Flydende tekst er mulig, ligesom billedtekster, inden for en ramme
>>lframe width=130px<< %thumb width=130% [[http://pmichaud.com/img/misc/bubble.jpg | http://pmichaud.com/img/misc/bubble.jpg"Spræng boblen"]] | [--Lang billedtekst til et billede som [[http://pmichaud.com/img/misc/bubble.jpg | boblen]]. Dette er bot for at vise noget tekst som flyder inden for rammen--] >><< |
Se også
- Cookbook:Images - tilføjelse af billedgallerier, automatiske miniturebilleder, baggrundsbilleder, og mere.
Anerkendelse
Billederne på denne side blev fundet på http://flickr.com og er videregivet under en licens i licensfamilien Creative Commons License.
Er det muligt at linke et billede på PmWiki uden at bruge en fuldt kvalificeret URL?
Ja. For billeder som er vedhæftninger, er det generelle format Attach:Gruppenavn./billede.gif
. For at linke til et billede på samme server, brug Path:/sti/til/billede.gif
.
Kan jeg vedhæfte en klientbilledfil på PmWiki?
Ja, se Uploads.
Hvordan kan jeg inkludere en side fra en anden gruppe som indeholder et vedhæftet billede?
Inkluder siden som normalt, dvs. (:include Gruppenavn.Sidenavn:)
. I siden der skal inkluderes (som indeholder billedet) udskift Attach:filnavn.end
med Attach:{$Group}./filnavn.end
.
Hvorfor, når jeg sætter et billede med rframe eller rfloat og umiddelbart derefter åbner en ny sidesektion med ! er sektionstitelrækken under billedet i stedet for på venstre side?
Fordi CSS for overskrifter som ! indeholder et element clear:both som fremtvinger denne opførsel. Gendefiner CSSen lokalt hvis du vil have det til at stoppe, men jeg tror at bundrammen (som løber under overskriften) har brug for yderligere gendefinition. Jeg bruger blot fed til titlen, og 4 bindestreger under ---- for at adskille en ny sektion, og det sparer mig for besværet med at rumstere med kernedefinitionerne.
I modsætning til direktiverne lframe og rframe overholder cframe ikke helt breddeindstillingen. Selvom rammen selv ændrer størrelse til at passe til forespørgslen, gør billedet ikke, og beholder sin originale størrelse. Virkningen er den samme i IE og Fx. Jeg har tilføjet et eksempel under standardeksemplet ovenover.
Er det muligt at forbyde alle billeder? Jeg har allerede deaktiveret uploads men jeg vil også forbyde visning af eksterne billeder på mine wikisider.
Ja, tilføj til config.php:
DisableMarkup('img'); $ImgExtPattern = "$^";
Hvad kan jeg gøre, så når jeg placerer et billede i en side, så kommer tekstblokken i en <p> (paragraph = afsnit), i stedet for en <div> (division)?
Hvis du blot vil have det til at ske for et enkelt billede (i stedet for alle), så prøv at sætte [==]
i begyndelsen af linjen, som i:
[==] http://www.pmwiki.org/pub/pmwiki/pmwiki-32.gif
[==]
i begyndelsen af en linje tvinger alt der følger efter til at være en del af et afsnit.
Er der en måde at bruge relative stier til billeder?
Se Cookbook:RelativeLinks og $EnableLinkPageRelative
.
Er der en måde at vedhæfte en BMP og få den vist, i stedet for at linke?
Tilføj følgende linje til config.php:
$ImgExtPattern = "\\.(?:gif|jpg|jpeg|png|bmp|GIF|JPG|JPEG|PNG|BMP)";
Bemærk at BMP-billeder er ukomprimerede og ret tunge. Det kan være at du vil konvertere dem til et af formaterne PNG (tabsfri) eller JPG (tabsgivende), og på den måde reducere deres filstørrelser 5-20 gange.
Er der en måde at få en tabel til venstre eller højre for et billede?
Ja, se TableAndImage.
Oversættelse af PmWiki.Images - Original side på PmWikiDa.Images - Backlinks
Sidste ændringer:
PmWikiDa.Images: 2015-01-20 12:30
PmWiki.Images: 2019-09-08 06:24