mirror of
https://github.com/zadam/trilium.git
synced 2025-11-18 11:10:41 +01:00
chore(docs): update to match new img handling
This commit is contained in:
1921
src/public/app/doc_notes/en/User Guide/!!!meta.json
generated
1921
src/public/app/doc_notes/en/User Guide/!!!meta.json
generated
File diff suppressed because it is too large
Load Diff
@@ -25,14 +25,14 @@
|
||||
<p>Select an existing day note, and the menubar contains a calendar widget.
|
||||
Select any day to create a note for that day. </p>
|
||||
<p>
|
||||
<img src="1_Day Notes_image.png" alt="">
|
||||
<img src="1_Day Notes_image.png">
|
||||
</p>
|
||||
<p>This pattern works well also because of <a href="../../Basic%20Concepts/Note/Cloning%20Notes.html">Cloning Notes</a> functionality
|
||||
- note can appear in multiple places in the note tree, so besides appearing
|
||||
under day note, it can also be categorized into other notes.</p>
|
||||
<h2>Demo</h2>
|
||||
<p>
|
||||
<img src="Day Notes_image.png" alt="">
|
||||
<img src="Day Notes_image.png">
|
||||
</p>
|
||||
<p>You can see the structure of day notes appearing under "Journal" note
|
||||
- there's a note for the whole year 2017, under it, you have "12 - December"
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
href="../../Note%20Types/Code/Scripts.html">scripts</a>showcase present in the <a href="../Database.html">demo notes</a>.</p>
|
||||
<h2>Demo</h2>
|
||||
<p>
|
||||
<img src="../../Attachments/task-manager.png" alt="">
|
||||
<img src="../../Attachments/task-manager.png">
|
||||
</p>
|
||||
<p>Task Manager manages outstanding (TODO) tasks and finished tasks (non-empty
|
||||
doneDate attribute). Outstanding tasks are further categorized by location
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="Weight Tracker_image.png" alt="">
|
||||
<img src="Weight Tracker_image.png">
|
||||
</p>
|
||||
<p>The <code>Weight Tracker</code> is a <a href="../../Note%20Types/Code/Script%20API.html">Script API</a> showcase
|
||||
present in the <a href="../Database.html">demo notes</a>.</p>
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
<p>These attributes play a crucial role in organizing, categorising, and
|
||||
enhancing the functionality of notes.</p>
|
||||
<p>
|
||||
<img src="Attributes_image.png" alt="">
|
||||
<img src="Attributes_image.png">
|
||||
</p>
|
||||
<h2>Labels</h2>
|
||||
<p>Labels in Trilium can be used for a variety of purposes:</p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
are considered important and thus are "promoted" onto the main note UI.
|
||||
See example below:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/promoted-attributes.png" alt="">
|
||||
<img src="../../Attachments/promoted-attributes.png">
|
||||
</p>
|
||||
<p>You can see the note having kind of form with several fields. Each of
|
||||
these is just regular attribute, the only difference is that they appear
|
||||
@@ -32,7 +32,7 @@
|
||||
- is it just string, or is it a date? Should we allow multiple values or
|
||||
note? And importantly, should we <em>promote</em> the attribute or not?</p>
|
||||
<p>
|
||||
<img src="Promoted Attributes_image.png" alt="">
|
||||
<img src="Promoted Attributes_image.png">
|
||||
</p>
|
||||
<p>You can notice tag attribute definition. These "definition" attributes
|
||||
define how the "value" attributes should behave.</p>
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
<li>Close the application or close the database.</li>
|
||||
</ol>
|
||||
<p>
|
||||
<img src="Manually altering the data.png" alt="">
|
||||
<img src="Manually altering the data.png">
|
||||
</p>
|
||||
<h3>Using the SQLite CLI</h3>
|
||||
<p>First, start the SQLite 3 CLI by specifying the path to the database:</p><pre><code class="language-text-x-trilium-auto">sqlite3 ~/.local/share/trilium-data/document.db</code></pre>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<p>It can be accessed by going to the <a href="../../../Basic%20Concepts/UI%20Elements">global menu</a> →
|
||||
Advanced → Open SQL Console.</p>
|
||||
<p>
|
||||
<img src="SQL Console_image.png" alt="">
|
||||
<img src="SQL Console_image.png">
|
||||
</p>
|
||||
<h3>Interaction</h3>
|
||||
<ul>
|
||||
@@ -30,20 +30,19 @@
|
||||
</li>
|
||||
<li>
|
||||
<p>To run the statement, press the
|
||||
<img src="3_SQL Console_image.png" alt="">icon.</p>
|
||||
<img src="3_SQL Console_image.png">icon.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>For queries that return a result, the data will displayed in a table.</p>
|
||||
<p>
|
||||
<img src="1_SQL Console_image.png" alt="">
|
||||
<img src="1_SQL Console_image.png">
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Saved SQL console</h3>
|
||||
<p>SQL queries or commands can be saved into a dedicated note.</p>
|
||||
<p>To do so, simply write the query and press the
|
||||
<img src="2_SQL Console_image.png"
|
||||
alt="">button. Once saved, the note will appear in <a href="../../Advanced%20Showcases/Day%20Notes.html">Day Notes</a>.</p>
|
||||
<img src="2_SQL Console_image.png">button. Once saved, the note will appear in <a href="../../Advanced%20Showcases/Day%20Notes.html">Day Notes</a>.</p>
|
||||
<ul>
|
||||
<li>The SQL expression will not be displayed by default, but it can still
|
||||
be viewed by going to the note context menu and selecting <em>Note source</em>.</li>
|
||||
|
||||
@@ -19,12 +19,12 @@
|
||||
<h2>Link Map</h2>
|
||||
<p>Shows <a href="Attributes.html">relations</a> between notes:</p>
|
||||
<p>
|
||||
<img src="1_Note Map_image.png" alt="">
|
||||
<img src="1_Note Map_image.png">
|
||||
</p>
|
||||
<h2>Tree Map</h2>
|
||||
<p>Shows hierarchical map of notes:</p>
|
||||
<p>
|
||||
<img src="Note Map_image.png" alt="">
|
||||
<img src="Note Map_image.png">
|
||||
</p>
|
||||
<h2>See also</h2>
|
||||
<p><a href="Relation%20Map.html">Relation map</a> is a similar concept, with
|
||||
|
||||
@@ -20,11 +20,11 @@
|
||||
<p>This is a basic example how you can create simple diagram using relation
|
||||
maps:</p>
|
||||
<p>
|
||||
<img src="../Attachments/relation-map-dev-process.png" alt="">
|
||||
<img src="../Attachments/relation-map-dev-process.png">
|
||||
</p>
|
||||
<p>And this is how you can create it:</p>
|
||||
<p>
|
||||
<img src="Relation Map_relation-map-.gif" alt="">
|
||||
<img src="Relation Map_relation-map-.gif">
|
||||
</p>
|
||||
<p>We start completely from scratch by first creating new note called "Development
|
||||
process" and changing its type to "Relation map". After that we create
|
||||
@@ -39,11 +39,11 @@
|
||||
<p>This is more complicated demo using some advanced concepts. Resulting
|
||||
diagram is here:</p>
|
||||
<p>
|
||||
<img src="../Attachments/relation-map-family.png" alt="">
|
||||
<img src="../Attachments/relation-map-family.png">
|
||||
</p>
|
||||
<p>This is how you get to it:</p>
|
||||
<p>
|
||||
<img src="../Attachments/relation-map-family-demo.gif" alt="">
|
||||
<img src="../Attachments/relation-map-family-demo.gif">
|
||||
</p>
|
||||
<p>There are several steps here:</p>
|
||||
<ul>
|
||||
|
||||
@@ -26,15 +26,16 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="1_Serving directly the conte.png" alt="">
|
||||
<img src="1_Serving directly the conte.png">
|
||||
</td>
|
||||
<td>
|
||||
<img src="Serving directly the conte.png" alt="">
|
||||
<img src="Serving directly the conte.png">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>By adding an attribute to the note</h2>
|
||||
|
||||
<h2>By adding an attribute to the note</h2>
|
||||
<p>Simply add the <code>#shareRaw</code> attribute and the note will always
|
||||
be rendered <em>raw</em> when accessed from the share URL.</p>
|
||||
<h2>By altering the URL</h2>
|
||||
@@ -42,7 +43,7 @@
|
||||
regardless of whether the <code>#shareRaw</code> attribute is added on the
|
||||
note.</p>
|
||||
<p>
|
||||
<img src="Serving directly the conte.png" alt="">
|
||||
<img src="Serving directly the conte.png">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
<p>If you want to import just a chunk of markdown from clipboard, you can
|
||||
do it from editor block menu:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/markdown-inline-import.gif" alt="">
|
||||
<img src="../../Attachments/markdown-inline-import.gif">
|
||||
</p>
|
||||
<h3>File import</h3>
|
||||
<p>You can also import Markdown files from files:</p>
|
||||
@@ -38,20 +38,20 @@
|
||||
</ul>
|
||||
<p>[[gifs/markdown-file-import.gif]]</p>
|
||||
<p>
|
||||
<img src="../../Attachments/markdown-file-import.gif" alt="">
|
||||
<img src="../../Attachments/markdown-file-import.gif">
|
||||
</p>
|
||||
<h2>Export</h2>
|
||||
<h3>Subtree export</h3>
|
||||
<p>You can export whole subtree to ZIP archive which will have directory
|
||||
structured modelled after subtree structure:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/markdown-export-subtree.gif" alt="">
|
||||
<img src="../../Attachments/markdown-export-subtree.gif">
|
||||
</p>
|
||||
<h3>Single note export</h3>
|
||||
<p>If you want to export just single note without its subtree, you can do
|
||||
it from Note actions menu:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/markdown-export-note.gif" alt="">
|
||||
<img src="../../Attachments/markdown-export-note.gif">
|
||||
</p>
|
||||
<h3>Exporting protected notes</h3>
|
||||
<p>If you want to export protected notes, enter a protected session first!
|
||||
|
||||
@@ -15,13 +15,13 @@
|
||||
<div class="ck-content">
|
||||
<p>To easily access selected notes, you can bookmark them. See demo:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/bookmarks.gif" alt="">
|
||||
<img src="../../Attachments/bookmarks.gif">
|
||||
</p>
|
||||
<h2>Bookmark folder</h2>
|
||||
<p>Space in the left panel is limited, and you might want to bookmark many
|
||||
items. One possible solution is to bookmark a folder, so it shows its children:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/bookmark-folder.png" alt="">
|
||||
<img src="../../Attachments/bookmark-folder.png">
|
||||
</p>
|
||||
<p>To do this, you need to add a <code>#bookmarkFolder</code> label to the
|
||||
note.</p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
"zoom into") a specific note and its subtree by hiding all parent and sibling
|
||||
notes. Demo:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/note-hoisting.gif" alt="">
|
||||
<img src="../../Attachments/note-hoisting.gif">
|
||||
</p>
|
||||
<p>In addition to showing only this subtree, this also narrows both full
|
||||
text search and <a href="Note%20Navigation.html">“jump to note”</a> to just
|
||||
|
||||
@@ -21,14 +21,14 @@
|
||||
<p>This works identically to browser backwards / forwards, it's actually
|
||||
using built-in browser support for this.</p>
|
||||
<p>
|
||||
<img src="Note Navigation_image.png" alt="">
|
||||
<img src="Note Navigation_image.png">
|
||||
</p>
|
||||
<h2>Jump to note</h2>
|
||||
<p>This is useful to quickly find and view arbitrary note - click on <code>Jump to</code> button
|
||||
on the top or press <kbd>Ctrl</kbd> + <kbd>J</kbd> . Then type part of the
|
||||
note name and autocomplete will help you pick the desired note.</p>
|
||||
<p>
|
||||
<img src="../../Attachments/jump-to.gif" alt="">
|
||||
<img src="../../Attachments/jump-to.gif">
|
||||
</p>
|
||||
<h3>Recent notes</h3>
|
||||
<p>Jump to note also has the ability to show the list of recently viewed
|
||||
@@ -38,7 +38,7 @@
|
||||
will show the list of recent notes.</p>
|
||||
<p>Alternatively you can click on the "time" icon on the right.</p>
|
||||
<p>
|
||||
<img src="../../Attachments/recent-notes.gif" alt="">
|
||||
<img src="../../Attachments/recent-notes.gif">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -27,13 +27,13 @@
|
||||
<li>
|
||||
<p>easy entering of workspace: </p>
|
||||
<p>
|
||||
<img src="1_Workspace_image.png" alt="">
|
||||
<img src="1_Workspace_image.png">
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>visual identification of workspace in tabs:
|
||||
<br>
|
||||
<img src="Workspace_image.png" alt="">
|
||||
<img src="Workspace_image.png">
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
<p>You can control whether archived notes are displayed in the note tree
|
||||
with a setting:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/hide-archived.png" alt="">
|
||||
<img src="../../Attachments/hide-archived.png">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -93,7 +93,7 @@
|
||||
and notes.</p>
|
||||
<h3>Demo</h3>
|
||||
<p>
|
||||
<img src="../../Attachments/create-clone.gif" alt="">
|
||||
<img src="../../Attachments/create-clone.gif">
|
||||
</p>
|
||||
<p>In the demo, you can see how a clone can be created using the context
|
||||
menu. It's possible to do this also using the Add Link dialog or with <kbd>Ctrl</kbd>+<kbd>C</kbd> and <kbd>Ctrl</kbd>+<kbd>V</kbd>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="Export as PDF_image.png" alt="">
|
||||
<img src="Export as PDF_image.png">
|
||||
</p>
|
||||
<p>Screenshot of the note contextual menu indicating the “Export as PDF”
|
||||
option.</p>
|
||||
@@ -22,7 +22,7 @@
|
||||
as PDF. On the server or PWA (mobile), the option is not available due
|
||||
to technical constraints and it will be hidden.</p>
|
||||
<p>To print a note, select the
|
||||
<img src="1_Export as PDF_image.png" alt="">button to the right of the note and select <em>Export as PDF</em>.</p>
|
||||
<img src="1_Export as PDF_image.png">button to the right of the note and select <em>Export as PDF</em>.</p>
|
||||
<p>Afterwards you will be prompted to select where to save the PDF file.
|
||||
Upon confirmation, the resulting PDF will be opened automatically using
|
||||
the default/system application configured for PDFs.</p>
|
||||
@@ -31,7 +31,7 @@
|
||||
<a
|
||||
href="#root/OeKBfN6JbMIq/jRV1MPt4mNSP/hrC6xn7hnDq5">report the issue</a>. In this case, it's best to offer a sample note (click
|
||||
on the
|
||||
<img src="1_Export as PDF_image.png" alt="">button, select Export note → This note and all of its descendants → HTML
|
||||
<img src="1_Export as PDF_image.png">button, select Export note → This note and all of its descendants → HTML
|
||||
in ZIP archive). Make sure not to accidentally leak any personal information.</p>
|
||||
<h2>Landscape mode</h2>
|
||||
<p>When exporting to PDF, there are no customizable settings such as page
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
<p>Note revisions can be accessed through the button on the right of ribbon
|
||||
toolbar.</p>
|
||||
<p>
|
||||
<img src="../../Attachments/note-revisions.png" alt="">
|
||||
<img src="../../Attachments/note-revisions.png">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -126,7 +126,7 @@ body .CodeMirror {
|
||||
<p>After making changes, press <kbd>Ctrl</kbd> + <kbd>R</kbd> to reload the frontend
|
||||
and apply your new styles.</p>
|
||||
<p>
|
||||
<img src="Themes_image.png" alt="">
|
||||
<img src="Themes_image.png">
|
||||
</p>
|
||||
<h3>Styling Specific Notes in the Tree</h3>
|
||||
<p>To apply specific styles to certain notes in the tree:</p>
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
<p>The global menu configures the current window (zoom, keeping the window
|
||||
on top) and offers access to some more advanced options.</p>
|
||||
<p>
|
||||
<img src="2_Global menu_image.png" alt="">
|
||||
<img src="2_Global menu_image.png">
|
||||
</p>
|
||||
<h2>Accessing the global menu</h2>
|
||||
<p>See <a href="Vertical%20and%20horizontal%20layout.html">Vertical and horizontal layout</a> since
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
<p>This will open a new tab with the <a href="Note%20Tree.html">Note Tree</a> listing
|
||||
the launchers.</p>
|
||||
<p>
|
||||
<img src="Launch Bar_image.png" alt="">
|
||||
<img src="Launch Bar_image.png">
|
||||
</p>
|
||||
<p>Expanding <em>Available Launchers</em> section will show the list of launchers
|
||||
that are not displayed on the launch bar. The <em>Visible Launchers</em> will
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
<p>This page explains how to manipulate the note tree in TriliumNext, focusing
|
||||
on moving notes.</p>
|
||||
<p>
|
||||
<img src="1_Note Tree_image.png" alt="">
|
||||
<img src="1_Note Tree_image.png">
|
||||
</p>
|
||||
<h2>Drag and Drop</h2>
|
||||
<p>
|
||||
@@ -51,7 +51,7 @@
|
||||
Shift and click on the note to end the selection with. All the notes between
|
||||
the start and the end note will be selected as well.</p>
|
||||
<p>
|
||||
<img src="Note Tree_image.png" alt="">
|
||||
<img src="Note Tree_image.png">
|
||||
</p>
|
||||
<p>In the right-click menu, operations such as Cut, Copy, Move to, Clone
|
||||
to or Delete will apply to all the selected notes. It is also possible
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="Ribbon_image.png" alt="">
|
||||
<img src="Ribbon_image.png">
|
||||
</p>
|
||||
<p>The ribbon allows changing options, attributes and viewing information
|
||||
about the current note.</p>
|
||||
|
||||
@@ -26,13 +26,13 @@
|
||||
href="Note%20Tree.html">Note Tree</a>.</li>
|
||||
<li>The <a href="Note%20Tree.html">Note Tree</a> can be collapsed by pressing
|
||||
the
|
||||
<img src="6_Vertical and horizontal la.png" alt="">button at the bottom of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
<img src="6_Vertical and horizontal la.png">button at the bottom of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
<li>The <a href="Global%20menu.html">Global menu</a> can be accessed via the
|
||||
<img
|
||||
src="5_Vertical and horizontal la.png" alt="">icon at the top of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
src="5_Vertical and horizontal la.png">icon at the top of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="4_Vertical and horizontal la.png" alt="">
|
||||
<img src="4_Vertical and horizontal la.png">
|
||||
</p>
|
||||
<h3>Horizontal layout</h3>
|
||||
<p>The horizontal layout is a more traditional layout, since it bears similarity
|
||||
@@ -48,13 +48,13 @@
|
||||
removed if needed.</li>
|
||||
<li>The <a href="Note%20Tree.html">Note Tree</a> can be collapsed by pressing
|
||||
the small
|
||||
<img src="2_Vertical and horizontal la.png" alt="">button to the left of the first tab.</li>
|
||||
<img src="2_Vertical and horizontal la.png">button to the left of the first tab.</li>
|
||||
<li>The <a href="Global%20menu.html">Global menu</a> can be accessed via the
|
||||
<img
|
||||
src="1_Vertical and horizontal la.png" alt="">button at the end of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
src="1_Vertical and horizontal la.png">button at the end of the <a href="Launch%20Bar.html">Launcher Bar</a>.</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="3_Vertical and horizontal la.png" alt="">
|
||||
<img src="3_Vertical and horizontal la.png">
|
||||
</p>
|
||||
<h2>Changing the layout</h2>
|
||||
<p>Go to <a href="#root/_hidden/_lbRoot/_lbVisibleLaunchers/_lbSettings">Settings</a> and
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="6_Zen mode_image.png" alt="">
|
||||
<img src="6_Zen mode_image.png">
|
||||
</p>
|
||||
<p>Screenshot of Zen Mode activated on a Windows 11 system with native title
|
||||
bar off and background effects on.</p>
|
||||
@@ -22,7 +22,7 @@
|
||||
of Trilium is hidden away in order to be able to focus on the content,
|
||||
whether it's for reading or writing.</p>
|
||||
<p>
|
||||
<img src="5_Zen mode_image.png" alt="">
|
||||
<img src="5_Zen mode_image.png">
|
||||
</p>
|
||||
<p>Screenshot of the Zen Mode option in the global menu.</p>
|
||||
<h2>Activating & deactivating</h2>
|
||||
@@ -34,7 +34,7 @@
|
||||
<p>Once Zen Mode is activated, all the UI elements of the application will
|
||||
be hidden away, including the global menu. In that case, the Zen Mode can
|
||||
be deactivated either by pressing the
|
||||
<img src="Zen mode_image.png" alt="">icon in the top-right corner of the window or by pressing the keyboard
|
||||
<img src="Zen mode_image.png">icon in the top-right corner of the window or by pressing the keyboard
|
||||
combination again.</p>
|
||||
<p>Do note that, by design, activating or deactivating the Zen Mode applies
|
||||
only to the current window. Restarting the application will also disable
|
||||
@@ -45,7 +45,7 @@
|
||||
can still be moved by dragging the mouse across the top part of the window
|
||||
where the note titles are.</p>
|
||||
<p>
|
||||
<img src="3_Zen mode_image.png" alt="">
|
||||
<img src="3_Zen mode_image.png">
|
||||
</p>
|
||||
<p>Screenshot of two notes side-by-side while Zen Mode is active, on Windows
|
||||
11 with background effects off.</p>
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
it's processing data, or a checkbox to define a particular change in behavior
|
||||
for the script.</p>
|
||||
<p>
|
||||
<img src="Using promoted attributes .png" alt="">
|
||||
<img src="Using promoted attributes .png">
|
||||
</p>
|
||||
<h2>Using check boxes to toggle flags</h2>
|
||||
<p>Instead of asking the user to modify a boolean value in the script, it's
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<p>Easy way how to find out which data directory Trilium uses is to look
|
||||
at the "About Trilium Notes" dialog (from "Menu" in upper left corner):</p>
|
||||
<p>
|
||||
<img src="Data directory_image.png" alt="">
|
||||
<img src="Data directory_image.png">
|
||||
</p>
|
||||
<p>Here's how the location is decided:</p>
|
||||
<p>Data directory is normally named <code>trilium-data</code> and it is stored
|
||||
|
||||
@@ -24,11 +24,11 @@
|
||||
<h2>Screenshots</h2>
|
||||
<h3>Mobile phone</h3>
|
||||
<p>
|
||||
<img src="../Attachments/mobile-smartphone.png" alt="">
|
||||
<img src="../Attachments/mobile-smartphone.png">
|
||||
</p>
|
||||
<h3>Tablet</h3>
|
||||
<p>
|
||||
<img src="../Attachments/mobile-tablet.png" alt="">
|
||||
<img src="../Attachments/mobile-tablet.png">
|
||||
</p>
|
||||
<h2>Limitations</h2>
|
||||
<p>Mobile frontend provides only some of the features of the full desktop
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
<h2>Installation</h2>
|
||||
<h3>Download</h3>
|
||||
<p>You can either download source code zip/tar from <a href="https://github.com/TriliumNext/Notes/releases/latest">https://github.com/TriliumNext/Notes/releases/latest</a>.</p>
|
||||
<p>For the latest version including betas, clone Git repository <strong>from </strong><code><strong>master</strong></code><strong> branch</strong> with:</p><pre><code class="language-text-x-trilium-auto">git clone -b master https://github.com/triliumnext/notes.git</code></pre>
|
||||
<p>For the latest version including betas, clone Git repository <strong>from</strong> <code>**master**</code> <strong>branch</strong> with:</p><pre><code class="language-text-x-trilium-auto">git clone -b master https://github.com/triliumnext/notes.git</code></pre>
|
||||
<h2>Installation</h2><pre><code class="language-text-x-trilium-auto">cd trilium
|
||||
|
||||
# download all node dependencies
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
up synchronization with a server instance, allowing multiple desktop clients
|
||||
to sync with a central server. This creates a star-shaped topology:</p>
|
||||
<p>
|
||||
<img src="Synchronization_image.png" alt="">
|
||||
<img src="Synchronization_image.png">
|
||||
</p>
|
||||
<p>In this setup, a central server (referred to as the <em>sync server</em>)
|
||||
and multiple <em>client</em> (or <em>desktop</em>) instances synchronize with
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="Web Clipper_image.png" alt="">
|
||||
<img src="Web Clipper_image.png">
|
||||
</p>
|
||||
<p>Trilium Web Clipper is a web browser extension which allows user to clip
|
||||
text, screenshots, whole pages and short notes and save them directly to
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
book-like reading experience. This format is particularly useful for viewing
|
||||
multiple smaller notes in a cohesive, continuous manner.</p>
|
||||
<p>
|
||||
<img src="1_Book_image.png" alt="">
|
||||
<img src="1_Book_image.png">
|
||||
</p>
|
||||
<p>In the example above, the "node.js" note on the left panel contains several
|
||||
child notes. The right panel displays the content of these child notes
|
||||
@@ -33,7 +33,7 @@
|
||||
This view presents the child notes in a grid format, allowing for a more
|
||||
visual navigation experience.</p>
|
||||
<p>
|
||||
<img src="Book_image.png" alt="">
|
||||
<img src="Book_image.png">
|
||||
</p>
|
||||
<p>Switching between these views can be easily managed through the Book Note's
|
||||
settings (or <code>viewType</code> attribute), allowing users to choose the
|
||||
|
||||
@@ -14,44 +14,43 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="6_Calendar View_image.png" alt="">
|
||||
<img src="6_Calendar View_image.png">
|
||||
</p>
|
||||
<p>The Calendar view of Book notes will display each child note in a calendar
|
||||
that has a start date and optionally an end date, as an event.</p>
|
||||
<p>Unlike other Book view types, the Calendar view also allows some kind
|
||||
of interaction, such as moving events around as well as creating new ones.</p>
|
||||
<h2>Creating a calendar</h2>
|
||||
<figure class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th> </th>
|
||||
<th> </th>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="3_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
<td>The Calendar View works only for Book note types. To create a new note,
|
||||
right click on the note tree on the left and select Insert note after,
|
||||
or Insert child note and then select <em>Book</em>.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="5_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
<td>Once created, the “View type” of the Book needs changed to “Calendar”,
|
||||
by selecting the “Book Properties” tab in the ribbon.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<h2>Creating a new event/note</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="3_Calendar View_image.png">
|
||||
</td>
|
||||
<td>The Calendar View works only for Book note types. To create a new note,
|
||||
right click on the note tree on the left and select Insert note after,
|
||||
or Insert child note and then select <em>Book</em>.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="5_Calendar View_image.png">
|
||||
</td>
|
||||
<td>Once created, the “View type” of the Book needs changed to “Calendar”,
|
||||
by selecting the “Book Properties” tab in the ribbon.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h2>Creating a new event/note</h2>
|
||||
<ul>
|
||||
<li>Clicking on a day will create a new child note and assign it to that particular
|
||||
day.
|
||||
@@ -63,7 +62,7 @@
|
||||
<li>It's possible to drag across multiple days to set both the start and end
|
||||
date of a particular note.
|
||||
<br>
|
||||
<img src="Calendar View_image.png" alt="">
|
||||
<img src="Calendar View_image.png">
|
||||
</li>
|
||||
<li>Creating new notes from the calendar will respect the <code>~child:template</code> relation
|
||||
if set on the book note.</li>
|
||||
@@ -72,7 +71,7 @@
|
||||
<ul>
|
||||
<li>Hovering the mouse over an event will display information about the note.
|
||||
<br>
|
||||
<img src="11_Calendar View_image.png" alt="">
|
||||
<img src="11_Calendar View_image.png">
|
||||
</li>
|
||||
<li>Left clicking the event will go to that note. Middle clicking will open
|
||||
the note in a new tab and right click will offer more options including
|
||||
@@ -83,242 +82,234 @@
|
||||
</ul>
|
||||
<h2>Configuring the calendar</h2>
|
||||
<p>The following attributes can be added to the book type:</p>
|
||||
<figure class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>#calendar:hideWeekends</code>
|
||||
</td>
|
||||
<td>When present (regardless of value), it will hide Saturday and Sundays
|
||||
from the calendar.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:weekNumbers</code>
|
||||
</td>
|
||||
<td>When present (regardless of value), it will show the number of the week
|
||||
on the calendar.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>~child:template</code>
|
||||
</td>
|
||||
<td>Defines the template for newly created notes in the calendar (via dragging
|
||||
or clicking).</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>#calendar:hideWeekends</code>
|
||||
</td>
|
||||
<td>When present (regardless of value), it will hide Saturday and Sundays
|
||||
from the calendar.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:weekNumbers</code>
|
||||
</td>
|
||||
<td>When present (regardless of value), it will show the number of the week
|
||||
on the calendar.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>~child:template</code>
|
||||
</td>
|
||||
<td>Defines the template for newly created notes in the calendar (via dragging
|
||||
or clicking).</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>In addition, the first day of the week can be either Sunday or Monday
|
||||
and can be adjusted from the application settings.</p>
|
||||
<h2>Configuring the calendar events</h2>
|
||||
<p>For each note of the calendar, the following attributes can be used:</p>
|
||||
<figure
|
||||
class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>#startDate</code>
|
||||
</td>
|
||||
<td>The date the event starts, which will display it in the calendar. The
|
||||
format is <code>YYYY-MM-DD</code> (year, month and day separated by a minus
|
||||
sign).</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#endDate</code>
|
||||
</td>
|
||||
<td>Similar to <code>startDate</code>, mentions the end date if the event spans
|
||||
across multiple days. The date is inclusive, so the end day is also considered.
|
||||
The attribute can be missing for single-day events.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#color</code>
|
||||
</td>
|
||||
<td>Displays the event with a specified color (named such as <code>red</code>, <code>gray</code> or
|
||||
hex such as <code>#FF0000</code>). This will also change the color of the
|
||||
note in other places such as the note tree.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:color</code>
|
||||
</td>
|
||||
<td>Similar to <code>#color</code>, but applies the color only for the event
|
||||
in the calendar and not for other places such as the note tree.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#iconClass</code>
|
||||
</td>
|
||||
<td>If present, the icon of the note will be displayed to the left of the
|
||||
event title.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:title</code>
|
||||
</td>
|
||||
<td>Changes the title of an event to point to an attribute of the note other
|
||||
than the title, either a label (e.g. <code>#assignee</code>) or a relation
|
||||
(e.g. <code>~for</code>). See <em>Advanced use-cases</em> for more information.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:displayedAttributes</code>
|
||||
</td>
|
||||
<td>
|
||||
<p>Allows displaying the value of one or more attributes in the calendar
|
||||
like this: </p>
|
||||
<p>
|
||||
<img src="13_Calendar View_image.png" alt="">
|
||||
</p><pre><code class="language-text-x-trilium-auto">#weight="70"
|
||||
#Mood="Good"
|
||||
#calendar:displayedAttributes="weight,Mood"</code></pre>
|
||||
<p>It can also be used with relations, case in which it will display the
|
||||
title of the target note:</p><pre><code class="language-text-x-trilium-auto">~assignee=@My assignee
|
||||
#calendar:displayedAttributes="assignee"</code></pre>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:startDate</code>
|
||||
</td>
|
||||
<td>Allows using a different label to represent the start date, other than <code>startDate</code> (e.g. <code>expiryDate</code>).
|
||||
The label name <strong>must not be</strong> prefixed with <code>#</code>.
|
||||
If the label is not defined for a note, the default will be used instead.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:endDate</code>
|
||||
</td>
|
||||
<td>Allows using a different label to represent the start date, other than <code>endDate</code>.
|
||||
The label name <strong>must not be</strong> prefixed with <code>#</code>.
|
||||
If the label is not defined for a note, the default will be used instead.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<h2>How the calendar works</h2>
|
||||
<p>
|
||||
<img src="17_Calendar View_image.png" alt="">
|
||||
</p>
|
||||
<p>The calendar displays all the child notes of the book that have a <code>#startDate</code>.
|
||||
An <code>#endDate</code> can optionally be added.</p>
|
||||
<p>If editing the start date and end date from the note itself is desirable,
|
||||
the following attributes can be added to the book note:</p><pre><code class="language-text-x-trilium-auto">#viewType=calendar #label:startDate(inheritable)="promoted,alias=Start Date,single,date"
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>#startDate</code>
|
||||
</td>
|
||||
<td>The date the event starts, which will display it in the calendar. The
|
||||
format is <code>YYYY-MM-DD</code> (year, month and day separated by a minus
|
||||
sign).</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#endDate</code>
|
||||
</td>
|
||||
<td>Similar to <code>startDate</code>, mentions the end date if the event spans
|
||||
across multiple days. The date is inclusive, so the end day is also considered.
|
||||
The attribute can be missing for single-day events.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#color</code>
|
||||
</td>
|
||||
<td>Displays the event with a specified color (named such as <code>red</code>, <code>gray</code> or
|
||||
hex such as <code>#FF0000</code>). This will also change the color of the
|
||||
note in other places such as the note tree.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:color</code>
|
||||
</td>
|
||||
<td>Similar to <code>#color</code>, but applies the color only for the event
|
||||
in the calendar and not for other places such as the note tree.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#iconClass</code>
|
||||
</td>
|
||||
<td>If present, the icon of the note will be displayed to the left of the
|
||||
event title.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:title</code>
|
||||
</td>
|
||||
<td>Changes the title of an event to point to an attribute of the note other
|
||||
than the title, either a label (e.g. <code>#assignee</code>) or a relation
|
||||
(e.g. <code>~for</code>). See <em>Advanced use-cases</em> for more information.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:displayedAttributes</code>
|
||||
</td>
|
||||
<td>Allows displaying the value of one or more attributes in the calendar
|
||||
like this:
|
||||
<br>
|
||||
<br>
|
||||
<img src="13_Calendar View_image.png">
|
||||
<br>
|
||||
<br><code><br>#weight="70"<br>#Mood="Good"<br>#calendar:displayedAttributes="weight,Mood"<br></code>
|
||||
<br>
|
||||
<br>It can also be used with relations, case in which it will display the
|
||||
title of the target note:
|
||||
<br>
|
||||
<br><code><br>~assignee=@My assignee<br>#calendar:displayedAttributes="assignee"<br></code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:startDate</code>
|
||||
</td>
|
||||
<td>Allows using a different label to represent the start date, other than <code>startDate</code> (e.g. <code>expiryDate</code>).
|
||||
The label name <strong>must not be</strong> prefixed with <code>#</code>.
|
||||
If the label is not defined for a note, the default will be used instead.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>#calendar:endDate</code>
|
||||
</td>
|
||||
<td>Allows using a different label to represent the start date, other than <code>endDate</code>.
|
||||
The label name <strong>must not be</strong> prefixed with <code>#</code>.
|
||||
If the label is not defined for a note, the default will be used instead.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h2>How the calendar works</h2>
|
||||
<p>
|
||||
<img src="17_Calendar View_image.png">
|
||||
</p>
|
||||
<p>The calendar displays all the child notes of the book that have a <code>#startDate</code>.
|
||||
An <code>#endDate</code> can optionally be added.</p>
|
||||
<p>If editing the start date and end date from the note itself is desirable,
|
||||
the following attributes can be added to the book note:</p><pre><code class="language-text-x-trilium-auto">#viewType=calendar #label:startDate(inheritable)="promoted,alias=Start Date,single,date"
|
||||
#label:endDate(inheritable)="promoted,alias=End Date,single,date"
|
||||
#hidePromotedAttributes </code></pre>
|
||||
<p>This will result in:</p>
|
||||
<p>
|
||||
<img src="14_Calendar View_image.png" alt="">
|
||||
</p>
|
||||
<p>When not used in a Journal, the calendar is recursive. That is, it will
|
||||
look for events not just in its child notes but also in the children of
|
||||
these child notes.</p>
|
||||
<h2>Use-cases</h2>
|
||||
<h3>Using with the Journal / calendar</h3>
|
||||
<p>It is possible to integrate the calendar view into the Journal with day
|
||||
notes. In order to do so change the note type of the Journal note (calendar
|
||||
root) to Book and then select the Calendar View.</p>
|
||||
<p>Based on the <code>#calendarRoot</code> (or <code>#workspaceCalendarRoot</code>)
|
||||
attribute, the calendar will know that it's in a calendar and apply the
|
||||
following:</p>
|
||||
<ul>
|
||||
<li>The calendar events are now rendered based on their <code>dateNote</code> attribute
|
||||
rather than <code>startDate</code>.</li>
|
||||
<li>Interactive editing such as dragging over an empty era or resizing an
|
||||
event is no longer possible.</li>
|
||||
<li>Clicking on the empty space on a date will automatically open that day's
|
||||
note or create it if it does not exist.</li>
|
||||
<li>Direct children of a day note will be displayed on the calendar despite
|
||||
not having a <code>dateNote</code> attribute. Children of the child notes
|
||||
will not be displayed.</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="12_Calendar View_image.png" alt="">
|
||||
</p>
|
||||
<h3>Using a different attribute as event title</h3>
|
||||
<p>By default, events are displayed on the calendar by their note title.
|
||||
However, it is possible to configure a different attribute to be displayed
|
||||
instead.</p>
|
||||
<p>To do so, assign <code>#calendar:title</code> to the child note (not the
|
||||
calendar/book note), with the value being <code>#name</code> where <code>name</code> can
|
||||
be any label. The attribute can also come through inheritance such as a
|
||||
template attribute. If the note does not have the requested label, the
|
||||
title of the note will be used instead.</p>
|
||||
<figure class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th> </th>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="7_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
<td>
|
||||
<img src="9_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<h3>Using a relation attribute as event title</h3>
|
||||
<p>Similarly to using an attribute, use <code>#calendar:title</code> and set
|
||||
it to <code>~name</code> where <code>name</code> is the name of the relation
|
||||
to use.</p>
|
||||
<p>Moreover, if there are more relations of the same name, they will be displayed
|
||||
as multiple events coming from the same note.</p>
|
||||
<figure class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th> </th>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="8_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
<td>
|
||||
<img src="10_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<p>Note that it's even possible to have a <code>#calendar:title</code> on the
|
||||
target note (e.g. “John Smith”) which will try to render an attribute of
|
||||
it. Note that it's not possible to use a relation here as well for safety
|
||||
reasons (an accidental recursion of attributes could cause the application
|
||||
to loop infinitely).</p>
|
||||
<figure class="table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th> </th>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="15_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
<td>
|
||||
<img src="2_Calendar View_image.png" alt="">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</figure>
|
||||
<p>This will result in:</p>
|
||||
<p>
|
||||
<img src="14_Calendar View_image.png">
|
||||
</p>
|
||||
<p>When not used in a Journal, the calendar is recursive. That is, it will
|
||||
look for events not just in its child notes but also in the children of
|
||||
these child notes.</p>
|
||||
<h2>Use-cases</h2>
|
||||
<h3>Using with the Journal / calendar</h3>
|
||||
<p>It is possible to integrate the calendar view into the Journal with day
|
||||
notes. In order to do so change the note type of the Journal note (calendar
|
||||
root) to Book and then select the Calendar View.</p>
|
||||
<p>Based on the <code>#calendarRoot</code> (or <code>#workspaceCalendarRoot</code>)
|
||||
attribute, the calendar will know that it's in a calendar and apply the
|
||||
following:</p>
|
||||
<ul>
|
||||
<li>The calendar events are now rendered based on their <code>dateNote</code> attribute
|
||||
rather than <code>startDate</code>.</li>
|
||||
<li>Interactive editing such as dragging over an empty era or resizing an
|
||||
event is no longer possible.</li>
|
||||
<li>Clicking on the empty space on a date will automatically open that day's
|
||||
note or create it if it does not exist.</li>
|
||||
<li>Direct children of a day note will be displayed on the calendar despite
|
||||
not having a <code>dateNote</code> attribute. Children of the child notes
|
||||
will not be displayed.</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="12_Calendar View_image.png">
|
||||
</p>
|
||||
<h3>Using a different attribute as event title</h3>
|
||||
<p>By default, events are displayed on the calendar by their note title.
|
||||
However, it is possible to configure a different attribute to be displayed
|
||||
instead.</p>
|
||||
<p>To do so, assign <code>#calendar:title</code> to the child note (not the
|
||||
calendar/book note), with the value being <code>#name</code> where <code>name</code> can
|
||||
be any label. The attribute can also come through inheritance such as a
|
||||
template attribute. If the note does not have the requested label, the
|
||||
title of the note will be used instead.</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="7_Calendar View_image.png">
|
||||
</td>
|
||||
<td>
|
||||
<img src="9_Calendar View_image.png">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Using a relation attribute as event title</h3>
|
||||
<p>Similarly to using an attribute, use <code>#calendar:title</code> and set
|
||||
it to <code>~name</code> where <code>name</code> is the name of the relation
|
||||
to use.</p>
|
||||
<p>Moreover, if there are more relations of the same name, they will be displayed
|
||||
as multiple events coming from the same note.</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="8_Calendar View_image.png">
|
||||
</td>
|
||||
<td>
|
||||
<img src="10_Calendar View_image.png">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Note that it's even possible to have a <code>#calendar:title</code> on the
|
||||
target note (e.g. “John Smith”) which will try to render an attribute of
|
||||
it. Note that it's not possible to use a relation here as well for safety
|
||||
reasons (an accidental recursion of attributes could cause the application
|
||||
to loop infinitely).</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="15_Calendar View_image.png">
|
||||
</td>
|
||||
<td>
|
||||
<img src="2_Calendar View_image.png">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
<p>For shorter snippets of code that can be embedded in <a href="Text.html">Text</a> notes,
|
||||
see <a href="Text/Code%20blocks.html">Code blocks</a>.</p>
|
||||
<p>
|
||||
<img src="Code_image.png" alt="">
|
||||
<img src="Code_image.png">
|
||||
</p>
|
||||
<h2>Adjusting the language of a code note</h2>
|
||||
<p>In the <a href="../Basic%20Concepts/UI%20Elements/Ribbon.html">Ribbon</a>,
|
||||
@@ -39,7 +39,7 @@
|
||||
note types. Inside of it there will be a section called <em>Code</em>, select
|
||||
any one of the languages.</p>
|
||||
<p>
|
||||
<img src="1_Code_image.png" alt="">
|
||||
<img src="1_Code_image.png">
|
||||
</p>
|
||||
<h2>Adjusting the list of languages</h2>
|
||||
<p>Trilium supports syntax highlighting for many languages, but by default
|
||||
|
||||
@@ -104,7 +104,7 @@ module.exports = WordCountWidget;</code></pre>
|
||||
<h3>Example screenshot</h3>
|
||||
<p>On the bottom you can see the resulting widget:</p>
|
||||
<p>
|
||||
<img src="../../Attachments/Custom-widget%20image.png" alt="">
|
||||
<img src="../../Attachments/Custom-widget%20image.png">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
the Trilium interface which will allow user to easily add new Task (TODO
|
||||
item).</p>
|
||||
<p>
|
||||
<img src="../../Attachments/button-script.png" alt="">
|
||||
<img src="../../Attachments/button-script.png">
|
||||
</p>
|
||||
<p>First take a look at the red circle all the way on the top - this what
|
||||
we want to achieve - new button in UI which will create new note representing
|
||||
|
||||
@@ -26,20 +26,21 @@
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="8_Geo map_image.png" alt="">
|
||||
<img src="8_Geo map_image.png">
|
||||
</td>
|
||||
<td>Right click on any note on the note tree and select <em>Insert child note</em> → <em>Geo Map (beta)</em>.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="10_Geo map_image.png" alt="">
|
||||
<img src="10_Geo map_image.png">
|
||||
</td>
|
||||
<td>By default the map will be empty and will show the entire world.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Repositioning the map</h2>
|
||||
|
||||
<h2>Repositioning the map</h2>
|
||||
<ul>
|
||||
<li>Click and drag the map in order to move across the map.</li>
|
||||
<li>Use the mouse wheel, two-finger gesture on a touchpad or the +/- buttons
|
||||
@@ -62,16 +63,16 @@
|
||||
<td></td>
|
||||
<td>To create a marker, first navigate to the desired point on the map. Then
|
||||
press the
|
||||
<img src="16_Geo map_image.png" alt="">button on the top-right of the map.
|
||||
<img src="16_Geo map_image.png">button on the top-right of the map.
|
||||
<br>
|
||||
<br>If the button is not visible, make sure the button section is visible
|
||||
by pressing the chevron button (
|
||||
<img src="2_Geo map_image.png" alt="">) in the top-right of the map.</td>
|
||||
<img src="2_Geo map_image.png">) in the top-right of the map.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="3_Geo map_image.png" alt="">
|
||||
<img src="3_Geo map_image.png">
|
||||
</td>
|
||||
<td>Once pressed, the map will enter in the insert mode, as illustrated by
|
||||
the notification.
|
||||
@@ -82,25 +83,26 @@
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>
|
||||
<img src="9_Geo map_image.png" alt="">
|
||||
<img src="9_Geo map_image.png">
|
||||
</td>
|
||||
<td>Enter the name of the marker/note to be created.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>
|
||||
<img src="17_Geo map_image.png" alt="">
|
||||
<img src="17_Geo map_image.png">
|
||||
</td>
|
||||
<td>Once confirmed, the marker will show up on the map and it will also be
|
||||
displayed as a child note of the map.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>How the location of the markers is stored</h2>
|
||||
|
||||
<h2>How the location of the markers is stored</h2>
|
||||
<p>The location of a marker is stored in the <code>#geolocation</code> attribute
|
||||
of the child notes:</p>
|
||||
<p>
|
||||
<img src="18_Geo map_image.png" alt="">
|
||||
<img src="18_Geo map_image.png">
|
||||
</p>
|
||||
<p>This value can be added manually if needed. The value of the attribute
|
||||
is made up of the latitude and longitude separated by a comma.</p>
|
||||
@@ -155,7 +157,7 @@
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="12_Geo map_image.png" alt="">
|
||||
<img src="12_Geo map_image.png">
|
||||
</td>
|
||||
<td>Go to Google Maps on the web and look for a desired location, right click
|
||||
on it and a context menu will show up.
|
||||
@@ -169,14 +171,14 @@
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="5_Geo map_image.png" alt="">
|
||||
<img src="5_Geo map_image.png">
|
||||
</td>
|
||||
<td>In Trilium, create a child note under the map.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>
|
||||
<img src="11_Geo map_image.png" alt="">
|
||||
<img src="11_Geo map_image.png">
|
||||
</td>
|
||||
<td>And then go to Owned Attributes and type <code>#geolocation="</code>, then
|
||||
paste from the clipboard as-is and then add the ending <code>"</code> character.
|
||||
@@ -185,7 +187,8 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h3>Adding from OpenStreetMap</h3>
|
||||
|
||||
<h3>Adding from OpenStreetMap</h3>
|
||||
<p>Similarly to the Google Maps approach:</p>
|
||||
<table>
|
||||
<thead>
|
||||
@@ -199,7 +202,7 @@
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="1_Geo map_image.png" alt="">
|
||||
<img src="1_Geo map_image.png">
|
||||
</td>
|
||||
<td>Go to any location on openstreetmap.org and right click to bring up the
|
||||
context menu. Select the “Show address” item.</td>
|
||||
@@ -207,7 +210,7 @@
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="Geo map_image.png" alt="">
|
||||
<img src="Geo map_image.png">
|
||||
</td>
|
||||
<td>The address will be visible in the top-left of the screen, in the place
|
||||
of the search bar.
|
||||
@@ -217,14 +220,15 @@
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>
|
||||
<img src="6_Geo map_image.png" alt="">
|
||||
<img src="6_Geo map_image.png">
|
||||
</td>
|
||||
<td>Simply paste the value inside the text box into the <code>#geolocation</code> attribute
|
||||
of a child note of the map and then it should be displayed on the map.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Adding GPS tracks (.gpx)</h2>
|
||||
|
||||
<h2>Adding GPS tracks (.gpx)</h2>
|
||||
<p>Trilium has basic support for displaying GPS tracks on the geo map.</p>
|
||||
<table>
|
||||
<thead>
|
||||
@@ -238,7 +242,7 @@
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<img src="4_Geo map_image.png" alt="">
|
||||
<img src="4_Geo map_image.png">
|
||||
</td>
|
||||
<td>To add a track, simply drag & drop a .gpx file inside the geo map
|
||||
in the note tree.</td>
|
||||
@@ -246,7 +250,7 @@
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>
|
||||
<img src="15_Geo map_image.png" alt="">
|
||||
<img src="15_Geo map_image.png">
|
||||
</td>
|
||||
<td>In order for the file to be recognized as a GPS track, it needs to show
|
||||
up as <code>application/gpx+xml</code> in the <em>File type</em> field.</td>
|
||||
@@ -254,7 +258,7 @@
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>
|
||||
<img src="7_Geo map_image.png" alt="">
|
||||
<img src="7_Geo map_image.png">
|
||||
</td>
|
||||
<td>When going back to the map, the track should now be visible.
|
||||
<br>
|
||||
@@ -262,9 +266,10 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Troubleshooting</h2>
|
||||
|
||||
<h2>Troubleshooting</h2>
|
||||
<p>
|
||||
<img src="13_Geo map_image.png" alt="">
|
||||
<img src="13_Geo map_image.png">
|
||||
</p>
|
||||
<h3>Grid-like artifacts on the map</h3>
|
||||
<p>This occurs if the application is not at 100% zoom which causes the pixels
|
||||
|
||||
@@ -37,10 +37,10 @@ config:
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="Mermaid%20Diagrams/ELK%20off.txt" alt="">
|
||||
<img src="Mermaid%20Diagrams/ELK%20off.txt">
|
||||
</td>
|
||||
<td>
|
||||
<img src="Mermaid%20Diagrams/ELK%20on.txt" alt="">
|
||||
<img src="Mermaid%20Diagrams/ELK%20on.txt">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
@@ -36,7 +36,7 @@
|
||||
</ul>
|
||||
<p>In both cases, it is possible to switch back to editable mode using the
|
||||
<img
|
||||
src="Text_bx-edit-alt.svg" alt="">button at top right of page.</p>
|
||||
src="Text_bx-edit-alt.svg">button at top right of page.</p>
|
||||
<p>For more information, see <a href="../Basic%20Concepts/Note/Read-Only%20Notes.html">Read-Only Notes</a>.</p>
|
||||
<h2>General Formatting</h2>
|
||||
<p>Since Trilium uses CKEditor, all of its formatting options are available
|
||||
@@ -72,7 +72,7 @@
|
||||
<p>CKEditor supports a markdown-like editing experience, recognising syntax
|
||||
and automatically converting it to rich text.</p>
|
||||
<p>
|
||||
<img src="Text_image.png" alt="">
|
||||
<img src="Text_image.png">
|
||||
</p>
|
||||
<p>Complete documentation for this feature is available in the <a href="https://ckeditor.com/docs/ckeditor5/latest/features/autoformat.html">CKEditor documentation</a>.</p>
|
||||
<p>If autoformatting is not desirable, press <kbd>Ctrl</kbd> + <kbd>Z</kbd> to
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="1_Code blocks_image.png" alt="">
|
||||
<img src="1_Code blocks_image.png">
|
||||
</p>
|
||||
<p>The code blocks feature allows entering pieces of code in text notes.</p>
|
||||
<p>Note that this feature is meant for generally small snippets of code.
|
||||
@@ -24,7 +24,7 @@
|
||||
<ul>
|
||||
<li>Via the <a href="Formatting%20toolbar.html">Formatting toolbar</a>, look
|
||||
for the
|
||||
<img src="Code blocks_image.png" alt="">button.
|
||||
<img src="Code blocks_image.png">button.
|
||||
<ul>
|
||||
<li>Pressing directly on the icon will insert a code block with the language
|
||||
that was selected most recently. If this is the first time a code block
|
||||
@@ -55,7 +55,7 @@
|
||||
<p>Simply click anywhere inside the code block and press again the code block
|
||||
button in the <a href="Formatting%20toolbar.html">Formatting toolbar</a>:
|
||||
<br>
|
||||
<img src="2_Code blocks_image.png" alt="">
|
||||
<img src="2_Code blocks_image.png">
|
||||
</p>
|
||||
<h2>Adjusting the list of languages</h2>
|
||||
<p>The code blocks feature shares the list of languages with the <a href="../Code.html">Code Notes</a> note
|
||||
|
||||
@@ -14,8 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="api/images/4yHAD34xyvAl/Content language & Right-t.png"
|
||||
alt="">
|
||||
<img src="api/images/JShOeO3gLTrk/Content language & Right-t.png">
|
||||
</p>
|
||||
<p>A language hint can be provided for text notes. This option informs the
|
||||
browser or the desktop application about the language the note is written
|
||||
|
||||
@@ -25,17 +25,17 @@
|
||||
<p>The first popup is the block-level popup. This will appear to the left
|
||||
of the current paragraph you are currently editing, as a sequence of dots:
|
||||
<br>
|
||||
<img src="1_Formatting toolbar_image.png" alt="">
|
||||
<img src="1_Formatting toolbar_image.png">
|
||||
</p>
|
||||
<p>Clicking this popup will reveal the formatting options that are specific
|
||||
to the entire paragraph, such as setting a heading, lists, tables, etc.</p>
|
||||
<p>
|
||||
<img src="3_Formatting toolbar_image.png" alt="">
|
||||
<img src="3_Formatting toolbar_image.png">
|
||||
</p>
|
||||
<h3>Inline popup</h3>
|
||||
<p>The inline popup appears automatically when selecting a text:</p>
|
||||
<p>
|
||||
<img src="Formatting toolbar_image.png" alt="">
|
||||
<img src="Formatting toolbar_image.png">
|
||||
</p>
|
||||
<p>All the options here apply only to the selected portion of text, such
|
||||
as changing the font size, or making the text bold.</p>
|
||||
@@ -45,7 +45,7 @@
|
||||
<p>All the options are combined into a single toolbar that will appear as
|
||||
part of the <a href="../../Basic%20Concepts/UI%20Elements/Ribbon.html">Ribbon</a>.</p>
|
||||
<p>
|
||||
<img src="2_Formatting toolbar_image.png" alt="">
|
||||
<img src="2_Formatting toolbar_image.png">
|
||||
</p>
|
||||
<p>By default, if the toolbar does not fit on the screen, the rest of the
|
||||
options will be grouped into a single option at the end. It is possible
|
||||
|
||||
@@ -17,11 +17,11 @@
|
||||
<h3>Keyboard shortcuts</h3>
|
||||
<p>This allows marking a portion of text as a shortcut key.</p>
|
||||
<p>
|
||||
<img src="Formatting_image.png" alt="">
|
||||
<img src="Formatting_image.png">
|
||||
</p>
|
||||
<p>To apply this style, press the
|
||||
<img src="2_Formatting_image.png" alt="">button in
|
||||
<img src="1_Formatting_image.png" alt="">group from the <a href="Formatting%20toolbar.html">Formatting toolbar</a>.
|
||||
<img src="2_Formatting_image.png">button in
|
||||
<img src="1_Formatting_image.png">group from the <a href="Formatting%20toolbar.html">Formatting toolbar</a>.
|
||||
On the floating toolbar, the buttons appear when selecting a text.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -24,18 +24,18 @@
|
||||
<p>To add an image to the note, simply drag it from file explorer onto the
|
||||
note editor inside Trilium and the image will be uploaded.</p>
|
||||
<p>
|
||||
<img src="10_Images_image.png" alt="">
|
||||
<img src="10_Images_image.png">
|
||||
</p>
|
||||
<p>Alternatively you can click on block toolbar and then on "Insert image":</p>
|
||||
<p>
|
||||
<img src="8_Images_image.png" alt="">
|
||||
<img src="8_Images_image.png">
|
||||
</p>
|
||||
<p>You can also copy and paste an image from web - the image will be (asynchronously)
|
||||
downloaded and embedded.</p>
|
||||
<h2>Configuring the images</h2>
|
||||
<p>Clicking on an image will reveal a popup with multiple options:
|
||||
<br>
|
||||
<img src="11_Images_image.png" alt="">
|
||||
<img src="11_Images_image.png">
|
||||
</p>
|
||||
<h3>Alignment</h3>
|
||||
<p>The first set of options configure the alignment are, in order:</p>
|
||||
@@ -51,11 +51,11 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="7_Images_image.png" alt="">
|
||||
<img src="7_Images_image.png">
|
||||
</td>
|
||||
<td>Inline</td>
|
||||
<td>
|
||||
<img src="2_Images_image.png" alt="">
|
||||
<img src="2_Images_image.png">
|
||||
</td>
|
||||
<td>As the name suggests, the name can be put inside a paragraph and moved
|
||||
around similarly as if it was a block of text. Use drag & drop or cut-paste
|
||||
@@ -63,32 +63,32 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="12_Images_image.png" alt="">
|
||||
<img src="12_Images_image.png">
|
||||
</td>
|
||||
<td>Centered image</td>
|
||||
<td>
|
||||
<img src="3_Images_image.png" alt="">
|
||||
<img src="3_Images_image.png">
|
||||
</td>
|
||||
<td>The image will be displayed as a block and centered, not allowing text
|
||||
in either the left or right of it.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="5_Images_image.png" alt="">
|
||||
<img src="5_Images_image.png">
|
||||
</td>
|
||||
<td>Wrap text</td>
|
||||
<td>
|
||||
<img src="9_Images_image.png" alt="">
|
||||
<img src="9_Images_image.png">
|
||||
</td>
|
||||
<td>The image will be displayed to the left or the right of the text.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="Images_image.png" alt="">
|
||||
<img src="Images_image.png">
|
||||
</td>
|
||||
<td>Block align</td>
|
||||
<td>
|
||||
<img src="4_Images_image.png" alt="">
|
||||
<img src="4_Images_image.png">
|
||||
</td>
|
||||
<td>Similarly to <em>Centered image</em>, the image will be displayed as a
|
||||
block and aligned either to the left or to the right, but not allowing
|
||||
@@ -96,7 +96,8 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Compression</h2>
|
||||
|
||||
<h2>Compression</h2>
|
||||
<p>Since Trilium isn't really meant to be primary storage for image data,
|
||||
it attempts to compress and resize (with pretty aggressive settings) uploaded
|
||||
images before storing them to the database. You may then notice some quality
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
link, select text and press <kbd>Ctrl</kbd> + <kbd>K</kbd> or wait for the
|
||||
"balloon" to appear and click link icon there.</p>
|
||||
<p>
|
||||
<img src="../../Attachments/create-external-link.gif" alt="">
|
||||
<img src="../../Attachments/create-external-link.gif">
|
||||
</p>
|
||||
<p>You can follow external link by either double clicking (will open new
|
||||
tab/window) it or right clicking on them and choosing "Open in new tab".</p>
|
||||
@@ -39,7 +39,7 @@
|
||||
- you link to a particular note and can choose the link title</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="../../Attachments/create-link-to-note.gif" alt="">
|
||||
<img src="../../Attachments/create-link-to-note.gif">
|
||||
</p>
|
||||
<p>You can follow the note link by double clicking it.</p>
|
||||
<p>Alternatively if you only wish to quickly preview the content, you can
|
||||
|
||||
@@ -41,38 +41,38 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="5_Lists_image.png" alt="">
|
||||
<img src="5_Lists_image.png">
|
||||
</td>
|
||||
<td>First, create a list.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="3_Lists_image.png" alt="">
|
||||
<img src="3_Lists_image.png">
|
||||
</td>
|
||||
<td>Press Enter to create a new list item.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="4_Lists_image.png" alt="">
|
||||
<img src="4_Lists_image.png">
|
||||
</td>
|
||||
<td>Press Backspace to get rid of the bullet point. Notice the cursor position.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="1_Lists_image.png" alt="">
|
||||
<img src="1_Lists_image.png">
|
||||
</td>
|
||||
<td>At this point, insert any desired block-level item such as a code block.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="Lists_image.png" alt="">
|
||||
<img src="Lists_image.png">
|
||||
</td>
|
||||
<td>To continue with a new bullet point, press Enter until the cursor moves
|
||||
to a new blank position.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="2_Lists_image.png" alt="">
|
||||
<img src="2_Lists_image.png">
|
||||
</td>
|
||||
<td>Press Enter once more to create the new bullet.</td>
|
||||
</tr>
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="5_Creating a custom theme_im.png" alt="">
|
||||
<img src="5_Creating a custom theme_im.png">
|
||||
</td>
|
||||
<td>Themes are code notes with a special attribute. Start by creating a new
|
||||
code note.</td>
|
||||
@@ -47,7 +47,8 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Step 3. Define the theme's CSS</h2>
|
||||
|
||||
<h2>Step 3. Define the theme's CSS</h2>
|
||||
<p>As a very simple example we will change the background color of the launcher
|
||||
pane to a shade of blue.</p>
|
||||
<p>To alter the different variables of the theme:</p><pre><code class="language-text-css">:root {
|
||||
|
||||
@@ -25,19 +25,19 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="Custom app-wide CSS_image.png" alt="">
|
||||
<img src="Custom app-wide CSS_image.png">
|
||||
</td>
|
||||
<td>Start by creating a new note and changing the note type to CSS</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="1_Custom app-wide CSS_image.png" alt="">
|
||||
<img src="1_Custom app-wide CSS_image.png">
|
||||
</td>
|
||||
<td>In the ribbon, press the “Owned Attributes” section and type <code>#appCss</code>.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img src="2_Custom app-wide CSS_image.png" alt="">
|
||||
<img src="2_Custom app-wide CSS_image.png">
|
||||
</td>
|
||||
<td>Type the desired CSS.
|
||||
<br>
|
||||
@@ -46,7 +46,8 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2>Seeing the changes</h2>
|
||||
|
||||
<h2>Seeing the changes</h2>
|
||||
<p>Adding a new <em>app CSS note</em> or modifying an existing one does not
|
||||
immediately apply changes. To see the changes, press Ctrl+Shift+R to refresh
|
||||
the page first.</p>
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
onto the existing theme. The <code>appTheme</code> attribute must also be
|
||||
present.</p>
|
||||
<p>
|
||||
<img src="Customize the Next theme_i.png" alt="">
|
||||
<img src="Customize the Next theme_i.png">
|
||||
</p>
|
||||
<p>The <code>appThemeBase</code> label can be set to one of the following values:</p>
|
||||
<ul>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<div class="ck-content">
|
||||
<p>
|
||||
<img src="Anonymized Database_image.png" alt="">
|
||||
<img src="Anonymized Database_image.png">
|
||||
</p>
|
||||
<p>In certain scenarios, understanding the structure of a database is crucial
|
||||
for troubleshooting issues. However, sharing your actual <a href="../Advanced%20Usage/Database.html">database</a> file
|
||||
|
||||
@@ -35,11 +35,11 @@
|
||||
<li>In Firefox/Chrome right-click anywhere in the page and click Inspect:</li>
|
||||
</ul>
|
||||
<p>
|
||||
<img src="../Attachments/error-logs-firefox-context.png" alt="">
|
||||
<img src="../Attachments/error-logs-firefox-context.png">
|
||||
</p>
|
||||
<p>Once you have Dev Tools open, click on "Console" tab:</p>
|
||||
<p>
|
||||
<img src="Error logs_image.png" alt="">
|
||||
<img src="Error logs_image.png">
|
||||
</p>
|
||||
<p>Copy-paste (or screenshot) the logs. It's better to provide not just errors,
|
||||
but the whole log, which might provide context while analyzing the bug.</p>
|
||||
@@ -56,7 +56,7 @@
|
||||
<p>In such case, please export the relevant note subtree by right-clicking
|
||||
it on the left tree, choosing Export - HTML as ZIP:</p>
|
||||
<p>
|
||||
<img src="../Attachments/error-logs-export-subtree.png" alt="">
|
||||
<img src="../Attachments/error-logs-export-subtree.png">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
132
src/public/app/doc_notes/en/User Guide/navigation.html
generated
132
src/public/app/doc_notes/en/User Guide/navigation.html
generated
@@ -78,6 +78,72 @@
|
||||
</li>
|
||||
<li><a href="User%20Guide/Quick%20Start.html" target="detail">Quick Start</a>
|
||||
</li>
|
||||
<li>Installation & Setup
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Desktop%20Installation.html"
|
||||
target="detail">Desktop Installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation.html"
|
||||
target="detail">Server Installation</a>
|
||||
<ul>
|
||||
<li>1. Installing the server
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Packaged%20server%20installation.html"
|
||||
target="detail">Packaged server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Docker%20Server%20Installation.html"
|
||||
target="detail">Docker Server Installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/NixOS%20server%20installation.html"
|
||||
target="detail">NixOS server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Manual%20server%20installation.html"
|
||||
target="detail">Manual server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Kubernetes%20server%20installation.html"
|
||||
target="detail">Kubernetes server installation</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>2. Reverse proxy
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/2.%20Reverse%20proxy/Nginx.html"
|
||||
target="detail">Nginx</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/2.%20Reverse%20proxy/Apache.html"
|
||||
target="detail">Apache</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/TLS%20Configuration.html"
|
||||
target="detail">TLS Configuration</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/Multi-Factor%20Authentication.html"
|
||||
target="detail">Multi-Factor Authentication</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/Reverse%20proxy%20setup.html"
|
||||
target="detail">Reverse proxy setup</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Synchronization.html"
|
||||
target="detail">Synchronization</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Mobile%20Frontend.html"
|
||||
target="detail">Mobile Frontend</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Web%20Clipper.html" target="detail">Web Clipper</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Upgrading%20TriliumNext.html"
|
||||
target="detail">Upgrading TriliumNext</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Backup.html" target="detail">Backup</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Data%20directory.html"
|
||||
target="detail">Data directory</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Basic Concepts
|
||||
<ul>
|
||||
<li>UI Elements
|
||||
@@ -285,72 +351,6 @@
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Installation & Setup
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Desktop%20Installation.html"
|
||||
target="detail">Desktop Installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation.html"
|
||||
target="detail">Server Installation</a>
|
||||
<ul>
|
||||
<li>1. Installing the server
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Packaged%20server%20installation.html"
|
||||
target="detail">Packaged server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Docker%20Server%20Installation.html"
|
||||
target="detail">Docker Server Installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/NixOS%20server%20installation.html"
|
||||
target="detail">NixOS server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Manual%20server%20installation.html"
|
||||
target="detail">Manual server installation</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/1.%20Installing%20the%20server/Kubernetes%20server%20installation.html"
|
||||
target="detail">Kubernetes server installation</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>2. Reverse proxy
|
||||
<ul>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/2.%20Reverse%20proxy/Nginx.html"
|
||||
target="detail">Nginx</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/2.%20Reverse%20proxy/Apache.html"
|
||||
target="detail">Apache</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/TLS%20Configuration.html"
|
||||
target="detail">TLS Configuration</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/Multi-Factor%20Authentication.html"
|
||||
target="detail">Multi-Factor Authentication</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Server%20Installation/Reverse%20proxy%20setup.html"
|
||||
target="detail">Reverse proxy setup</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Synchronization.html"
|
||||
target="detail">Synchronization</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Mobile%20Frontend.html"
|
||||
target="detail">Mobile Frontend</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Web%20Clipper.html" target="detail">Web Clipper</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Upgrading%20TriliumNext.html"
|
||||
target="detail">Upgrading TriliumNext</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Backup.html" target="detail">Backup</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Installation%20%26%20Setup/Data%20directory.html"
|
||||
target="detail">Data directory</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="User%20Guide/FAQ.html" target="detail">FAQ</a>
|
||||
</li>
|
||||
<li><a href="User%20Guide/Troubleshooting.html" target="detail">Troubleshooting</a>
|
||||
|
||||
1
src/public/app/doc_notes/en/User Guide/style.css
generated
1
src/public/app/doc_notes/en/User Guide/style.css
generated
@@ -27,6 +27,7 @@
|
||||
margin: 1.25em 0;
|
||||
margin-right: 14px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ck-content .admonition p:last-child {
|
||||
|
||||
Reference in New Issue
Block a user