Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-08-10 18:39:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(docs): document note source (viewing & editing)

Browse Source
This commit is contained in:
Elian Doran 2025-03-29 11:52:08 +02:00
parent 7be71fc6fa
commit fbfeb7d2bf
No known key found for this signature in database
17 changed files with 747 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

245
docs/User Guide/!!!meta.json
View File

@ -1400,6 +1400,193 @@
"format": "markdown",
"dataFileName": "Bulk actions.md",
"attachments": []
},
{
"isClone": false,
"noteId": "4FahAwuGTAwC",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"4FahAwuGTAwC"
],
"title": "Note source",
"notePosition": 160,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [
{
"type": "relation",
"name": "internalLink",
"value": "KSZ04uQ2D1St",
"isInheritable": false,
"position": 10
},
{
"type": "relation",
"name": "internalLink",
"value": "_optionsTextNotes",
"isInheritable": false,
"position": 20
},
{
"type": "relation",
"name": "internalLink",
"value": "_optionsCodeNotes",
"isInheritable": false,
"position": 30
},
{
"type": "relation",
"name": "internalLink",
"value": "MI26XDLSAlCD",
"isInheritable": false,
"position": 40
},
{
"type": "relation",
"name": "internalLink",
"value": "81SGnPGMk7Xc",
"isInheritable": false,
"position": 50
},
{
"type": "relation",
"name": "internalLink",
"value": "grjYqerjn243",
"isInheritable": false,
"position": 60
},
{
"type": "relation",
"name": "internalLink",
"value": "gBbsAeiuUxI5",
"isInheritable": false,
"position": 70
},
{
"type": "relation",
"name": "internalLink",
"value": "N4IDkixaDG9C",
"isInheritable": false,
"position": 80
},
{
"type": "relation",
"name": "internalLink",
"value": "H0mM1lTxF9JI",
"isInheritable": false,
"position": 90
},
{
"type": "relation",
"name": "internalLink",
"value": "Wxt3vVlxlYLi",
"isInheritable": false,
"position": 100
},
{
"type": "relation",
"name": "internalLink",
"value": "8YBEPzcpUgxw",
"isInheritable": false,
"position": 110
}
],
"format": "markdown",
"dataFileName": "Note source.md",
"attachments": [
{
"attachmentId": "Ud3rPUVJpRWJ",
"title": "image.png",
"role": "image",
"mime": "image/png",
"position": 10,
"dataFileName": "Note source_image.png"
}
]
},
{
"isClone": false,
"noteId": "1YeN2MzFUluU",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU"
],
"title": "Technologies used",
"notePosition": 170,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "markdown",
"attachments": [],
"dirFileName": "Technologies used",
"children": [
{
"isClone": false,
"noteId": "MI26XDLSAlCD",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"MI26XDLSAlCD"
],
"title": "CKEditor",
"notePosition": 10,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "markdown",
"dataFileName": "CKEditor.md",
"attachments": []
},
{
"isClone": false,
"noteId": "N4IDkixaDG9C",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"N4IDkixaDG9C"
],
"title": "MindElixir",
"notePosition": 20,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "markdown",
"dataFileName": "MindElixir.md",
"attachments": []
},
{
"isClone": false,
"noteId": "H0mM1lTxF9JI",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"H0mM1lTxF9JI"
],
"title": "Excalidraw",
"notePosition": 30,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "markdown",
"dataFileName": "Excalidraw.md",
"attachments": []
}
]
}
]
},
@ -2802,6 +2989,64 @@
"format": "markdown",
"dataFileName": "Quick search.md",
"attachments": []
},
{
"isClone": false,
"noteId": "8YBEPzcpUgxw",
"notePath": [
"pOsGYCXsbNQG",
"gh7bpGYxajRS",
"Vc8PjrjAGuOp",
"8YBEPzcpUgxw"
],
"title": "Note buttons",
"notePosition": 90,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [
{
"type": "relation",
"name": "internalLink",
"value": "BlN9DFI679QC",
"isInheritable": false,
"position": 10
},
{
"type": "relation",
"name": "internalLink",
"value": "vZWERwf8U3nx",
"isInheritable": false,
"position": 20
},
{
"type": "relation",
"name": "internalLink",
"value": "4FahAwuGTAwC",
"isInheritable": false,
"position": 30
},
{
"type": "relation",
"name": "internalLink",
"value": "0vhv7lsOLy82",
"isInheritable": false,
"position": 40
}
],
"format": "markdown",
"dataFileName": "Note buttons.md",
"attachments": [
{
"attachmentId": "iln72O2Xo8zy",
"title": "image.png",
"role": "image",
"mime": "image/png",
"position": 10,
"dataFileName": "Note buttons_image.png"
}
]
}
]
},

