> For the complete documentation index, see [llms.txt](https://docs.dibbel.no/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.dibbel.no/brukerveiledninger/for-nettsiden/funksjoner/ressursmaler/rapportmal/variabler/detaljert-bruk-av-variabler/bilder-i-variabler.md).

# Bilder i variabler

### Hva er bildevariabler?

Bildevariabler lar deg sette inn bilder automatisk i maler. Systemet henter bilder som er knyttet til prosjektet, ressursen eller avdelingen, og plasserer dem på riktig sted i dokumentet når malen genereres. Slik kan du enkelt legge til prosjektbilder, dokumentasjonsbilder eller firmalogog uten å legge dem inn manualt. <br>

### Hvordan fungerer det?

Når du setter inn en bildevariabel i en mal, vil systemet hente bildene fra de feltene som er koblet til variabelen. For eksempel vil en mal som bruker `{%bilde}` hente bildet som er lastet opp på ressursen, mens `{%departmentLogo}` henter logoen til avdelingen automatisk.

### Forutsetninger for bildeopplasting

For at bildevariabler skal fungere på riktig og vise de bildene du ønsker, må bildene være lastet opp i Dibbel på forhånd. Hvor du laster bildene opp, avhenger av hvilken bildevariabel du bruker.

**Eksempel**

Under ser du hvordan en bildevariabel brukes i en mal, og hvordan bildet vises automatisk i dokumentet.

**Ett bilde**

`{%bilde}`\
Brukes når du skal hente inn ett enkelt bilde.

**Flere bilder (iterator)**

`{#bilder}{%.}{/}`\
Brukes når en ressurs har flere bilder knyttet til seg. Iteratoren henter alle bildene i listen, og du kan eventuelt sortere dem.

**Logo**

`{%departmentLogo}`\
Brukes for å hente inn logoen til en bedrift eller avdeling automatisk.

**Logo med størrelse**

`{%departmentLogo | maxSize:800:30}`\
Samme som over, men her setter du en maks bredde og høyde (800 x 30) slik at logoen får riktig størrelse i dokumentet.

### Eksempel: Laste opp logo i mal

Når du legger til en logo i en mal, hentes den fra virksomheten eller avdelingen dokumentet tilhører. Når malen genereres, plasseres logoen automatisk på det stedet der du har lagt inn logo-variabelen.&#x20;

**Før du laster opp**: For at logoen skal vises riktig, og i det hele tatt være synlig, må logoen først være lastet opp i Dibbel.&#x20;

For å laste opp logo, går du til **"Innstillinger"** som er å finne ved en nedre delen i hovedmenyen, ved tannhjul-ikonet <img src="/files/2y3yUiPVfHTMwISwny1g" alt="" data-size="line">.&#x20;

* Du kan laste opp eller endre bildet i det nederste feltet i **"Informasjon om avdelingen":**&#x20;

<figure><img src="/files/8ZHre541t0sLVxgQQQon" alt=""><figcaption></figcaption></figure>

* Avslutt med å lagre endringene.&#x20;

#### Legg til logo i malen

{% stepper %}
{% step %}

### Hent variabel

* Finn riktig variabel for logo. Dette kan du gjøre fra **"Ressursmaler",** der du videre går til skjemabyggeren.&#x20;
* Klikk på **"Variabler"**

<div align="left"><figure><img src="/files/S9txlmRvb8ZWjggOpqIF" alt="" width="319"><figcaption></figcaption></figure></div>

* Velg riktig del, eksempelvis **"Avdeling"** og videre **"Avdeling logo"**.&#x20;

<div align="left"><figure><img src="/files/EjJuQc3dX85YP3p2SETv" alt="" width="357"><figcaption></figcaption></figure></div>

* Velg riktig funksjon til ditt tilfelle, eksempelvis funksjon med maks størrelse,&#x20;

<div align="left"><figure><img src="/files/EkSnm7m9VkJl63hElZz7" alt="" width="375"><figcaption></figcaption></figure></div>

* Kopier variabel ved å klikke på kopier-ikonet.&#x20;

{% endstep %}

{% step %}

### Åpne og sett inn i word-malen

* Åpne word-dokumentet du skal lage malen i.&#x20;
* Plassér markøren der du vil at logoen skal vises og lim inn variabelen.

<div align="left"><figure><img src="/files/R4nhkt4IRGHgbPmYiwpo" alt="" width="375"><figcaption></figcaption></figure></div>

{% endstep %}

{% step %}

### Lagre og last opp malen i Dibbel

* Lagre malen og last den opp i Dibbel

<div align="left"><figure><img src="/files/U0EuYxMPlddgQz76YB2U" alt="" width="342"><figcaption></figcaption></figure></div>

* Før inn navn på mal, og eventuelt andre nødvendige funksjoner som skal være med i malen.
* Klikk på publiser for å lagre malen.&#x20;

<div align="left"><figure><img src="/files/VhfjRp9oL5DUcNTKmqyy" alt="" width="372"><figcaption></figcaption></figure></div>

* For å se hvordan logogen ser ut, kan du klikke på **"Forhåndsvis"**. *For at dette skal være mulig, må du ha publisert malen i forkant.*

<div align="left"><figure><img src="/files/7BOC16tEgZ8jkoREGjUq" alt="" width="375"><figcaption></figcaption></figure></div>

<div align="left"><figure><img src="/files/B1saoj37Ysd6jWJW9DIw" alt="" width="253"><figcaption></figcaption></figure></div>

{% endstep %}
{% endstepper %}

### Laste opp bilde i mal

For å laste opp bilder i en mal kan du velge mellom å bruke variabler eller iteratorer, avhengig av om du skal laste opp ett bilde eller flere. Se [#forutsetninger-for-bildeopplasting](#forutsetninger-for-bildeopplasting "mention") for å finne ut hvilken metode du skal bruke.&#x20;

Under ser du en demo som viser opplasting av både ett bilde og flere bilder, ved hjelp av variabel og iterator.

{% hint style="info" %}
I denne demoen vises forskjellen mellom å bruke en variabel for ett bilde og en iterator for flere bilder. I praksis kunne du også ha brukt en iterator alene hvis du kun skal laste opp flere bilder.
{% endhint %}

{% embed url="<https://app.supademo.com/demo/cmhn6f2yw03c5200ili4lnfyi?utm_source=link>" %}