CINXE.COM

<!DOCTYPE html> <html lang="nl" dir="ltr" class="no-js"> <head> <meta charset="utf-8" /> <title>nl:images [DokuWiki]</title> <meta name="generator" content="DokuWiki"/> <meta name="theme-color" content="#008800"/> <meta name="robots" content="index,follow"/> <meta name="keywords" content="nl,images"/> <link rel="search" type="application/opensearchdescription+xml" href="/lib/exe/opensearch.php" title="DokuWiki"/> <link rel="start" href="/"/> <link rel="contents" href="/nl:images?do=index" title="Index"/> <link rel="manifest" href="/lib/exe/manifest.php"/> <link rel="alternate" type="application/rss+xml" title="Recente aanpassingen" href="/feed.php"/> <link rel="alternate" type="application/rss+xml" title="Huidige namespace" href="/feed.php?mode=list&ns=nl"/> <link rel="edit" title="Pagina aanpassen" href="/nl:images?do=edit"/> <link rel="alternate" type="text/html" title="Alleen HTML" href="/_export/xhtml/nl:images"/> <link rel="alternate" type="text/plain" title="Wiki Opmaak" href="/_export/raw/nl:images"/> <link rel="canonical" href="https://www.dokuwiki.org/nl:images"/> <link rel="stylesheet" href="/lib/exe/css.php?t=dokuwiki&tseed=f1005bad3d81fc9c803c7f93d32a390e"/> <link rel="alternate" hreflang="en" href="https://www.dokuwiki.org/images"/> <link rel="alternate" hreflang="da" href="https://www.dokuwiki.org/da:images"/> <link rel="alternate" hreflang="de" href="https://www.dokuwiki.org/de:images"/> <link rel="alternate" hreflang="es" href="https://www.dokuwiki.org/es:images"/> <link rel="alternate" hreflang="fr" href="https://www.dokuwiki.org/fr:images"/> <link rel="alternate" hreflang="it" href="https://www.dokuwiki.org/it:images"/> <link rel="alternate" hreflang="ja" href="https://www.dokuwiki.org/ja:images"/> <link rel="alternate" hreflang="ko" href="https://www.dokuwiki.org/ko:images"/> <link rel="alternate" hreflang="pl" href="https://www.dokuwiki.org/pl:images"/> <link rel="alternate" hreflang="pt-br" href="https://www.dokuwiki.org/pt-br:images"/> <link rel="alternate" hreflang="ru" href="https://www.dokuwiki.org/ru:images"/> <link rel="alternate" hreflang="zh" href="https://www.dokuwiki.org/zh:images"/> <link rel="alternate" hreflang="x-default" href="https://www.dokuwiki.org/images"/> <script >var NS='nl';var JSINFO = {"plugins":{"edittable":{"default columnwidth":""}},"id":"nl:images","namespace":"nl","ACT":"show","useHeadingNavigation":0,"useHeadingContent":0};(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement);</script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js" defer="defer"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js" defer="defer"></script> <script src="/lib/exe/js.php?t=dokuwiki&tseed=f1005bad3d81fc9c803c7f93d32a390e&lang=nl" defer="defer"></script> <meta name="viewport" content="width=device-width,initial-scale=1" /> <link rel="shortcut icon" href="/lib/tpl/dokuwiki/images/favicon.ico" /> <link rel="apple-touch-icon" href="/lib/tpl/dokuwiki/images/apple-touch-icon.png" /> <meta name="verify-v1" content="OVxl3gsCv2MhZqh1cBQyl0JytWXSwXMjyvwc+4w3WtA=" /> <meta name="google-site-verification" content="YhTVK69hW94ZXUtc2zSLPxTkZKbZIn0zK67mz5WQB-E" />  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-83791-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-83791-1', { 'anonymize_ip': true }); </script> </head> <body> <div id="dokuwiki__site"><div id="dokuwiki__top" class="site dokuwiki mode_show tpl_dokuwiki showSidebar hasSidebar">  <header id="dokuwiki__header"><div class="pad group"> <div class="headings group"> <ul class="a11y skip"> <li><a href="#dokuwiki__content">spring naar tekst</a></li> </ul> <h1 class="logo"><a href="/start" accesskey="h" title="Home [h]"><img src="/lib/tpl/dokuwiki/images/logo.png" width="64" height="64" alt="" /><span>DokuWiki</span></a></h1> <p class="claim">It's better when it's simple</p> </div> <div class="tools group">  <div id="dokuwiki__usertools"> <h3 class="a11y">Gebruikershulpmiddelen</h3> <ul> <li class="action login"><a href="/nl:images?do=login&sectok=" title="Inloggen" rel="nofollow"><span>Inloggen</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 17.25V14H3v-4h7V6.75L15.25 12 10 17.25M8 2h9a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2v-4h2v4h9V4H8v4H6V4a2 2 0 0 1 2-2z"/></svg></a></li> </ul> </div>  <div id="dokuwiki__sitetools"> <h3 class="a11y">Site-hulpmiddelen</h3> <form action="/start" method="get" role="search" class="search doku_form" id="dw__search" accept-charset="utf-8"><input type="hidden" name="do" value="search" /><input type="hidden" name="id" value="nl:images" /><div class="no"><input name="q" type="text" class="edit" title="[F]" accesskey="f" placeholder="Zoeken" autocomplete="on" id="qsearch__in" value="" /><button value="1" type="submit" title="Zoeken">Zoeken</button><div id="qsearch__out" class="ajax_qsearch JSpopup"></div></div></form> <div class="mobileTools"> <form action="/doku.php" method="get" accept-charset="utf-8"><div class="no"><input type="hidden" name="id" value="nl:images" /><select name="do" class="edit quickselect" title="Hulpmiddelen"><option value="">Hulpmiddelen</option><optgroup label="Paginahulpmiddelen"><option value="edit">Pagina aanpassen</option><option value="revisions">Oude revisies</option><option value="backlink">Referenties</option></optgroup><optgroup label="Site-hulpmiddelen"><option value="recent">Recente aanpassingen</option><option value="media">Mediabeheerder</option><option value="index">Index</option></optgroup><optgroup label="Gebruikershulpmiddelen"><option value="login">Inloggen</option></optgroup></select><button type="submit">></button></div></form> </div> <ul> <li class="action recent"><a href="/nl:images?do=recent" title="Recente aanpassingen [r]" rel="nofollow" accesskey="r">Recente aanpassingen</a></li><li class="action media"><a href="/nl:images?do=media&ns=nl" title="Mediabeheerder" rel="nofollow">Mediabeheerder</a></li><li class="action index"><a href="/nl:images?do=index" title="Index [x]" rel="nofollow" accesskey="x">Index</a></li> </ul> </div> </div>  <div class="breadcrumbs"> <div class="trace"><span class="bchead">Spoor:</span> <span class="bcsep">•</span> <span class="curid"><bdi><a href="/nl:images" class="breadcrumbs" title="nl:images">images</a></bdi></span></div> </div> <hr class="a11y" /> </div></header> <div class="wrapper group">  <nav id="dokuwiki__aside" aria-label="Zijbalk"><div class="pad aside include group"> <h3 class="toggle">Zijbalk</h3> <div class="content"><div class="group"> <div class="notify">Deze vertaling is ouder dan de <a href="/images" class="wikilink1">originele pagina</a> en kan verouderd zijn. Kijk wat er is <a href="/images?do=diff" class="wikilink1">veranderd</a>.</div><div class="plugin_translation is-dropdown"><span class="title">Vertaling van deze pagina<sup><a href="/localization" class="wikilink1" title="localization" data-wiki-id="localization">?</a></sup>: </span><ul><li class="a"><a class="wikilink1" title="English" href="/images">English (en)</a></li><li class="a"><a class="wikilink2" title="|العربية" href="/ar:images">|العربية (ar)</a></li><li class="a"><a class="wikilink2" title="Català" href="/ca:images">Català (ca)</a></li><li class="a"><a class="wikilink2" title="Česky" href="/cs:images">Česky (cs)</a></li><li class="a"><a class="wikilink1" title="Dansk" href="/da:images">Dansk (da)</a></li><li class="a"><a class="wikilink1" title="Deutsch" href="/de:images">Deutsch (de)</a></li><li class="a"><a class="wikilink2" title="Ελληνικά" href="/el:images">Ελληνικά (el)</a></li><li class="a"><a class="wikilink2" title="Esperanto" href="/eo:images">Esperanto (eo)</a></li><li class="a"><a class="wikilink1" title="Español" href="/es:images">Español (es)</a></li><li class="a"><a class="wikilink2" title="فارسی" href="/fa:images">فارسی (fa)</a></li><li class="a"><a class="wikilink1" title="Français" href="/fr:images">Français (fr)</a></li><li class="a"><a class="wikilink2" title="עברית" href="/he:images">עברית (he)</a></li><li class="a"><a class="wikilink2" title="Magyar" href="/hu:images">Magyar (hu)</a></li><li class="a"><a class="wikilink1" title="Italiano" href="/it:images">Italiano (it)</a></li><li class="a"><a class="wikilink1" title="日本語" href="/ja:images">日本語 (ja)</a></li><li class="a"><a class="wikilink1" title="한국어" href="/ko:images">한국어 (ko)</a></li><li class="a"><a class="wikilink2" title="Lietuvių Kalba" href="/lt:images">Lietuvių Kalba (lt)</a></li><li class="span"><span class="wikilink1" title="Nederlands">Nederlands (nl)</span></li><li class="a"><a class="wikilink2" title="Norsk" href="/no:images">Norsk (no)</a></li><li class="a"><a class="wikilink1" title="Polski" href="/pl:images">Polski (pl)</a></li><li class="a"><a class="wikilink1" title="Português" href="/pt-br:images">Português (pt-br)</a></li><li class="a"><a class="wikilink2" title="Română" href="/ro:images">Română (ro)</a></li><li class="a"><a class="wikilink1" title="Русский" href="/ru:images">Русский (ru)</a></li><li class="a"><a class="wikilink2" title="Српски Језик" href="/sr:images">Српски Језик (sr)</a></li><li class="a"><a class="wikilink2" title="Svenska" href="/sv:images">Svenska (sv)</a></li><li class="a"><a class="wikilink2" title="ไทย" href="/th:images">ไทย (th)</a></li><li class="a"><a class="wikilink2" title="Українська" href="/uk:images">Українська (uk)</a></li><li class="a"><a class="wikilink1" title="中文" href="/zh:images">中文 (zh)</a></li><li class="a"><a class="wikilink2" title="繁體中文" href="/zh-tw:images">繁體中文 (zh-tw)</a></li></ul></div> <p> <strong>Leer over DokuWiki</strong> </p> <ul> <li class="level1"><div class="li"> <a href="/nl:features" class="wikilink1" title="nl:features" data-wiki-id="nl:features">Functies</a> & <a href="/blogroll" class="wikilink1" title="blogroll" data-wiki-id="blogroll">reviews</a> </div> </li> <li class="level1"><div class="li"> <a href="/nl:install" class="wikilink1" title="nl:install" data-wiki-id="nl:install">Installatiehandleiding</a></div> </li> <li class="level1"><div class="li"> <a href="/nl:manual" class="wikilink1" title="nl:manual" data-wiki-id="nl:manual">Gebruikershandleiding</a> & <a href="/nl:wiki:syntax" class="wikilink1" title="nl:wiki:syntax" data-wiki-id="nl:wiki:syntax">syntax</a></div> </li> <li class="level1"><div class="li"> <a href="/changes" class="wikilink1" title="changes" data-wiki-id="changes">Versie opmerkingen</a></div> </li> <li class="level1"><div class="li"> <a href="/nl:faq" class="wikilink1" title="nl:faq" data-wiki-id="nl:faq">FAQ</a></div> </li> </ul> <p> <strong>Geavanceerd Gebruik</strong> </p> <ul> <li class="level1"><div class="li"> <a href="/nl:extensions" class="wikilink1" title="nl:extensions" data-wiki-id="nl:extensions">Uitbreidingen</a></div> </li> <li class="level1"><div class="li"> <a href="/development" class="wikilink1" title="development" data-wiki-id="development">Ontwikkelhandleiding</a></div> </li> </ul> <p> <strong>Bedrijfsmatig Gebruik</strong> </p> <ul> <li class="level1"><div class="li"> <a href="/nl:faq:support" class="wikilink1" title="nl:faq:support" data-wiki-id="nl:faq:support">Krijg ondersteuning</a></div> </li> <li class="level1"><div class="li"> <a href="/nl:donate" class="wikilink1" title="nl:donate" data-wiki-id="nl:donate">Donaties</a></div> </li> </ul> <p> <strong>Onze Gemeenschap</strong> </p> <ul> <li class="level1"><div class="li"> <a href="/teams:getting_involved" class="wikilink1" title="teams:getting_involved" data-wiki-id="teams:getting_involved">Help mee</a></div> </li> <li class="level1"><div class="li"> <a href="http://forum.dokuwiki.org" class="urlextern" title="http://forum.dokuwiki.org">Gebruikersforum</a></div> </li> <li class="level1"><div class="li"> <a href="/nl:newsletter" class="wikilink1" title="nl:newsletter" data-wiki-id="nl:newsletter">Nieuwsbrief</a></div> </li> <li class="level1"><div class="li"> <a href="/nl:mailinglist" class="wikilink1" title="nl:mailinglist" data-wiki-id="nl:mailinglist">Ontwikkelaarsmaillijst</a></div> </li> </ul> <hr /> <p> Volg ons op <a href="http://www.facebook.com/pages/DokuWiki/52877633616" class="urlextern" title="http://www.facebook.com/pages/DokuWiki/52877633616">Facebook</a>, <a href="http://twitter.com/dokuwiki" class="urlextern" title="http://twitter.com/dokuwiki">Twitter</a> en andere <a href="/nl:social" class="wikilink1" title="nl:social" data-wiki-id="nl:social">sociale networken</a>. </p> </div></div> </div></nav>  <main id="dokuwiki__content"><div class="pad group"> <div class="pageId"><span>nl:images</span></div> <div class="page group">   <div id="dw__toc" class="dw__toc"> <h3 class="toggle">Inhoud</h3> <div> <ul class="toc"> <li class="level1"><div class="li"><a href="#afbeeldingen_en_media_invoegen">Afbeeldingen en media invoegen</a></div> <ul class="toc"> <li class="clear"> <ul class="toc"> <li class="level3"><div class="li"><a href="#uploaden">Uploaden</a></div></li> <li class="level3"><div class="li"><a href="#invoegen">Invoegen</a></div></li> </ul> </li> <li class="level2"><div class="li"><a href="#herschalen">Herschalen</a></div></li> <li class="level2"><div class="li"><a href="#linken">Linken</a></div></li> <li class="level2"><div class="li"><a href="#dynamische_afbeeldingen">Dynamische afbeeldingen</a></div></li> <li class="level2"><div class="li"><a href="#media_verwijderen">Media verwijderen</a></div></li> <li class="level2"><div class="li"><a href="#afbeeldinglinks">Afbeeldinglinks</a></div></li> <li class="level2"><div class="li"><a href="#bufferen">Bufferen</a></div></li> </ul></li> </ul> </div> </div>  <h1 class="sectionedit1" id="afbeeldingen_en_media_invoegen">Afbeeldingen en media invoegen</h1> <div class="level1"> <p> Je kunt allerlei bestanden uploaden en invoegen in <a href="/nl:dokuwiki" class="wikilink1" title="nl:dokuwiki" data-wiki-id="nl:dokuwiki">DokuWiki</a>pagina's met <a href="/nl:wiki:syntax#afbeeldingen_en_andere_bestanden" class="wikilink1" title="nl:wiki:syntax" data-wiki-id="nl:wiki:syntax">Afbeelding-syntax</a>. Afbeeldingen en flashmedia wordt meteen op de pagina weergegeven, andere bestanden (zoals PDF-bestanden) worden alleen gelinkt vanaf de pagina. Zie <a href="/nl:mime" class="wikilink1" title="nl:mime" data-wiki-id="nl:mime">mime</a> voor meer gedetailleerde informatie over hoe je dit instelt. </p> </div> <div class="secedit editbutton_section editbutton_1"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Afbeeldingen en media invoegen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="afbeeldingen_en_media_invoegen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="1-411" /><button type="submit" title="Afbeeldingen en media invoegen">Aanpassen</button></div></form></div> <h3 class="sectionedit2" id="uploaden">Uploaden</h3> <div class="level3"> <p> <a href="/_detail/wiki:mediamanager.png?id=nl%3Aimages" class="media" title="wiki:mediamanager.png"><img src="/_media/wiki:mediamanager.png?w=200&tok=b6da55" class="medialeft" loading="lazy" title="De mediabeheerder" alt="De mediabeheerder" width="200" /></a> </p> <p> <a href="/lib/exe/fetch.php?tok=bd5780&media=http%3A%2F%2Fwiki.splitbrain.org%2Flib%2Fimages%2Ftoolbar%2Fimage.png" class="media" title="http://wiki.splitbrain.org/lib/images/toolbar/image.png"><img src="/lib/exe/fetch.php?tok=bd5780&media=http%3A%2F%2Fwiki.splitbrain.org%2Flib%2Fimages%2Ftoolbar%2Fimage.png" class="media" loading="lazy" alt="" /></a> Uploaden van nieuwe bestanden wordt gedaan met de <a href="/nl:media_manager" class="wikilink1" title="nl:media_manager" data-wiki-id="nl:media_manager">mediabeheerder</a> die je opent vanaf de <a href="/nl:toolbar" class="wikilink1" title="nl:toolbar" data-wiki-id="nl:toolbar">werkbalk</a>. </p> <p> Gebruik het uploadformulier rechtsboven om een bestand te uploaden. Een nieuwe bestandsnaam is optioneel. Wees er zeker van dat de bestandextensie klopt! Als je een nieuwe <a href="/nl:namespaces" class="wikilink1" title="nl:namespaces" data-wiki-id="nl:namespaces">namespace</a> gebruikt in de naam wordt deze automatisch aangemaakt. </p> <p> Merk alsjeblieft op: Als de beheerder <a href="/nl:acl" class="wikilink1" title="nl:acl" data-wiki-id="nl:acl">ACL</a> ondersteuning inschakelt, kan uploaden worden beperkt voor bepaalde gebruikers. Gebruikers zonder de juiste permissies zullen het uploadformulier niet zien. </p> </div> <div class="secedit editbutton_section editbutton_2"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Uploaden] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="uploaden" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="412-1126" /><button type="submit" title="Uploaden">Aanpassen</button></div></form></div> <h3 class="sectionedit3" id="invoegen">Invoegen</h3> <div class="level3"> <p> Met <code>{{}}</code> kun je media invoegen. </p> <pre class="code">{{wiki:dokuwiki-128.png}}</pre> <p> Een afbeelding <a href="/_detail/wiki:dokuwiki-128.png?id=nl%3Aimages" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=30&tok=739ef5" class="media" loading="lazy" alt="" width="30" /></a> wordt weergegeven en andere media <a href="/_media/wiki:text2html.rc" class="media mediafile mf_rc" title="wiki:text2html.rc (930 B)">text2html.rc</a> geven alleen een link met bijpassend icoon. </p> <p> En met een <code>|</code> voeg je de titel toe </p> <pre class="code">{{wiki:dokuwiki-128.png</pre> <p> <a href="/_detail/wiki:dokuwiki-128.png?id=nl%3Aimages" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=30&tok=739ef5" class="media" loading="lazy" title="Het DokuWiki-logo" alt="Het DokuWiki-logo" width="30" /></a>Beweeg over de afbeelding voor de tooltip met de titel. </p> <p> Hoe afbeeldingen worden ingevoegd in een pagina kan met verschillende parameters worden bepaald. Parameters worden in <abbr title="Uniform Resource Locator">URL</abbr>-stijl toegevoegd door het toevoegen van een vraagteken (?) en meerdere parameters worden gescheiden met een ampersand (&). </p> </div> <div class="secedit editbutton_section editbutton_3"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Invoegen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="invoegen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="1127-1775" /><button type="submit" title="Invoegen">Aanpassen</button></div></form></div> <h2 class="sectionedit4" id="herschalen">Herschalen</h2> <div class="level2"> <p> DokuWiki kan afbeeldingen herschalen met twee methodes. Standaard zal het PHP's libGB ondersteuning gebruiken als die is geïnstalleerd. Betere resultaten worden bereikt met de <a href="/config:im_convert" class="wikilink1" title="config:im_convert" data-wiki-id="config:im_convert">imagemagick</a> command line tool. </p> <p> Als libGB wordt gebruik, kan het herschalen mislukken doordat er te weinig geheugen beschikbaar is of doordat het afbeeldingsformaat niet wordt ondersteund door de geïnstalleerde libGB versie. </p> <p> Voor herschalen van externe afbeeldingen, moeten ze worden gebufferd op jouw server. Omdat te doen moet je DokuWiki toestaan externe afbeeldingen te downloaden door de bestandsgroottebeperking te vergroten met de <a href="/config:fetchsize" class="wikilink1" title="config:fetchsize" data-wiki-id="config:fetchsize">fetchsize</a> optie. </p> <p> Om afbeelding proportioneel te schalen geef je de gewenste breedte op in pixels: </p> <pre class="code">{{wiki:dokuwiki-128.png?20}}</pre> <p> <a href="/_detail/wiki:dokuwiki-128.png?id=nl%3Aimages" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=20&tok=6e3b79" class="medialeft" loading="lazy" alt="" width="20" /></a> Deze afbeelding is geschaald naar een breedte van 20 pixels. </p> <p> Wanneer je een breedte en een hoogte geeft, zal de afbeelding precies naar die hoogte worden geschaald, en zal de breedte-hoogteverhouding worden genegeerd. </p> <pre class="code">{{wiki:dokuwiki-128.png?20x50}}</pre> <p> <a href="/_detail/wiki:dokuwiki-128.png?id=nl%3Aimages" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=20&h=50&tok=506fdd" class="medialeft" loading="lazy" alt="" width="20" height="50" /></a> Deze afbeelding is geschaald naar een breedte van 20 pixels en een hoogte van 50 pixels. </p> <p> In DokuWiki 2009-02-14 en later, zal het geven van breedte én hoogte de afbeelding bijknippen voor het schalen om te voorkomen dat de afbeelding vervormd wordt. </p> </div> <div class="secedit editbutton_section editbutton_4"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Herschalen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="herschalen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="1776-3152" /><button type="submit" title="Herschalen">Aanpassen</button></div></form></div> <h2 class="sectionedit5" id="linken">Linken</h2> <div class="level2"> <p> <a href="/nl:dokuwiki" class="wikilink1" title="nl:dokuwiki" data-wiki-id="nl:dokuwiki">DokuWiki</a> staat je toe om afbeeldingen in een pagina te plaatsen die ook naar een pagina verwijzen met meer details over de pagina of naar een pagina die de volledige afbeelding laat zien. Ook kun je afbeeldingen plaatsen die niet naar andere pagina's verwijzen. </p> <p> Standaard, zal het klikken op een afbeelding de “detail”pagina tonen. De detailpagina is een weergave van het <code>detail.php</code>-templatebestand. Het standaard <code>detail.php</code>-bestand laat een grote versie van de afbeelding zien met daarnaast een lijst van EXIF en IPTC metadata zoals opgeslagen in de afbeelding (zoals bijvoorbeeld afbeeldingtekst, auteur, opnamedatum, etc.), en andere beschrijvende informatie. </p> <p> De volgende syntax voegt een afbeelding in de pagina op de volle grootte, en klikken op deze afbeelding levert een detailpagina met de metadata van de afbeelding: </p> <pre class="code">{{wiki:dokuwiki-128.png}}</pre> <p> <a href="/_detail/wiki:dokuwiki-128.png?id=nl%3Aimages" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=20&tok=6e3b79" class="media" loading="lazy" alt="" width="20" /></a> Klik op deze geschaalde afbeelding om zijn detailpagina te zien. </p> <p> Je kunt op de afbeelding op de detailpagina klikken om de afbeelding op originele grootte te bekijken. Vaak zul je de afbeelding invoegen op de pagina met kleine afmetingen, dit laten verwijzen naar de detailpagina met een middelgrote afbeelding en die verwijst uiteindelijk naar het originele bestand. </p> <p> Je kunt in plaats hiervan een afbeelding invoegen die direct verwijst naar het originele bestand. Dit wordt een “direct” link genoemd, en wordt aangegeven met de <code>direct</code> optie achter de afbeeldingnaam: </p> <pre class="code">{{wiki:dokuwiki-128.png?direct}}</pre> <p> <a href="/_media/wiki:dokuwiki-128.png" class="media" title="wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png?w=20&tok=6e3b79" class="medialeft" loading="lazy" alt="" width="20" /></a>Klik op deze geschaalde afbeelding om meteen het origineel te bekijken. </p> <p> Het is mogelijk om een afbeelding in te voegen in de pagina zonder verdere verwijzingen. Dit bereik je met de <code>nolink</code> optie achter de afbeeldingsnaam. </p> <pre class="code">{{wiki:dokuwiki-128.png?nolink}}</pre> <p> <img src="/_media/wiki:dokuwiki-128.png?w=20&tok=6e3b79" class="medialeft" loading="lazy" alt="" width="20" />Probeer op deze afbeelding te klikken. Hé dat lukt niet, huh? </p> <p> Je kunt ook de <code>nolink</code> en herschaal parameters combineren door er een ampersand '&' tussen te plaatsen: </p> <pre class="code">{{wiki:dokuwiki-128.png?nolink&100}}</pre> <p> <img src="/_media/wiki:dokuwiki-128.png?w=100&tok=f4967e" class="media" loading="lazy" alt="" width="100" /> </p> <p> Als je alleen een link naar de afbeelding wilt, zonder de afbeelding weer te geven op de wikipagina, moet je de <code>linkonly</code>optie gebruiken: </p> <pre class="code">{{wiki:dokuwiki-128.png?linkonly}}</pre> <p> <a href="/_media/wiki:dokuwiki-128.png" class="media mediafile mf_png" title="wiki:dokuwiki-128.png (27.2 KB)">dokuwiki-128.png</a> Dit is alleen een link naar de afbeelding. </p> </div> <div class="secedit editbutton_section editbutton_5"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Linken] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="linken" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="3153-5530" /><button type="submit" title="Linken">Aanpassen</button></div></form></div> <h2 class="sectionedit6" id="dynamische_afbeeldingen">Dynamische afbeeldingen</h2> <div class="level2"> <p> Soms wil je dynamische afbeeldingen invoegen zoals <a href="http://kalsey.com/tools/buttonmaker/button.php?barPosition=50&leftText=Dynamic&leftTextColor=ffffff&rightText=IMG&rightTextPosition=54" class="urlextern" title="http://kalsey.com/tools/buttonmaker/button.php?barPosition=50&leftText=Dynamic&leftTextColor=ffffff&rightText=IMG&rightTextPosition=54">deze afbeelding</a> </p> <p> De standaard methode proberen: </p> <pre class="code">{{http://kalsey.com/tools/buttonmaker/button.php?barPosition=50&leftText=Dynamic&leftTextColor=ffffff&rightText=IMG&rightTextPosition=54}}</pre> <p> werkt echter niet: </p> <p> <a href="/lib/exe/fetch.php?tok=10f402&media=http%3A%2F%2Fkalsey.com%2Ftools%2Fbuttonmaker%2Fbutton.php" class="media mediafile mf_php" title="http://kalsey.com/tools/buttonmaker/button.php">button.php</a> </p> <p> Dit is omdat <a href="/nl:dokuwiki" class="wikilink1" title="nl:dokuwiki" data-wiki-id="nl:dokuwiki">DokuWiki</a> aanneemt dat de afbeelding eindigt met <code>.gif</code>,<code>.jpg</code> of <code>.png</code>, maar dit bestand eindigt met <code>.php</code>. De truc is om extra CGI paramters toe te voegen zoals deze: <code>&.png</code> – de CGI zal de onbekende parameter negeren, maar DokuWiki weet nu dat het een afbeelding is. </p> <p> Je moet aan het uiteinde ook een extra vraagteken toevoegen, want anders denkt DokuWiki dat de CGI parameters bufferopties zijn. </p> <p> <a href="/lib/exe/fetch.php?tok=4f9752&media=http%3A%2F%2Fkalsey.com%2Ftools%2Fbuttonmaker%2Fbutton.php%3FbarPosition%3D50%26leftText%3DDynamic%26leftTextColor%3Dffffff%26rightText%3DIMG%26rightTextPosition%3D54%26.png" class="media" title="http://kalsey.com/tools/buttonmaker/button.php?barPosition=50&leftText=Dynamic&leftTextColor=ffffff&rightText=IMG&rightTextPosition=54&.png"><img src="/lib/exe/fetch.php?tok=4f9752&media=http%3A%2F%2Fkalsey.com%2Ftools%2Fbuttonmaker%2Fbutton.php%3FbarPosition%3D50%26leftText%3DDynamic%26leftTextColor%3Dffffff%26rightText%3DIMG%26rightTextPosition%3D54%26.png" class="media" loading="lazy" alt="" /></a> </p> <pre class="code">{{http://kalsey.com/tools/buttonmaker/button.php?barPosition=50&leftText=Dynamic&leftTextColor=ffffff&rightText=IMG&rightTextPosition=54&.png?}}</pre> <p> NB: Je kunt knoppenmakers webfrontends vinden op </p> <ul> <li class="level1"><div class="li"> <a href="http://www.yugatech.com/make.php" class="urlextern" title="http://www.yugatech.com/make.php">http://www.yugatech.com/make.php</a></div> </li> <li class="level1"><div class="li"> <a href="http://kalsey.com/tools/buttonmaker/" class="urlextern" title="http://kalsey.com/tools/buttonmaker/">http://kalsey.com/tools/buttonmaker/</a></div> </li> </ul> </div> <div class="secedit editbutton_section editbutton_6"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Dynamische afbeeldingen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="dynamische_afbeeldingen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="5531-6964" /><button type="submit" title="Dynamische afbeeldingen">Aanpassen</button></div></form></div> <h2 class="sectionedit7" id="media_verwijderen">Media verwijderen</h2> <div class="level2"> <p> Soms is het nodig om media weg te gooien, die eerder is geupload. Hiervoor moet de <a href="/nl:acl" class="wikilink1" title="nl:acl" data-wiki-id="nl:acl">ACL</a> functie ingeschakeld zijn en moet de gebruiker die bestanden wil verwijderen de <code>DELETE</code> permissie hebben. De bestanden kunnen worden verwijderd met de prullenbak-knop. </p> <p> Zie ook: <a href="/faq:deletemedia" class="wikilink1" title="faq:deletemedia" data-wiki-id="faq:deletemedia">verwijderen van mediabestanden</a> </p> </div> <div class="secedit editbutton_section editbutton_7"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Media verwijderen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="media_verwijderen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="6965-7319" /><button type="submit" title="Media verwijderen">Aanpassen</button></div></form></div> <h2 class="sectionedit8" id="afbeeldinglinks">Afbeeldinglinks</h2> <div class="level2"> <p> Om een afbeelding naar andere bronnen te laten verwijzen moet simpel een link plaatsen om de afbeelding, net zoals je anders tekst klikbaar maakt. </p> <p> Voorbeeld: <a href="http://www.google.com" class="media" title="http://www.google.com"><img src="/_media/wiki:dokuwiki-128.png" class="media" loading="lazy" alt="" /></a> </p> <pre class="code">Voorbeeld: [[http://www.google.com|{{wiki:dokuwiki-128.png}}]]</pre> <p> Als de afbeeldinglink verwijst naar lokale media (zoals a .pdf), kun je de volgende syntax gebruiken: </p> <p> Voorbeeld: <a href="https://www.dokuwiki.org/_media/wiki:dokuwiki-128.png" class="media" title="https://www.dokuwiki.org/_media/wiki:dokuwiki-128.png"><img src="/_media/wiki:dokuwiki-128.png" class="media" loading="lazy" alt="" /></a> </p> <pre class="code"> Voorbeeld: [[this>_media/wiki:dokuwiki-128.png|{{wiki:dokuwiki-128.png}}]]</pre> </div> <div class="secedit editbutton_section editbutton_8"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Afbeeldinglinks] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="afbeeldinglinks" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="7320-7890" /><button type="submit" title="Afbeeldinglinks">Aanpassen</button></div></form></div> <h2 class="sectionedit9" id="bufferen">Bufferen</h2> <div class="level2"> <p> Om de prestaties voor de gebruiker te verbeteren, probeert DokuWiki externe bestanden te bufferen. Als je externe bestanden wilt gebruiken zonder bufferen kun de <code>nocache</code>parameter toevoegen: </p> <pre class="code">{{http://de3.php.net/images/php.gif?nocache}}</pre> <p> Je kunt dit ook combineren met herschalen: </p> <pre class="code">{{http://de3.php.net/images/php.gif?300x50&nocache}}</pre> <p> Om voor elke paginavernieuwing een externe server te raadplegen voor afbeeldingen is niet erg netjes. In plaats daarvan kun je de parameter <code>recache</code> gebruiken om DokuWiki een afbeelding te laten herbufferen met een interval zoals gespecificeerd met de <a href="/config:cachetime" class="wikilink1" title="config:cachetime" data-wiki-id="config:cachetime">cachetime configuratie optie</a>: </p> <pre class="code">{{http://de3.php.net/images/php.gif?recache}}</pre> </div> <div class="secedit editbutton_section editbutton_9"><form class="button btn_secedit" method="post" action="/nl:images"><div class="no"><input type="hidden" name="do" value="edit" /><input type="hidden" name="rev" value="1357937273" /><input type="hidden" name="summary" value="[Bufferen] " /><input type="hidden" name="target" value="section" /><input type="hidden" name="hid" value="bufferen" /><input type="hidden" name="codeblockOffset" value="0" /><input type="hidden" name="range" value="7891-" /><button type="submit" title="Bufferen">Aanpassen</button></div></form></div>  </div> <div class="docInfo"><bdi>nl/images.txt</bdi> · Laatst gewijzigd: <time datetime="2013-01-11T21:47:53+0100">2013-01-11 21:47</time> door <bdi>Klap-in</bdi></div> <hr class="a11y" /> </div></main>  <nav id="dokuwiki__pagetools" aria-labelledby="dokuwiki__pagetools__heading"> <h3 class="a11y" id="dokuwiki__pagetools__heading">Paginahulpmiddelen</h3> <div class="tools"> <ul> <li class="edit"><a href="/nl:images?do=edit" title="Pagina aanpassen [e]" rel="nofollow" accesskey="e"><span>Pagina aanpassen</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg></a></li><li class="revs"><a href="/nl:images?do=revisions" title="Oude revisies [o]" rel="nofollow" accesskey="o"><span>Oude revisies</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 7v5.11l4.71 2.79.79-1.28-4-2.37V7m0-5C8.97 2 5.91 3.92 4.27 6.77L2 4.5V11h6.5L5.75 8.25C6.96 5.73 9.5 4 12.5 4a7.5 7.5 0 0 1 7.5 7.5 7.5 7.5 0 0 1-7.5 7.5c-3.27 0-6.03-2.09-7.06-5h-2.1c1.1 4.03 4.77 7 9.16 7 5.24 0 9.5-4.25 9.5-9.5A9.5 9.5 0 0 0 12.5 2z"/></svg></a></li><li class="backlink"><a href="/nl:images?do=backlink" title="Referenties" rel="nofollow"><span>Referenties</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10.59 13.41c.41.39.41 1.03 0 1.42-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0 5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24 2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24m2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0 5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24 2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24.973.973 0 0 1 0-1.42z"/></svg></a></li><li class="top"><a href="#dokuwiki__top" title="Terug naar boven [t]" rel="nofollow" accesskey="t"><span>Terug naar boven</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12z"/></svg></a></li> </ul> </div> </nav> </div>  <footer id="dokuwiki__footer"><div class="pad"> <div class="license">Tenzij anders vermeld valt de inhoud van deze wiki onder de volgende licentie: <bdi><a href="https://creativecommons.org/licenses/by-sa/4.0/deed.en" rel="license" class="urlextern">CC Attribution-Share Alike 4.0 International</a></bdi></div> <div class="buttons"> <a href="https://creativecommons.org/licenses/by-sa/4.0/deed.en" rel="license"><img src="/lib/images/license/button/cc-by-sa.png" alt="CC Attribution-Share Alike 4.0 International" /></a> <a href="https://www.dokuwiki.org/donate" title="Donate" ><img src="/lib/tpl/dokuwiki/images/button-donate.gif" width="80" height="15" alt="Donate" /></a> <a href="https://php.net" title="Powered by PHP" ><img src="/lib/tpl/dokuwiki/images/button-php.gif" width="80" height="15" alt="Powered by PHP" /></a> <a href="//validator.w3.org/check/referer" title="Valid HTML5" ><img src="/lib/tpl/dokuwiki/images/button-html5.png" width="80" height="15" alt="Valid HTML5" /></a> <a href="//jigsaw.w3.org/css-validator/check/referer?profile=css3" title="Valid CSS" ><img src="/lib/tpl/dokuwiki/images/button-css.png" width="80" height="15" alt="Valid CSS" /></a> <a href="https://dokuwiki.org/" title="Driven by DokuWiki" ><img src="/lib/tpl/dokuwiki/images/button-dw.png" width="80" height="15" alt="Driven by DokuWiki" /></a> </div> <div style="margin-top: 2em; font-size:90%" class="dokuwiki"><div style="float:right"><a href="http://www.splitbrain.org/personal#imprint" style="float:right; text-decoration: none; color:#333">Imprint</a></div></div> <style type="text/css"> @media screen { body { padding-top: 30px; } #global__header { position: absolute; top: 0; left: 0; text-align: left; vertical-align: middle; line-height: 1.5; background-color: #333; box-shadow: 0 0 8px rgba(0,0,0,0.5); width: 100%; margin: 0; padding: 5px 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; white-space: nowrap; overflow: hidden; } #global__header h2 { position: absolute; left: -99999em; top: 0; overflow: hidden; display: inline; } #global__header ul, #global__header li { margin: 0; padding: 0; list-style: none; display: inline; line-height: 1.5; } #global__header a { color: #bbb; text-decoration: none; margin-right: 20px; font-size: 14px; font-weight: normal; } #global__header a:hover, #global__header a:active, #global__header a:focus { color: #fff; text-decoration: underline; } #global__header form { float: right; margin: 0 0 0 20px; } #global__header input { background-color: #333; background-image: none; border: 1px solid #bbb; color: #fff; box-shadow: none; border-radius: 2px; margin: 0; line-height: normal; padding: 1px 0 1px 0; height: auto; } #global__header input.button { border: none; color: #bbb; } #global__header input.button:hover, #global__header input.button:active, #global__header input.button:focus { color: #fff; text-decoration: underline; } } /* /@media */ @media only screen and (min-width: 601px) { /* changes specific for www.dokuwiki.org */ #dokuwiki__header { padding-top: 3em; } #dokuwiki__usertools { top: 3em; } /* changes specific for bugs.dokuwiki.org */ div#container div#showtask { top: 40px; } } /* /@media */ @media only screen and (max-width: 600px) { body { padding-top: 0; } #global__header { position: static; white-space: normal; overflow: auto; } #global__header form { float: none; display: block; margin: 0 0 .4em; } } /* /@media */ @media print { #global__header { display: none; } } /* /@media */ </style> <div id="global__header"> <h2>Global DokuWiki Links</h2> <form method="get" action="https://search.dokuwiki.org/" target="_top"> <input type="text" name="q" title="Search all DokuWiki sites at once" class="input" /> <input type="submit" title="Search all DokuWiki sites at once" value="Search" class="button" /> </form> <ul> <li><a href="https://download.dokuwiki.org" title="Download the latest release" target="_top">Download</a></li> <li><a href="https://www.dokuwiki.org" title="Read the DokuWiki documentation" target="_top">Wiki</a></li> <li><a href="https://forum.dokuwiki.org" title="Ask questions in the DokuWiki forum" target="_top">Forum</a></li> <li><a href="https://irc.dokuwiki.org" title="Check IRC chat logs or join the chat" target="_top">IRC</a></li> <li><a href="https://github.com/splitbrain/dokuwiki/issues" title="Report and track bugs" target="_top">Bugs</a></li> <li><a href="https://translate.dokuwiki.org/" title="Help translating the DokuWiki interface" target="_top">Translate</a></li> <li><a href="https://github.com/splitbrain/dokuwiki" title="Access the most recent git commits" target="_top">Git</a></li> <li><a href="https://xref.dokuwiki.org/reference/dokuwiki/" title="Cross-Reference of the DokuWiki source code" target="_top">XRef</a></li> <li><a href="https://codesearch.dokuwiki.org/" title="Search through the sources of DokuWiki, plugins and templates" target="_top">Code Search</a></li> </ul> </div>  </div></footer> </div></div> <div class="no"><img src="/lib/exe/taskrunner.php?id=nl%3Aimages&1742416512" width="2" height="1" alt="" /></div> <div id="screen__mode" class="no"></div></body> </html>