55
docs/User Guide/User Guide/Advanced Usage/Note source.md Normal file
View File

@ -0,0 +1,55 @@
# Note source
## Understanding the source code of the different notes
Internally, the structure of the content of each note is different based on the [Note Types](../Note%20Types).
For example:
* [Text Notes](#root/_hidden/_options/_optionsTextNotes) are represented internally as HTML, using the [CKEditor](Technologies%20used/CKEditor.md) representation. Note that due to the custom plugins, some HTML elements are specific to Trilium only, for example the admonitions.
* [Code Notes](#root/_hidden/_options/_optionsCodeNotes) are plain text and are represented internally as-is.
* [Geo map](../Note%20Types/Geo%20map.md) notes contain only minimal information (viewport, zoom) as a JSON.
* [Canvas](../Note%20Types/Canvas.md) notes are represented as JSON, with Trilium's own information alongside with [Excalidraw](Technologies%20used/Excalidraw.md)'s internal JSON representation format.
* [Mind Map](../Note%20Types/Mind%20Map.md) notes are represented as JSON, with the internal format of [MindElixir](Technologies%20used/MindElixir.md).
Note that some information is also stored as [Attachments](../Attachments). For example [Canvas](../Note%20Types/Canvas.md) notes use the attachments feature to store the custom libraries, and alongside with [Mind Map](../Note%20Types/Mind%20Map.md) and other similar note types it stores an SVG representation of the content for use in other features such as including in other notes, shared notes, etc.
Here's part of the HTML representation of this note, as it's stored in the database (but prettified).
```html
<h2>
Understanding the source code of the different notes
</h2>
<p>
Internally, the structure of the content of each note is different based on the&nbsp;
<a class="reference-link" href="../Note%20Types">
Note Types
</a>
.
</p>
```
## Viewing the source code
It is possible to view the source code of a note by pressing the contextual menu in [Note buttons](../Basic%20Concepts/UI%20Elements/Note%20buttons.md) and selecting _Note source_.
![](Note%20source_image.png)
The source code will be displayed in a new tab.
For some note types, such as text notes, the source code is also formatted in order to be more easily readable.
## Modifying the source code
It is possible to modify the source code of a note directly, however not via the _Note source_ functionality. 
To do so:
1. Change the note type from the real note type (e.g. Canvas, Geo Type) to Code (plain text) or the corresponding format such as JSON or HTML.
2. Confirm the warning about changing the note type.
3. The source code will appear, make the necessary modifications.
4. Change the note type back to the real note type.
> [!WARNING]
> Depending on the changes made, there is a risk that the note will not render properly. It's best to save a revision before making any big changes.
>
> If the note does not render properly, modify the source code again or revert to a prior revision. Since the error handling for unexpected changes might not always be perfect, it be required to refresh the application.

BIN
docs/User Guide/User Guide/Advanced Usage/Note source_image.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

0
docs/User Guide/User Guide/Advanced Usage/Technologies used/CKEditor.md Normal file
View File

0
docs/User Guide/User Guide/Advanced Usage/Technologies used/Excalidraw.md Normal file
View File

0
docs/User Guide/User Guide/Advanced Usage/Technologies used/MindElixir.md Normal file
View File

5
docs/User Guide/User Guide/Basic Concepts/UI Elements/Note buttons.md Normal file
View File

@ -0,0 +1,5 @@
# Note buttons
To the right of the [Ribbon](Ribbon.md) there are a few more buttons: ![](Note%20buttons_image.png)
* The Note Revisions button displays the [Note Revisions](../Note/Note%20Revisions.md) for that particular note.
* The contextual menu offers commands for the note or its subtree, such as import, export, viewing the [Note source code](../../Advanced%20Usage/Note%20source.md) or [Attachments](../Note/Attachments.md).

BIN
docs/User Guide/User Guide/Basic Concepts/UI Elements/Note buttons_image.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 941 B

245
src/public/app/doc_notes/en/User Guide/!!!meta.json generated
View File

@ -1400,6 +1400,193 @@
"format": "html",
"dataFileName": "Bulk actions.html",
"attachments": []
},
{
"isClone": false,
"noteId": "4FahAwuGTAwC",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"4FahAwuGTAwC"
],
"title": "Note source",
"notePosition": 160,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [
{
"type": "relation",
"name": "internalLink",
"value": "KSZ04uQ2D1St",
"isInheritable": false,
"position": 10
},
{
"type": "relation",
"name": "internalLink",
"value": "_optionsTextNotes",
"isInheritable": false,
"position": 20
},
{
"type": "relation",
"name": "internalLink",
"value": "_optionsCodeNotes",
"isInheritable": false,
"position": 30
},
{
"type": "relation",
"name": "internalLink",
"value": "MI26XDLSAlCD",
"isInheritable": false,
"position": 40
},
{
"type": "relation",
"name": "internalLink",
"value": "81SGnPGMk7Xc",
"isInheritable": false,
"position": 50
},
{
"type": "relation",
"name": "internalLink",
"value": "grjYqerjn243",
"isInheritable": false,
"position": 60
},
{
"type": "relation",
"name": "internalLink",
"value": "gBbsAeiuUxI5",
"isInheritable": false,
"position": 70
},
{
"type": "relation",
"name": "internalLink",
"value": "N4IDkixaDG9C",
"isInheritable": false,
"position": 80
},
{
"type": "relation",
"name": "internalLink",
"value": "H0mM1lTxF9JI",
"isInheritable": false,
"position": 90
},
{
"type": "relation",
"name": "internalLink",
"value": "Wxt3vVlxlYLi",
"isInheritable": false,
"position": 100
},
{
"type": "relation",
"name": "internalLink",
"value": "8YBEPzcpUgxw",
"isInheritable": false,
"position": 110
}
],
"format": "html",
"dataFileName": "Note source.html",
"attachments": [
{
"attachmentId": "Ud3rPUVJpRWJ",
"title": "image.png",
"role": "image",
"mime": "image/png",
"position": 10,
"dataFileName": "Note source_image.png"
}
]
},
{
"isClone": false,
"noteId": "1YeN2MzFUluU",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU"
],
"title": "Technologies used",
"notePosition": 170,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "html",
"attachments": [],
"dirFileName": "Technologies used",
"children": [
{
"isClone": false,
"noteId": "MI26XDLSAlCD",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"MI26XDLSAlCD"
],
"title": "CKEditor",
"notePosition": 10,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "html",
"dataFileName": "CKEditor.html",
"attachments": []
},
{
"isClone": false,
"noteId": "N4IDkixaDG9C",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"N4IDkixaDG9C"
],
"title": "MindElixir",
"notePosition": 20,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "html",
"dataFileName": "MindElixir.html",
"attachments": []
},
{
"isClone": false,
"noteId": "H0mM1lTxF9JI",
"notePath": [
"pOsGYCXsbNQG",
"tC7s2alapj8V",
"1YeN2MzFUluU",
"H0mM1lTxF9JI"
],
"title": "Excalidraw",
"notePosition": 30,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [],
"format": "html",
"dataFileName": "Excalidraw.html",
"attachments": []
}
]
}
]
},
@ -2802,6 +2989,64 @@
"format": "html",
"dataFileName": "Quick search.html",
"attachments": []
},
{
"isClone": false,
"noteId": "8YBEPzcpUgxw",
"notePath": [
"pOsGYCXsbNQG",
"gh7bpGYxajRS",
"Vc8PjrjAGuOp",
"8YBEPzcpUgxw"
],
"title": "Note buttons",
"notePosition": 90,
"prefix": null,
"isExpanded": false,
"type": "text",
"mime": "text/html",
"attributes": [
{
"type": "relation",
"name": "internalLink",
"value": "BlN9DFI679QC",
"isInheritable": false,
"position": 10
},
{
"type": "relation",
"name": "internalLink",
"value": "vZWERwf8U3nx",
"isInheritable": false,
"position": 20
},
{
"type": "relation",
"name": "internalLink",
"value": "4FahAwuGTAwC",
"isInheritable": false,
"position": 30
},
{
"type": "relation",
"name": "internalLink",
"value": "0vhv7lsOLy82",
"isInheritable": false,
"position": 40
}
],
"format": "html",
"dataFileName": "Note buttons.html",
"attachments": [
{
"attachmentId": "iln72O2Xo8zy",
"title": "image.png",
"role": "image",
"mime": "image/png",
"position": 10,
"dataFileName": "Note buttons_image.png"
}
]
}
]
},

