Visa källa för Zettlr

[[Kategori:Datorer_Data_och_Program]]

= Vad är Zettlr =
[https://docs.zettlr.com/en/ Zettlrs manual]

= Fusklapp =
<pre>
**Fet text**
*Kursiv text*
* punkt1
* punkt2
1. nummerlista
2. nummerlista
länk: [Ubuntu](https://ubuntu.com)
</pre>

Kod kan skrivas antingen "inline" på samma rad, detta skrivs med <code>`text`</code>

Eller i ett eget block:<br />
<code>```sudo apt update<br />
sudo apt upgrade```</code>


=Skapa kolumner=
<table border="0"><tr>
<td>
<pre>
:::::::::::::: {.columns}</pre></td><td> <-- Ja, det skall vara 14 kolon.</td></tr>
<tr><td><pre>::: {.column width="60%"}</pre></td><td> <-- Första kol. (vänster)</td></tr>
<tr><td colspan="2">Innehåll i första kolumnen...</td></tr>
<tr><td><pre>:::</pre></td><td> <-- Slut på kolumn</td></tr>
<tr><td><pre>::: {.column width="40%"}</pre></td><td> <-- kol. 2</td></tr>
<tr><td colspan="2">Innehåll till höger...</td></tr>
<tr><td><pre>:::</pre></td><td> <-- Slut på kolumn</td></tr>
<tr><td><pre>::::::::::::::</pre></td><td> <-- Slut på kolumner (tabell)</td></tr>
</table>

= Infoga bild =
<pre>
![](sökväg/till/bild.png)
</pre>


= Sidbrytning =
Enkelt, stoppa in en helt vanlig HTML-div:
<pre>
<div style="page-break-after: always;"></div>
</pre>
Detta gäller särskilt (bara?) om du exporterar med "Simple PDF"


= Annat pappersformat =
Då lägger vi in ett slags stylesheet<br />
Lägg detta allra överst i filen:
<pre>
---
header-includes:
  - |
    <style>
    @page {
        size: A4 portrait;
        margin: 0.1cm;
    }
    </style>
---
</pre>
Inne i ''style'' kan vi lägga in andra element också, tillexempel sidnumrering:
<pre>
---
header-includes:
  - |
    <style>
    @page {
        size: A4 portrait;
        margin: 1cm;
        @bottom-center {
            content: counter(page);
            font-family: sans-serif;
            font-size: 10pt;
            color: #555555;
        }
    }
    @page :first {
    @bottom-center {
        content: ""; /* Gör sidnumret tomt på första sidan */
        }
    }
    </style>
---
</pre>
'''OBSERVERA!'''
Otroligt viktigt med antal mellanslag i början av raden.<br />
Måste vara fyra(4) mellanslag, annars blir det mycket knasigt vid konvertering till PDF.

= Skapa innehållsförteckning =
Om en rubrik ser ut så här:<br />
<code># 1. Introduktion& Systemkrav!</code><br />
Så skapar vi länken i förteckningen så här:<br />
<code>* [1. Introduktion & Systemkrav](#1-introduktion--systemkrav)</code><br />

Regeln är:
* Små bokstäver överallt
* Ersätt å, ä, ö med a, a, o.
* Ta bort specialtecken som punkter, kommatecken och kolon.
* Ersätt mellanslag med bindestreck -.
* Sätt ett #-tecken framför i själva länken.
''Notera att et-tecknet & och utropstecknet försvann, och dubbla mellanslag blev dubbla bindestreck''

= Inline CSS =
Man kan ha väldigt roligt med inline-CSS också.<br />
Exempelvis för att göra en liten "Author"-ruta, eller en extra sidfot, mm som inte stör sidans layout.
<pre>
<div style="position:absolute; top: -1.3cm; font-family: sans-serif; font-size: 11pt; color: #555555; border-top: 1px solid #8cb059; padding-top: 10px; margin-top: 50px;"> <strong>Författare:</strong> Ditt Namn<br /> <strong>Datum:</strong> 2026-07-11<br /> <strong>Version:</strong> 1.0 </div>
<div style="position: absolute; bottom: 0cm; right: -1cm; width: 6cm; color: #8cb059; font-family: sans-serif; font-size: 8pt;"> <strong>Dokument-ID:</strong> SEC-404<br /> <strong>Klassning:</strong> Intern </div>
</pre>
Här får man leka lite med placeringen för att få det bra.<br />
Om sidmarginalen är satt till 2cm, är 0 ''vid'' denna marginal.<br />
För att tvinga div:en utanför marginalen, måste negativa värden användas.<br />
Tänk på skrivarmarginaler, samt om ditt dokument printas på hålat papper...