mirror of
https://github.com/TriliumNext/Notes.git
synced 2025-07-27 18:12:29 +08:00
chore(docs): update to match new img handling
This commit is contained in:
parent
3eaa68da23
commit
132a8f7c65
File diff suppressed because it is too large
Load Diff
@ -52,7 +52,7 @@ For each note of the calendar, the following attributes can be used:
|
||||
| `#calendar:color` | Similar to `#color`, but applies the color only for the event in the calendar and not for other places such as the note tree. |
|
||||
| `#iconClass` | If present, the icon of the note will be displayed to the left of the event title. |
|
||||
| `#calendar:title` | Changes the title of an event to point to an attribute of the note other than the title, either a label (e.g. `#assignee`) or a relation (e.g. `~for`). See _Advanced use-cases_ for more information. |
|
||||
| `#calendar:displayedAttributes` | Allows displaying the value of one or more attributes in the calendar like this: <br><br><br><br>```<br>#weight="70"<br>#Mood="Good"<br>#calendar:displayedAttributes="weight,Mood"<br>```<br><br>It can also be used with relations, case in which it will display the title of the target note:<br><br>```<br>~assignee=@My assignee<br>#calendar:displayedAttributes="assignee"<br>``` |
|
||||
| `#calendar:displayedAttributes` | Allows displaying the value of one or more attributes in the calendar like this: <br> <br> <br> <br>`<br>#weight="70"<br>#Mood="Good"<br>#calendar:displayedAttributes="weight,Mood"<br>` <br> <br>It can also be used with relations, case in which it will display the title of the target note: <br> <br>`<br>~assignee=@My assignee<br>#calendar:displayedAttributes="assignee"<br>` |
|
||||
| `#calendar:startDate` | Allows using a different label to represent the start date, other than `startDate` (e.g. `expiryDate`). The label name **must not be** prefixed with `#`. If the label is not defined for a note, the default will be used instead. |
|
||||
| `#calendar:endDate` | Allows using a different label to represent the start date, other than `endDate`. The label name **must not be** prefixed with `#`. If the label is not defined for a note, the default will be used instead. |
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
# Content language & Right-to-left support
|
||||

|
||||

|
||||
|
||||
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 in (for example this might help with spellchecking), and it also determines whether the text is displayed from right-to-left for languages such as Arabic, Hebrew, etc.
|
||||
|
||||
|
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 {
|
||||
|
Loading…
x
Reference in New Issue
Block a user