88
src/public/app/doc_notes/en/User Guide/User Guide/Advanced Usage/Note source.html generated Normal file
View File

@ -0,0 +1,88 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../style.css">
<base target="_parent">
<title data-trilium-title>Note source</title>
</head>
<body>
<div class="content">
<h1 data-trilium-h1>Note source</h1>
<div class="ck-content">
<h2>Understanding the source code of the different notes</h2>
<p>Internally, the structure of the content of each note is different based
on the&nbsp;<a class="reference-link" href="../Note%20Types">Note Types</a>.</p>
<p>For example:</p>
<ul>
<li><a class="reference-link" href="#root/_hidden/_options/_optionsTextNotes">Text Notes</a>&nbsp;are
represented internally as HTML, using the&nbsp;<a class="reference-link"
href="Technologies%20used/CKEditor.html">CKEditor</a>&nbsp;representation.
Note that due to the custom plugins, some HTML elements are specific to
Trilium only, for example the admonitions.</li>
<li><a class="reference-link" href="#root/_hidden/_options/_optionsCodeNotes">Code Notes</a>&nbsp;are
plain text and are represented internally as-is.</li>
<li><a class="reference-link" href="../Note%20Types/Geo%20map.html">Geo map</a>&nbsp;notes
contain only minimal information (viewport, zoom) as a JSON.</li>
<li><a class="reference-link" href="../Note%20Types/Canvas.html">Canvas</a>&nbsp;notes
are represented as JSON, with Trilium's own information alongside with&nbsp;
<a
class="reference-link" href="Technologies%20used/Excalidraw.html">Excalidraw</a>'s internal JSON representation format.</li>
<li><a class="reference-link" href="../Note%20Types/Mind%20Map.html">Mind Map</a>&nbsp;notes
are represented as JSON, with the internal format of&nbsp;<a class="reference-link"
href="Technologies%20used/MindElixir.html">MindElixir</a>.</li>
</ul>
<p>Note that some information is also stored as&nbsp;<a class="reference-link"
href="../Attachments">Attachments</a>. For example&nbsp;<a class="reference-link"
href="../Note%20Types/Canvas.html">Canvas</a>&nbsp;notes use the attachments
feature to store the custom libraries, and alongside with&nbsp;<a class="reference-link"
href="../Note%20Types/Mind%20Map.html">Mind Map</a>&nbsp;and other similar
note types it stores an SVG representation of the content for use in other
features such as including in other notes, shared notes, etc.</p>
<p>Here's part of the HTML representation of this note, as it's stored in
the database (but prettified).</p><pre><code class="language-text-html">&lt;h2&gt;
Understanding the source code of the different notes
&lt;/h2&gt;
&lt;p&gt;
Internally, the structure of the content of each note is different based on the&amp;nbsp;
&lt;a class="reference-link" href="../Note%20Types"&gt;
Note Types
&lt;/a&gt;
.
&lt;/p&gt;</code></pre>
<h2>Viewing the source code</h2>
<p>It is possible to view the source code of a note by pressing the contextual
menu in&nbsp;<a class="reference-link" href="../Basic%20Concepts/UI%20Elements/Note%20buttons.html">Note buttons</a>&nbsp;and
selecting <em>Note source</em>.</p>
<p>
<img src="Note source_image.png" width="860" height="377">
</p>
<p>The source code will be displayed in a new tab.</p>
<p>For some note types, such as text notes, the source code is also formatted
in order to be more easily readable.</p>
<h2>Modifying the source code</h2>
<p>It is possible to modify the source code of a note directly, however not
via the <em>Note source </em>functionality.&nbsp;</p>
<p>To do so:</p>
<ol>
<li>Change the note type from the real note type (e.g. Canvas, Geo Type) to
Code (plain text) or the corresponding format such as JSON or HTML.</li>
<li>Confirm the warning about changing the note type.</li>
<li>The source code will appear, make the necessary modifications.</li>
<li>Change the note type back to the real note type.</li>
</ol>
<aside class="admonition warning">
<p>Depending on the changes made, there is a risk that the note will not
render properly. It's best to save a revision before making any big changes.</p>
<p>If the note does not render properly, modify the source code again or
revert to a prior revision. Since the error handling for unexpected changes
might not always be perfect, it be required to refresh the application.</p>
</aside>
</div>
</div>
</body>
</html>

BIN
src/public/app/doc_notes/en/User Guide/User Guide/Advanced Usage/Note source_image.png generated Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

19
src/public/app/doc_notes/en/User Guide/User Guide/Advanced Usage/Technologies used/CKEditor.html generated Normal file
View File

@ -0,0 +1,19 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../../style.css">
<base target="_parent">
<title data-trilium-title>CKEditor</title>
</head>
<body>
<div class="content">
<h1 data-trilium-h1>CKEditor</h1>
<div class="ck-content"></div>
</div>
</body>
</html>

19
src/public/app/doc_notes/en/User Guide/User Guide/Advanced Usage/Technologies used/Excalidraw.html generated Normal file
View File

@ -0,0 +1,19 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../../style.css">
<base target="_parent">
<title data-trilium-title>Excalidraw</title>
</head>
<body>
<div class="content">
<h1 data-trilium-h1>Excalidraw</h1>
<div class="ck-content"></div>
</div>
</body>
</html>

19
src/public/app/doc_notes/en/User Guide/User Guide/Advanced Usage/Technologies used/MindElixir.html generated Normal file
View File

@ -0,0 +1,19 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../../style.css">
<base target="_parent">
<title data-trilium-title>MindElixir</title>
</head>
<body>
<div class="content">
<h1 data-trilium-h1>MindElixir</h1>
<div class="ck-content"></div>
</div>
</body>
</html>

34
src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts/UI Elements/Note buttons.html generated Normal file
View File

@ -0,0 +1,34 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../../style.css">
<base target="_parent">
<title data-trilium-title>Note buttons</title>
</head>
<body>
<div class="content">
<h1 data-trilium-h1>Note buttons</h1>
<div class="ck-content">
<p>To the right of the&nbsp;<a class="reference-link" href="Ribbon.html">Ribbon</a>&nbsp;there
are a few more buttons:
<img src="Note buttons_image.png" width="69" height="33">
</p>
<ul>
<li>The Note Revisions button displays the&nbsp;<a class="reference-link"
href="../Note/Note%20Revisions.html">Note Revisions</a>&nbsp;for that particular
note.</li>
<li>The contextual menu offers commands for the note or its subtree, such
as import, export, viewing the&nbsp;<a class="reference-link" href="../../Advanced%20Usage/Note%20source.html">Note source code</a>&nbsp;or&nbsp;
<a
class="reference-link" href="../Note/Attachments.html">Attachments</a>.</li>
</ul>
<p>&nbsp;</p>
</div>
</div>
</body>
</html>

BIN
src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts/UI Elements/Note buttons_image.png generated Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 941 B

18
src/public/app/doc_notes/en/User Guide/navigation.html generated
View File

@ -74,6 +74,21 @@
</li>
<li><a href="User%20Guide/Advanced%20Usage/Bulk%20actions.html" target="detail">Bulk actions</a>
</li>
<li><a href="User%20Guide/Advanced%20Usage/Note%20source.html" target="detail">Note source</a>
</li>
<li>Technologies used
<ul>
<li><a href="User%20Guide/Advanced%20Usage/Technologies%20used/CKEditor.html"
target="detail">CKEditor</a>
</li>
<li><a href="User%20Guide/Advanced%20Usage/Technologies%20used/MindElixir.html"
target="detail">MindElixir</a>
</li>
<li><a href="User%20Guide/Advanced%20Usage/Technologies%20used/Excalidraw.html"
target="detail">Excalidraw</a>
</li>
</ul>
</li>
</ul>
</li>
<li>Installation &amp; Setup
@ -165,6 +180,9 @@
<li><a href="User%20Guide/Basic%20Concepts/UI%20Elements/Quick%20search.html"
target="detail">Quick search</a>
</li>
<li><a href="User%20Guide/Basic%20Concepts/UI%20Elements/Note%20buttons.html"
target="detail">Note buttons</a>
</li>
</ul>
</li>
<li><a href="User%20Guide/Basic%20Concepts/Note.html" target="detail">Note</a>