From 173fa36fca9598f2bcf3afa2bee820996f91eba1 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sat, 5 Apr 2025 03:33:53 +0300 Subject: [PATCH] chore(docs): bring back figure sizes --- docs/User Guide/!!!meta.json | 7 + .../Navigation/Jump to Note.md | 2 +- .../Navigation/Quick search.md | 2 +- .../Notes/Note List.md | 6 +- .../Notes/Note List/Calendar View.md | 37 +- .../UI Elements/Floating buttons.md | 2 +- .../UI Elements/Options.md | 2 +- .../UI Elements/Split View.md | 6 +- .../UI Elements/Tabs.md | 2 +- docs/User Guide/User Guide/Note Types.md | 2 +- .../Code/Scripts/New Task launcher button.md | 2 +- docs/User Guide/User Guide/Note Types/File.md | 17 +- .../User Guide/Note Types/Geo Map.md | 38 +- .../User Guide/Note Types/Mermaid Diagrams.md | 2 +- .../User Guide/Note Types/Mind Map.md | 2 +- .../User Guide/Note Types/Note Map.md | 2 +- .../Text/Images/Image references.md | 4 +- .../Note Types/Text/Include Note.md | 2 +- .../app/doc_notes/en/User Guide/!!!meta.json | 7 + .../Navigation/Jump to Note.html | 4 +- .../Navigation/Quick search.html | 3 +- .../Notes/Note List.html | 11 +- .../Notes/Note List/Calendar View.html | 606 +++++++++--------- .../Notes/Read-Only Notes.html | 33 +- .../UI Elements/Floating buttons.html | 2 +- .../UI Elements/Options.html | 8 +- .../UI Elements/Split View.html | 18 +- .../UI Elements/Tabs.html | 11 +- .../en/User Guide/User Guide/Note Types.html | 176 +++-- .../Scripts/New Task launcher button.html | 182 +++--- .../User Guide/Note Types/File.html | 51 +- .../User Guide/Note Types/Geo Map.html | 127 ++-- .../Note Types/Mermaid Diagrams.html | 7 +- .../Mermaid Diagrams/ELK layout.html | 45 +- .../User Guide/Note Types/Mind Map.html | 2 +- .../User Guide/Note Types/Note Map.html | 6 +- .../Text/Images/Image references.html | 5 +- .../Note Types/Text/Include Note.html | 2 +- 38 files changed, 728 insertions(+), 715 deletions(-) diff --git a/docs/User Guide/!!!meta.json b/docs/User Guide/!!!meta.json index d5c9310de..b0a615bd2 100644 --- a/docs/User Guide/!!!meta.json +++ b/docs/User Guide/!!!meta.json @@ -1715,6 +1715,13 @@ "value": "bx bx-cog", "isInheritable": false, "position": 10 + }, + { + "type": "relation", + "name": "internalLink", + "value": "_options", + "isInheritable": false, + "position": 60 } ], "format": "markdown", diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.md b/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.md index 7b83f8c1d..065731948 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.md @@ -1,5 +1,5 @@ # Jump to Note -![](Jump%20to%20Note_image.png) +
The _Jump to Note_ function allows easy navigation between notes by searching for their title. In addition to that, it can also trigger a full search or create notes. diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.md b/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.md index e92b8c6ac..213156e1d 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.md @@ -1,5 +1,5 @@ # Quick search -![](Quick%20search_image.png) +
The _Quick search_ function does a full-text search (that is, it searches through the content of notes and not just the title of a note) and displays the result in an easy-to-access manner. diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.md b/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.md index 55ba11ee4..d2fea88f5 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.md @@ -10,7 +10,7 @@ By default, the notes will be displayed in a grid, however there are also some o ### Grid view -![](1_Note%20List_image.png) +
This view presents the child notes in a grid format, allowing for a more visual navigation experience. @@ -23,12 +23,12 @@ This is the default view type. ### List view -![](Note%20List_image.png) +
In the list view mode, each note is displayed in a single row with only the title and the icon of the note being visible by the default. By pressing the expand button it's possible to view the content of the note, as well as the children of the note (recursively). ### Calendar view -![](2_Note%20List_image.png) +
In the calendar view, child notes are represented as events, with a start date and optionally an end date. The view also has interaction support such as moving or creating new events. See Calendar View for more information. \ No newline at end of file diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.md b/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.md index 77b6ad014..abaa58bc8 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.md @@ -1,5 +1,5 @@ # Calendar View -![](4_Calendar%20View_image.png) +
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. @@ -14,10 +14,7 @@ Unlike other Book view types, the Calendar view also allows some kind of interac ## Creating a calendar -| | | | -| --- | --- | --- | -| 1 | ![](2_Calendar%20View_image.png) | 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 _Book_. | -| 2 | ![](3_Calendar%20View_image.png) | Once created, the “View type” of the Book needs changed to “Calendar”, by selecting the “Book Properties” tab in the ribbon. | +
   
1The 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 Book.
2Once created, the “View type” of the Book needs changed to “Calendar”, by selecting the “Book Properties” tab in the ribbon.
## Creating a new event/note @@ -39,7 +36,7 @@ Unlike other Book view types, the Calendar view also allows some kind of interac The following attributes can be added to the book type: -
NameDescription
#calendar:hideWeekendsWhen present (regardless of value), it will hide Saturday and Sundays from the calendar.
#calendar:weekNumbersWhen present (regardless of value), it will show the number of the week on the calendar.
#calendar:view

Which view to display in the calendar:

  • timeGridWeek for the week view;
  • dayGridMonth for the month view;
  • multiMonthYear for the year view;
  • listMonth for the list view.

Any other value will be dismissed and the default view (month) will be used instead.

The value of this label is automatically updated when changing the view using the UI buttons.

~child:templateDefines the template for newly created notes in the calendar (via dragging or clicking).
+
NameDescription
#calendar:hideWeekendsWhen present (regardless of value), it will hide Saturday and Sundays from the calendar.
#calendar:weekNumbersWhen present (regardless of value), it will show the number of the week on the calendar.
#calendar:view

Which view to display in the calendar:

  • timeGridWeek for the week view;
  • dayGridMonth for the month view;
  • multiMonthYear for the year view;
  • listMonth for the list view.

Any other value will be dismissed and the default view (month) will be used instead.

The value of this label is automatically updated when changing the view using the UI buttons.

~child:templateDefines the template for newly created notes in the calendar (via dragging or clicking).
In addition, the first day of the week can be either Sunday or Monday and can be adjusted from the application settings. @@ -47,21 +44,7 @@ In addition, the first day of the week can be either Sunday or Monday and can be For each note of the calendar, the following attributes can be used: -| Name | Description | -| --- | --- | -| `#startDate` | The date the event starts, which will display it in the calendar. The format is `YYYY-MM-DD` (year, month and day separated by a minus sign). | -| `#endDate` | Similar to `startDate`, 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. | -| `#startTime` | The time the event starts at. If this value is missing, then the event is considered a full-day event. The format is `HH:MM` (hours in 24-hour format and minutes). | -| `#endTime` | Similar to `startTime`, it mentions the time at which the event ends (in relation with `endDate` if present, or `startDate`). | -| `#color` | Displays the event with a specified color (named such as `red`, `gray` or hex such as `#FF0000`). This will also change the color of the note in other places such as the note tree. | -| `#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, can either a label or a relation (without the `#` or `~` symbol). See _Use-cases_ for more information. | -| `#calendar:displayedAttributes` | Allows displaying the value of one or more attributes in the calendar like this:   

![](9_Calendar%20View_image.png)  

`#weight="70" #Mood="Good" #calendar:displayedAttributes="weight,Mood"` 

It can also be used with relations, case in which it will display the title of the target note:  

`~assignee=@My assignee #calendar:displayedAttributes="assignee"` | -| `#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` | Similar to `#calendar:startDate`, allows changing the attribute which is being used to read the end date. | -| `#calendar:startTime` | Similar to `#calendar:startDate`, allows changing the attribute which is being used to read the start time. | -| `#calendar:endTime` | Similar to `#calendar:startDate`, allows changing the attribute which is being used to read the end time. | +
NameDescription
#startDateThe date the event starts, which will display it in the calendar. The format is YYYY-MM-DD (year, month and day separated by a minus sign).
#endDateSimilar to startDate, 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.
#startTimeThe time the event starts at. If this value is missing, then the event is considered a full-day event. The format is HH:MM (hours in 24-hour format and minutes).
#endTimeSimilar to startTime, it mentions the time at which the event ends (in relation with endDate if present, or startDate).
#colorDisplays the event with a specified color (named such as red, gray or hex such as #FF0000). This will also change the color of the note in other places such as the note tree.
#calendar:colorSimilar to #color, but applies the color only for the event in the calendar and not for other places such as the note tree.
#iconClassIf present, the icon of the note will be displayed to the left of the event title.
#calendar:titleChanges the title of an event to point to an attribute of the note other than the title, can either a label or a relation (without the # or ~ symbol). See Use-cases for more information.
#calendar:displayedAttributesAllows displaying the value of one or more attributes in the calendar like this:    

  

#weight="70" #Mood="Good" #calendar:displayedAttributes="weight,Mood"  

It can also be used with relations, case in which it will display the title of the target note:   

~assignee=@My assignee #calendar:displayedAttributes="assignee"
#calendar:startDateAllows 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:endDateSimilar to #calendar:startDate, allows changing the attribute which is being used to read the end date.
#calendar:startTimeSimilar to #calendar:startDate, allows changing the attribute which is being used to read the start time.
#calendar:endTimeSimilar to #calendar:startDate, allows changing the attribute which is being used to read the end time.
## How the calendar works @@ -96,7 +79,7 @@ Based on the `#calendarRoot` (or `#workspaceCalendarRoot`) attribute, the calend * Clicking on the empty space on a date will automatically open that day's note or create it if it does not exist. * Direct children of a day note will be displayed on the calendar despite not having a `dateNote` attribute. Children of the child notes will not be displayed. -![](8_Calendar%20View_image.png) + ### Using a different attribute as event title @@ -104,7 +87,7 @@ By default, events are displayed on the calendar by their note title. However, i To do so, assign `#calendar:title` to the child note (not the calendar/book note), with the value being `name` where `name` can be any label (make not to add the `#` prefix). 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. -
  
#startDate=2025-02-11 #endDate=2025-02-13 #name="My vacation" #calendar:title="name"
+
  
#startDate=2025-02-11 #endDate=2025-02-13 #name="My vacation" #calendar:title="name"

 

### Using a relation attribute as event title @@ -112,12 +95,8 @@ Similarly to using an attribute, use `#calendar:title` and set it to `name` wher Moreover, if there are more relations of the same name, they will be displayed as multiple events coming from the same note. -| | | -| --- | --- | -| `#startDate=2025-02-14 #endDate=2025-02-15 ~for=@John Smith ~for=@Jane Doe #calendar:title="for"` | ![](6_Calendar%20View_image.png) | +
  
#startDate=2025-02-14 #endDate=2025-02-15 ~for=@John Smith ~for=@Jane Doe #calendar:title="for"
Note that it's even possible to have a `#calendar:title` 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). -| | | -| --- | --- | -| `#calendar:title="shortName" #shortName="John S."` | ![](1_Calendar%20View_image.png) | \ No newline at end of file +
  
#calendar:title="shortName" #shortName="John S."
\ No newline at end of file diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.md b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.md index 7420e7225..61da3ab1a 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.md @@ -1,5 +1,5 @@ # Floating buttons -![](Floating%20buttons_image.png) +
Depending on the current note, a panel will appear near the top-right of the note, right underneath the Ribbon. These buttons offer additional interaction that is specific to that particular note. diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.md b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.md index 9b35c89b6..e8327a700 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.md @@ -1,5 +1,5 @@ # Options -![](Options_image.png) +
The Options section allows the configuration of the TriliumNext client and server. diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.md b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.md index f285e0708..7086e8514 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.md @@ -1,15 +1,15 @@ # Split View In Trilium, is possible to work with two or more notes side-by-side. -![](Split%20View_2_Split%20View_im.png) +
## **Interactions** -* Press the button to the right of a note's title to open a new split to the right of it. +* Press the ![](Split%20View_Split%20View_imag.png) button to the right of a note's title to open a new split to the right of it. * It is possible to have as many splits as desired, simply press again the button. * Only horizontal splits are possible, vertical or drag & dropping is not supported. * When at least one split is open, press the ![](Split%20View_3_Split%20View_im.png) button next to it to close it. -* Use the or the button to move around the splits. +* Use the ![](Split%20View_4_Split%20View_im.png) or the ![](Split%20View_1_Split%20View_im.png) button to move around the splits. * Each [tab](Tabs.md) has its own split view configuration (e.g. one tab can have two notes in a split view, whereas the others are one-note views). * The tab will indicate only the title of the main note (the first one in the list). diff --git a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.md b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.md index ee6d6e953..7296e7cda 100644 --- a/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.md +++ b/docs/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.md @@ -1,5 +1,5 @@ # Tabs -![](2_Tabs_image.png) +
In Trilium, tabs allow easy switching between notes. diff --git a/docs/User Guide/User Guide/Note Types.md b/docs/User Guide/User Guide/Note Types.md index f8abd9de9..db8da18f4 100644 --- a/docs/User Guide/User Guide/Note Types.md +++ b/docs/User Guide/User Guide/Note Types.md @@ -10,7 +10,7 @@ To create a new note of a different type, head to the  +![](Note%20Types_image.png) ## Creating a new note of a different type via add link or new tab diff --git a/docs/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.md b/docs/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.md index 1de02fa46..8c9148c42 100644 --- a/docs/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.md +++ b/docs/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.md @@ -34,7 +34,7 @@ Since we set the script to be run on start-up, all we need to do is to [refresh ## Understanding how the script works -
api.addButtonToToolbar({
+
@@ -57,13 +63,8 @@
         

The position on the map and the zoom are saved inside the map note and restored when visiting again the note.

Adding a marker using the map

-
-
api.addButtonToToolbar({
 	title: "New task",
     icon: "task",
     shortcut: "alt+n",
diff --git a/docs/User Guide/User Guide/Note Types/File.md b/docs/User Guide/User Guide/Note Types/File.md
index a270a6714..10bb0737e 100644
--- a/docs/User Guide/User Guide/Note Types/File.md	
+++ b/docs/User Guide/User Guide/Note Types/File.md	
@@ -12,7 +12,7 @@ Since these files come from an external source, it is not possible to create a _
 
 ### PDFs
 
-
+
PDFs can be browsed directly from Trilium. @@ -29,7 +29,7 @@ Interaction: ### Images - +
Interaction: @@ -37,7 +37,7 @@ Interaction: ### Videos - +
Video files can be added in as well. The file is streamed directly, so when accessing the note from a server it doesn't have to download the entire video to start playing it. @@ -46,7 +46,7 @@ Video files can be added in as well. The file is streamed directly, so when acce ### Audio - +
Adding a supported audio file will reveal a basic audio player that can be used to play it. @@ -59,7 +59,7 @@ Interactions: ### Text files - +
Files that are identified as containing text will show a preview of their content. One common use case for this type of file is to embed text files whose content is not necessarily of interest to the user, such as third-party libraries or generated content, that can then be downloaded if needed. @@ -69,7 +69,7 @@ Since one of the use cases for having files instead of notes is to display large ### Unknown file types - +
If the file could not be identified as any of the supported file types from above, it will be treated as an unknown file. In this case, all the default interactions will be available such as downloading or opening the file externally, but there will be no preview of the content. @@ -84,6 +84,9 @@ If the file could not be identified as any of the supported file types from abov ## Relation with other notes -* Files are also displayed in the Note List based on their type: +* Files are also displayed in the Note List based on their type: + + + * Non-image files can be embedded into text notes as read-only widgets via the Include Note functionality. * Image files can be embedded into text notes like normal images via Image references. \ No newline at end of file diff --git a/docs/User Guide/User Guide/Note Types/Geo Map.md b/docs/User Guide/User Guide/Note Types/Geo Map.md index 4301227e2..73b945fe8 100644 --- a/docs/User Guide/User Guide/Note Types/Geo Map.md +++ b/docs/User Guide/User Guide/Note Types/Geo Map.md @@ -1,14 +1,11 @@ # Geo Map -![](10_Geo%20Map_image.png) +
This note type displays the children notes on a geographical map, based on an attribute. It is also possible to add new notes at a specific location using the built-in interface. ## Creating a new geo map -| | | | -| --- | --- | --- | -| 1 | ![](7_Geo%20Map_image.png) | Right click on any note on the note tree and select _Insert child note_ → _Geo Map (beta)_. | -| 2 | ![](9_Geo%20Map_image.png) | By default the map will be empty and will show the entire world. | +
   
1
Right click on any note on the note tree and select Insert child noteGeo Map (beta).
2
By default the map will be empty and will show the entire world.
## Repositioning the map @@ -19,18 +16,13 @@ The position on the map and the zoom are saved inside the map note and restored ## Adding a marker using the map -| | | | -| --- | --- | --- | -| 1 | To create a marker, first navigate to the desired point on the map. Then press the ![](11_Geo%20Map_image.png) button in the [Floating buttons](../Basic%20Concepts%20and%20Features/UI%20Elements/Floating%20buttons.md) (top-right) area.

If the button is not visible, make sure the button section is visible by pressing the chevron button (![](17_Geo%20Map_image.png)) in the top-right of the map. | | -| 2 | ![](2_Geo%20Map_image.png) | Once pressed, the map will enter in the insert mode, as illustrated by the notification.   

Simply click the point on the map where to place the marker, or the Escape key to cancel. | -| 3 | ![](8_Geo%20Map_image.png) | Enter the name of the marker/note to be created. | -| 4 | ![](16_Geo%20Map_image.png) | Once confirmed, the marker will show up on the map and it will also be displayed as a child note of the map. | +
   
1To create a marker, first navigate to the desired point on the map. Then press the button in the Floating buttons (top-right) area. 

If the button is not visible, make sure the button section is visible by pressing the chevron button () in the top-right of the map.
 
2Once pressed, the map will enter in the insert mode, as illustrated by the notification.    

Simply click the point on the map where to place the marker, or the Escape key to cancel.
3Enter the name of the marker/note to be created.
4Once confirmed, the marker will show up on the map and it will also be displayed as a child note of the map.
## How the location of the markers is stored The location of a marker is stored in the `#geolocation` attribute of the child notes: -![](18_Geo%20Map_image.png) + 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. @@ -54,7 +46,7 @@ If moved by mistake, there is currently no way to undo the change. If the mouse ## Icon and color of the markers -![image](Geo%20Map_image.jpg) +
image
The markers will have the same icon as the note. @@ -68,35 +60,23 @@ The value of the attribute is made up of the latitude and longitude separated by ### Adding from Google Maps -| | | | -| --- | --- | --- | -| 1 | ![](13_Geo%20Map_image.png) | Go to Google Maps on the web and look for a desired location, right click on it and a context menu will show up.   

Simply click on the first item displaying the coordinates and they will be copied to clipboard.   

Then paste the value inside the text box into the `#geolocation` attribute of a child note of the map (don't forget to surround the value with a `"` character). | -| 2 | ![](4_Geo%20Map_image.png) | In Trilium, create a child note under the map. | -| 3 | ![](12_Geo%20Map_image.png) | And then go to Owned Attributes and type `#geolocation="`, then paste from the clipboard as-is and then add the ending `"` character. Press Enter to confirm and the map should now be updated to contain the new note. | +
   
1
Go to Google Maps on the web and look for a desired location, right click on it and a context menu will show up.    

Simply click on the first item displaying the coordinates and they will be copied to clipboard.    

Then paste the value inside the text box into the #geolocation attribute of a child note of the map (don't forget to surround the value with a " character).
2
In Trilium, create a child note under the map.
3
And then go to Owned Attributes and type #geolocation=", then paste from the clipboard as-is and then add the ending " character. Press Enter to confirm and the map should now be updated to contain the new note.
### Adding from OpenStreetMap Similarly to the Google Maps approach: -| | | | -| --- | --- | --- | -| 1 | ![](1_Geo%20Map_image.png) | Go to any location on openstreetmap.org and right click to bring up the context menu. Select the “Show address” item. | -| 2 | ![](Geo%20Map_image.png) | The address will be visible in the top-left of the screen, in the place of the search bar.   

Select the coordinates and copy them into the clipboard. | -| 3 | ![](5_Geo%20Map_image.png) | Simply paste the value inside the text box into the `#geolocation` attribute of a child note of the map and then it should be displayed on the map. | +
   
1Go to any location on openstreetmap.org and right click to bring up the context menu. Select the “Show address” item.
2The address will be visible in the top-left of the screen, in the place of the search bar.    

Select the coordinates and copy them into the clipboard.
3Simply paste the value inside the text box into the #geolocation attribute of a child note of the map and then it should be displayed on the map.
## Adding GPS tracks (.gpx) Trilium has basic support for displaying GPS tracks on the geo map. -| | | | -| --- | --- | --- | -| 1 | ![](3_Geo%20Map_image.png) | To add a track, simply drag & drop a .gpx file inside the geo map in the note tree. | -| 2 | ![](15_Geo%20Map_image.png) | In order for the file to be recognized as a GPS track, it needs to show up as `application/gpx+xml` in the _File type_ field. | -| 3 | ![](6_Geo%20Map_image.png) | When going back to the map, the track should now be visible.   

The start and end points of the track are indicated by the two blue markers. | +
   
1
To add a track, simply drag & drop a .gpx file inside the geo map in the note tree.
2
In order for the file to be recognized as a GPS track, it needs to show up as application/gpx+xml in the File type field.
3
When going back to the map, the track should now be visible.    

The start and end points of the track are indicated by the two blue markers.
## Troubleshooting -![](14_Geo%20Map_image.png) +
### Grid-like artifacts on the map diff --git a/docs/User Guide/User Guide/Note Types/Mermaid Diagrams.md b/docs/User Guide/User Guide/Note Types/Mermaid Diagrams.md index d6badd0d8..03987d969 100644 --- a/docs/User Guide/User Guide/Note Types/Mermaid Diagrams.md +++ b/docs/User Guide/User Guide/Note Types/Mermaid Diagrams.md @@ -1,5 +1,5 @@ # Mermaid Diagrams -![](2_Mermaid%20Diagrams_image.png) +
Trilium supports Mermaid, which adds support for various diagrams such as flowchart, sequence diagram, class diagram, state diagram, pie charts, etc., all using a text description of the chart instead of manually drawing the diagram. diff --git a/docs/User Guide/User Guide/Note Types/Mind Map.md b/docs/User Guide/User Guide/Note Types/Mind Map.md index 50bb081ca..82bd8b889 100644 --- a/docs/User Guide/User Guide/Note Types/Mind Map.md +++ b/docs/User Guide/User Guide/Note Types/Mind Map.md @@ -1,5 +1,5 @@ # Mind Map -![](Mind%20Map_image.png) +
The mindmap allows for easy jotting down of ideas and storing them in a hierarchical fashion. diff --git a/docs/User Guide/User Guide/Note Types/Note Map.md b/docs/User Guide/User Guide/Note Types/Note Map.md index 1dbeae3b3..ff79aea46 100644 --- a/docs/User Guide/User Guide/Note Types/Note Map.md +++ b/docs/User Guide/User Guide/Note Types/Note Map.md @@ -1,5 +1,5 @@ # Note Map -![](Note%20Map_image.png) +
A Note map is a note type which displays a standalone version of the feature of the same name: [Note Map (Link map, Tree map)](../Advanced%20Usage/Note%20Map%20\(Link%20map%2C%20Tree%20map\).md). diff --git a/docs/User Guide/User Guide/Note Types/Text/Images/Image references.md b/docs/User Guide/User Guide/Note Types/Text/Images/Image references.md index ac1a0347a..79e210233 100644 --- a/docs/User Guide/User Guide/Note Types/Text/Images/Image references.md +++ b/docs/User Guide/User Guide/Note Types/Text/Images/Image references.md @@ -1,5 +1,5 @@ # Image references - +
Image references are an easy way to embed the preview of another note type into a Text note. @@ -11,7 +11,7 @@ Image references are an easy way to embed the preview of another note type into ## Steps -1. Go to one of the supported notes (listed above) and look for the button in the Floating buttons area. +1. Go to one of the supported notes (listed above) and look for the ![](1_Image%20references_image.png) button in the Floating buttons area. 2. Go to a Text note and use the Paste function to insert the reference to that note. ## Interaction diff --git a/docs/User Guide/User Guide/Note Types/Text/Include Note.md b/docs/User Guide/User Guide/Note Types/Text/Include Note.md index 14b733445..477a000e9 100644 --- a/docs/User Guide/User Guide/Note Types/Text/Include Note.md +++ b/docs/User Guide/User Guide/Note Types/Text/Include Note.md @@ -3,4 +3,4 @@ Text notes can "include" another note as a read-only widget. This can be useful ## Including a note -In the Formatting toolbar, look for the button. There is also a keyboard shortcut defined for it but it is not allocated by default. \ No newline at end of file +In the Formatting toolbar, look for the ![](Include%20Note_image.png) button. There is also a keyboard shortcut defined for it but it is not allocated by default. \ No newline at end of file diff --git a/src/public/app/doc_notes/en/User Guide/!!!meta.json b/src/public/app/doc_notes/en/User Guide/!!!meta.json index 1fd1238d2..7af18143a 100644 --- a/src/public/app/doc_notes/en/User Guide/!!!meta.json +++ b/src/public/app/doc_notes/en/User Guide/!!!meta.json @@ -1715,6 +1715,13 @@ "value": "bx bx-cog", "isInheritable": false, "position": 10 + }, + { + "type": "relation", + "name": "internalLink", + "value": "_options", + "isInheritable": false, + "position": 60 } ], "format": "html", diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.html index 08ae4867c..5a9c94d8c 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Jump to Note.html @@ -13,7 +13,7 @@

Jump to Note

-
+
@@ -24,7 +24,7 @@
  • In the Launch Bar, press - button.
  • + button.
  • Using the keyboard, press Ctrl + J.

Interaction

diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.html index 5b30e78d0..143daa0e7 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Navigation/Quick search.html @@ -13,7 +13,7 @@

Quick search

-
+
@@ -36,7 +36,6 @@ href="../UI%20Elements/Launch%20Bar.html">Launch Bar, where it can be positioned just like any other icon. -

 

diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.html index f5f7dccd5..c55f564d8 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List.html @@ -26,9 +26,10 @@ the #viewType attribute.

Grid view

-

- -

+
+ +

This view presents the child notes in a grid format, allowing for a more visual navigation experience.

    @@ -43,7 +44,7 @@

This is the default view type.

List view

-
+
@@ -52,7 +53,7 @@ the expand button it's possible to view the content of the note, as well as the children of the note (recursively).

Calendar view

-
+
diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.html index 15e862fd9..6f2977d91 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Note List/Calendar View.html @@ -13,9 +13,10 @@

Calendar View

-

- -

+
+ +

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.

The Calendar view has multiple display modes:

@@ -31,36 +32,37 @@

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.

Creating a calendar

- - - - - - - - - - - - - - - - - - - - -
1 - - 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 Book.
2 - - Once created, the “View type” of the Book needs changed to “Calendar”, - by selecting the “Book Properties” tab in the ribbon.
- -

Creating a new event/note

+
+ + + + + + + + + + + + + + + + + + + + +
   
1 + + 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 Book.
2 + + Once created, the “View type” of the Book needs changed to “Calendar”, + by selecting the “Book Properties” tab in the ribbon.
+
+

Creating a new event/note

  • Clicking on a day will create a new child note and assign it to that particular day. @@ -92,272 +94,290 @@

Configuring the calendar

The following attributes can be added to the book type:

- - - - - - - - - - - - - - - - - - - - - - - - - -
NameDescription
#calendar:hideWeekends - When present (regardless of value), it will hide Saturday and Sundays - from the calendar.
#calendar:weekNumbers - When present (regardless of value), it will show the number of the week - on the calendar.
#calendar:view - -

Which view to display in the calendar:

-
    -
  • timeGridWeek for the week view;
  • -
  • dayGridMonth for the month view;
  • -
  • multiMonthYear for the year view;
  • -
  • listMonth for the list view.
  • -
-

Any other value will be dismissed and the default view (month) will be - used instead.

-

The value of this label is automatically updated when changing the view - using the UI buttons.

-
~child:template - Defines the template for newly created notes in the calendar (via dragging - or clicking).
+
+ + + + + + + + + + + + + + + + + + + + + + + + + +
NameDescription
#calendar:hideWeekends + When present (regardless of value), it will hide Saturday and Sundays + from the calendar.
#calendar:weekNumbers + When present (regardless of value), it will show the number of the week + on the calendar.
#calendar:view + +

Which view to display in the calendar:

+
    +
  • timeGridWeek for the week view;
  • +
  • dayGridMonth for the month view;
  • +
  • multiMonthYear for the year view;
  • +
  • listMonth for the list view.
  • +
+

Any other value will be dismissed and the default view (month) will be + used instead.

+

The value of this label is automatically updated when changing the view + using the UI buttons.

+
~child:template + Defines the template for newly created notes in the calendar (via dragging + or clicking).
+

In addition, the first day of the week can be either Sunday or Monday and can be adjusted from the application settings.

Configuring the calendar events

For each note of the calendar, the following attributes can be used:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameDescription
#startDate - The date the event starts, which will display it in the calendar. The - format is YYYY-MM-DD (year, month and day separated by a minus - sign).
#endDate - Similar to startDate, 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.
#startTime - The time the event starts at. If this value is missing, then the event - is considered a full-day event. The format is HH:MM (hours in - 24-hour format and minutes).
#endTime - Similar to startTime, it mentions the time at which the event - ends (in relation with endDate if present, or startDate).
#color - Displays the event with a specified color (named such as red, gray or - hex such as #FF0000). This will also change the color of the - note in other places such as the note tree.
#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, can either a label or a relation (without the # or ~ symbol). - See Use-cases for more information.
#calendar:displayedAttributes - Allows displaying the value of one or more attributes in the calendar - like this:    -
-
-   -
-
#weight="70" #Mood="Good" #calendar:displayedAttributes="weight,Mood"  -
-
It can also be used with relations, case in which it will display the - title of the target note:   -
-
~assignee=@My assignee #calendar:displayedAttributes="assignee" -
#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 - Similar to #calendar:startDate, allows changing the attribute - which is being used to read the end date.
#calendar:startTime - Similar to #calendar:startDate, allows changing the attribute - which is being used to read the start time.
#calendar:endTime - Similar to #calendar:startDate, allows changing the attribute - which is being used to read the end time.
- -

How the calendar works

-

- -

-

The calendar displays all the child notes of the book that have a #startDate. - An #endDate can optionally be added.

-

If editing the start date and end date from the note itself is desirable, - the following attributes can be added to the book note:

#viewType=calendar #label:startDate(inheritable)="promoted,alias=Start Date,single,date"
+        
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameDescription
#startDate + The date the event starts, which will display it in the calendar. The + format is YYYY-MM-DD (year, month and day separated by a minus + sign).
#endDate + Similar to startDate, 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.
#startTime + The time the event starts at. If this value is missing, then the event + is considered a full-day event. The format is HH:MM (hours in + 24-hour format and minutes).
#endTime + Similar to startTime, it mentions the time at which the event + ends (in relation with endDate if present, or startDate).
#color + Displays the event with a specified color (named such as red, gray or + hex such as #FF0000). This will also change the color of the + note in other places such as the note tree.
#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, can either a label or a relation (without the # or ~ symbol). + See Use-cases for more information.
#calendar:displayedAttributes + Allows displaying the value of one or more attributes in the calendar + like this:     +
+
+    +
+
#weight="70" #Mood="Good" #calendar:displayedAttributes="weight,Mood"   +
+
It can also be used with relations, case in which it will display the + title of the target note:    +
+
~assignee=@My assignee #calendar:displayedAttributes="assignee" +
#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 + Similar to #calendar:startDate, allows changing the attribute + which is being used to read the end date.
#calendar:startTime + Similar to #calendar:startDate, allows changing the attribute + which is being used to read the start time.
#calendar:endTime + Similar to #calendar:startDate, allows changing the attribute + which is being used to read the end time.
+
+

How the calendar works

+

+ +

+

The calendar displays all the child notes of the book that have a #startDate. + An #endDate can optionally be added.

+

If editing the start date and end date from the note itself is desirable, + the following attributes can be added to the book note:

#viewType=calendar #label:startDate(inheritable)="promoted,alias=Start Date,single,date"
 #label:endDate(inheritable)="promoted,alias=End Date,single,date"
 #hidePromotedAttributes 
-

This will result in:

-

- -

-

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.

-

Use-cases

-

Using with the Journal / calendar

-

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.

-

Based on the #calendarRoot (or #workspaceCalendarRoot) - attribute, the calendar will know that it's in a calendar and apply the - following:

-
    -
  • The calendar events are now rendered based on their dateNote attribute - rather than startDate.
  • -
  • Interactive editing such as dragging over an empty era or resizing an - event is no longer possible.
  • -
  • Clicking on the empty space on a date will automatically open that day's - note or create it if it does not exist.
  • -
  • Direct children of a day note will be displayed on the calendar despite - not having a dateNote attribute. Children of the child notes - will not be displayed.
  • -
-

- -

-

Using a different attribute as event title

-

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.

-

To do so, assign #calendar:title to the child note (not the - calendar/book note), with the value being name where name can - be any label (make not to add the # prefix). 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.

- - - - - - - - - - - - - -
  
#startDate=2025-02-11 #endDate=2025-02-13 #name="My vacation" #calendar:title="name"
-
- -
- -

Using a relation attribute as event title

-

Similarly to using an attribute, use #calendar:title and set - it to name where name is the name of the relation - to use.

-

Moreover, if there are more relations of the same name, they will be displayed - as multiple events coming from the same note.

- - - - - - - - - - - - - -
#startDate=2025-02-14 #endDate=2025-02-15 ~for=@John Smith ~for=@Jane Doe #calendar:title="for" - - -
-

Note that it's even possible to have a #calendar:title 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).

- - - - - - - - - - - - - -
#calendar:title="shortName" #shortName="John S." - - -
+

This will result in:

+

+ +

+

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.

+

Use-cases

+

Using with the Journal / calendar

+

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.

+

Based on the #calendarRoot (or #workspaceCalendarRoot) + attribute, the calendar will know that it's in a calendar and apply the + following:

+
    +
  • The calendar events are now rendered based on their dateNote attribute + rather than startDate.
  • +
  • Interactive editing such as dragging over an empty era or resizing an + event is no longer possible.
  • +
  • Clicking on the empty space on a date will automatically open that day's + note or create it if it does not exist.
  • +
  • Direct children of a day note will be displayed on the calendar despite + not having a dateNote attribute. Children of the child notes + will not be displayed.
  • +
+

+ +

+

Using a different attribute as event title

+

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.

+

To do so, assign #calendar:title to the child note (not the + calendar/book note), with the value being name where name can + be any label (make not to add the # prefix). 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.

+
+ + + + + + + + + + + + + +
  
#startDate=2025-02-11 #endDate=2025-02-13 #name="My vacation" #calendar:title="name"
+
+

 

+
+ +
+
+
+

Using a relation attribute as event title

+

Similarly to using an attribute, use #calendar:title and set + it to name where name is the name of the relation + to use.

+

Moreover, if there are more relations of the same name, they will be displayed + as multiple events coming from the same note.

+
+ + + + + + + + + + + + + +
  
#startDate=2025-02-14 #endDate=2025-02-15 ~for=@John Smith ~for=@Jane Doe #calendar:title="for"
+
+ +
+
+

Note that it's even possible to have a #calendar:title 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).

+
+ + + + + + + + + + + + + +
  
#calendar:title="shortName" #shortName="John S."
+
+
+ +
+
+
diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Read-Only Notes.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Read-Only Notes.html index 05d97feaa..ac4e49404 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Read-Only Notes.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/Notes/Read-Only Notes.html @@ -13,9 +13,9 @@

Read-Only Notes

-

Some note types such as Text and  +

Some note types such as Text and  Code notes in Trilium can be set to read-only. When a note is + href="../../Note%20Types/Code.html">Code notes in Trilium can be set to read-only. When a note is in read-only mode, it is presented to the user in a non-editable view, with the option to switch to editing mode if needed.

Automatic read-only mode

@@ -25,29 +25,22 @@

This behavior can be disabled on a per-note basis, by following the instructions of the next section.

In addition, it's possible to change the number of characters at which - the automatic read-only mode will trigger in Options by going to the options - for Text and  + the automatic read-only mode will trigger in Options by + going to the options for Text Notes and  Code notes.

+ class="reference-link" href="#root/_hidden/_options/_optionsCodeNotes">Code Notes.

Changing a note's read-only behavior

Via the Ribbon, by going to the Basic Properties tab and looking for the Editable selection. The following options are possible:

    -
  • -

    Auto -
    This is the default behavior in which the note will be editable by default, - unless it becomes large enough to trigger read-only mode.

    -

     

    -
  • -
  • -

    Read-only -
    The note will be always marked as read-only, regardless of its size. Nevertheless, - it's still possible to temporarily edit the note if needed. This is generally - useful for notes that are not prone to change.

    -

     

    -
  • +
  • Auto +
    This is the default behavior in which the note will be editable by default, + unless it becomes large enough to trigger read-only mode.
  • +
  • Read-only +
    The note will be always marked as read-only, regardless of its size. Nevertheless, + it's still possible to temporarily edit the note if needed. This is generally + useful for notes that are not prone to change.
  • Always Editable
    This option will bypass the automatic read-only activation for this particular note. It's useful for large notes that are frequently edited.
  • @@ -65,7 +58,7 @@

    Temporarily editing a read-only note

    When accessing a read-only note, it's possible to temporarily edit it by using the - button in the Floating buttons area.

    + button in the Floating buttons area.

    When pressed, the note will become editable but will become read-only again after navigating to a different note.

    Special read-only behavior

    diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.html index 7ff7e4e71..d65c8486a 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Floating buttons.html @@ -13,7 +13,7 @@

    Floating buttons

    -
    +
    diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.html index 0d66c4fad..2641768b3 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Options.html @@ -13,7 +13,7 @@

    Options

    -
    +
    @@ -22,13 +22,13 @@

    Entering options

    The Options can be accessed via:

      -
    • The Global menu, - by selecting the Options item.
    • +
    • The Global menu, by selecting the Options item.
    • The - button in the Launch Bar which + button in the Launch Bar which can optionally be hidden if not desirable.
    • Optionally, a keyboard shortcut can be defined, but it is not assigned by default.
    • +
    • By clicking on this link: Options.

    Once in the options section, simply select one of the option categories using the Note Tree.

    diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.html index 4072b57ff..ad6d13546 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Split View.html @@ -15,16 +15,14 @@

    In Trilium, is possible to work with two or more notes side-by-side.

    + class="image image-style-align-center">

    Interactions

    • Press the - - button to the right of a note's title to open a new split to the right + button to the right of a note's title to open a new split to the right of it.
      • It is possible to have as many splits as desired, simply press again the @@ -34,16 +32,10 @@
    • When at least one split is open, press the - - button next to it to close it.
    • + button next to it to close it.
    • Use the - - or the - - button to move around the splits.
    • + or the + button to move around the splits.
    • Each tab has its own split view configuration (e.g. one tab can have two notes in a split view, whereas the others are one-note views). diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.html b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.html index f2ec4830c..2869eaef9 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Basic Concepts and Features/UI Elements/Tabs.html @@ -13,7 +13,7 @@

      Tabs

      -
      +
      @@ -24,16 +24,15 @@
    • For the vertical layout, the tabs will be placed at the top but to the right of the Note Tree.
    • For the horizontal layout, the tabs will be placed at the top in full-width, - above the Note Tree, - allowing for more tabs to be comfortably displayed.
    • + above the note tree, allowing for more + tabs to be comfortably displayed.

    Interaction

    • To create a new tab, press the - button that is to the right of the last tab.
    • + button that is to the right of the last tab.
    • To close a tab, press the corresponding - button.
    • + button.
    • For multitasking, tabs can be used alongside Split View. Each tab can have one or more notes, displayed horizontally.
    • diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types.html index adac706ea..d1e13ae2d 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types.html @@ -27,10 +27,9 @@
    • Insert child note, to insert the note as a child of the selected note.
    -

    - -

    -

    Creating a new note of a different type via add link or new tab

    + + +

    Creating a new note of a different type via add link or new tab

    • When adding a link in a  source of a note.

      Supported note types

      The following note types are supported by Trilium:

      -
      - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
      Text - The default note type, which allows for rich text formatting, images, - admonitions and right-to-left support.
      Code - Uses a mono-space font and can be used to store larger chunks of code - or plain text than a text note, and has better syntax highlighting.
      Saved Search - Stores the information about a search (the search text, criteria, etc.) - for later use. Can be used for quick filtering of a large amount of notes, - for example. The search can easily be triggered.
      Relation Map - Allows easy creation of notes and relations between them. Can be used - for mainly relational data such as a family tree.
      Note Map - Displays the relationships between the notes, whether via relations or - their hierarchical structure.
      Render Note - Used in Scripts, - it displays the HTML content of another note. This allows displaying any - kind of content, provided there is a script behind it to generate it.
      Book - Displays the children of the note either as a grid, a list, or for a more - specialized case: a calendar.
      Mermaid Diagrams - Displays diagrams such as bar charts, flow charts, state diagrams, etc. - Requires a bit of technical knowledge since the diagrams are written in - a specialized format.
      Canvas - Allows easy drawing of sketches, diagrams, handwritten content. Uses the - same technology behind excalidraw.com.
      Web View - Displays the content of an external web page, similar to a browser.
      Mind Map - Easy for brainstorming ideas, by placing them in a hierarchical layout.
      Geo map - Displays the children of the note as a geographical map, one use-case - would be to plan vacations. It even has basic support for tracks. Notes - can also be created from it.
      -
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      Text + The default note type, which allows for rich text formatting, images, + admonitions and right-to-left support.
      Code + Uses a mono-space font and can be used to store larger chunks of code + or plain text than a text note, and has better syntax highlighting.
      Saved Search + Stores the information about a search (the search text, criteria, etc.) + for later use. Can be used for quick filtering of a large amount of notes, + for example. The search can easily be triggered.
      Relation Map + Allows easy creation of notes and relations between them. Can be used + for mainly relational data such as a family tree.
      Note Map + Displays the relationships between the notes, whether via relations or + their hierarchical structure.
      Render Note + Used in Scripts, + it displays the HTML content of another note. This allows displaying any + kind of content, provided there is a script behind it to generate it.
      Book + Displays the children of the note either as a grid, a list, or for a more + specialized case: a calendar.
      Mermaid Diagrams + Displays diagrams such as bar charts, flow charts, state diagrams, etc. + Requires a bit of technical knowledge since the diagrams are written in + a specialized format.
      Canvas + Allows easy drawing of sketches, diagrams, handwritten content. Uses the + same technology behind excalidraw.com.
      Web View + Displays the content of an external web page, similar to a browser.
      Mind Map + Easy for brainstorming ideas, by placing them in a hierarchical layout.
      Geo Map + Displays the children of the note as a geographical map, one use-case + would be to plan vacations. It even has basic support for tracks. Notes + can also be created from it.
    diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.html index 950634d05..a9574d8dc 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Code/Scripts/New Task launcher button.html @@ -13,12 +13,12 @@

    "New Task" launcher button

    -

    In this example we are going to extend the functionality of the  +

    In this example we are going to extend the functionality of Task Manager showcase + (which comes by default with Trilium) by adding a button in the  Task Manager showcase (which comes by default with Trilium) by - adding a button in the Launch Bar  - ( - ) to create a new task automatically and open it.

    + class="reference-link" href="../../../Basic%20Concepts%20and%20Features/UI%20Elements/Launch%20Bar.html">Launch Bar  ( + ) to create a new task automatically and open it.

    Creating the note

    1. First, create a new Code note @@ -27,7 +27,7 @@ href="../../../Advanced%20Usage/Attributes.html">Attributes.

    Content of the script

    -

    Copy-paste the following script:

    api.addButtonToToolbar({
    +        

    Copy-paste the following script:

    api.addButtonToToolbar({
     	title: "New task",
         icon: "task",
         shortcut: "alt+n",
    @@ -47,15 +47,14 @@
               refresh the application.

    Understanding how the script works

    -
    - - - - - - - - + + + + + + + + + + + + + + + + + + + +
    api.addButtonToToolbar({
    +        
    +          +            +            +          
    +          
    +            
    +              
    -                
    -              
    -              
    -                
    +              
    +            
    +            
    +              
    -                
    -              
    -              
    -                
    -                
    -              
    -              
    -                
    -                
    -              
    -              
    -                
    -                
    -              
    -              
    -                
    -                
    -              
    -            
    -          
    api.addButtonToToolbar({
     	title: "New task",
         icon: "task",
         shortcut: "alt+n",
    @@ -63,86 +62,85 @@
         	// [...]
         }
     });
    -
    -

    This uses the Front-end API to - create a icon in the Launch Bar, - by specifying:

    -
      -
    • A title
    • -
    • A corresponding boxicons icon (without the bx- prefix).
    • -
    • Optionally, a keyboard shortcut to assign to it.
    • -
    • The action, which will be executed when the button is pressed.
    • -
    -
    const taskNoteId = await api.runOnBackend(() => {
    +              
    +

    This uses the Front-end API to + create a icon in the Launch Bar, + by specifying:

    +
      +
    • A title
    • +
    • A corresponding boxicons icon (without the bx- prefix).
    • +
    • Optionally, a keyboard shortcut to assign to it.
    • +
    • The action, which will be executed when the button is pressed.
    • +
    +
    const taskNoteId = await api.runOnBackend(() => {
         // Shown below.           
         return resp.note.noteId;
     });
    -
    -
      -
    • This portion of code is actually executed on the server (backend) and - not on the client (i.e. browser). -
        -
      • The reason is that the creating notes is the responsibility of the server.
      • -
      -
    • -
    • Here we can also see that it is possible to return results from the server - execution and read them in the client (taskNoteId).
    • -
    -
    const todoRootNote = api.getNoteWithLabel("taskTodoRoot");
    -
    -
      -
    • Here we identify a note with the label #taskTodoRoot. - This is how the Task Manager showcase - knows where to place all the different tasks.
    • -
    • Normally this might return a null value if no such note could - be identified, but error handling is outside the scope of this example. 
    • -
    -
    const resp = api.createTextNote(todoRootNote.noteId, "New task", "")
    -
    -
      -
    • We create a new child note within the to-do root note (first argument) - with the title “New task" (second argument) and no content by default (third - argument).
    • -
    -
    await api.waitUntilSynced();
    -
    -
      -
    • Back on the client, since we created a new note on the server, we now - need to wait for the change to be reflected in the client.
    • -
    -
    await api.activateNewNote(taskNoteId);
    -
    -
      -
    • Since we know the ID of - the newly created note, all we have to do now is to show this note to the - user.
    • -
    -
    - +
    +
      +
    • This portion of code is actually executed on the server (backend) and + not on the client (i.e. browser). +
        +
      • The reason is that the creating notes is the responsibility of the server.
      • +
      +
    • +
    • Here we can also see that it is possible to return results from the server + execution and read them in the client (taskNoteId).
    • +
    +
    const todoRootNote = api.getNoteWithLabel("taskTodoRoot");
    +
    +
      +
    • Here we identify a note with the label #taskTodoRoot. + This is how the Task Manager showcase + knows where to place all the different tasks.
    • +
    • Normally this might return a null value if no such note could + be identified, but error handling is outside the scope of this example. 
    • +
    +
    const resp = api.createTextNote(todoRootNote.noteId, "New task", "")
    +
    +
      +
    • We create a new child note within the to-do root note (first argument) + with the title “New task" (second argument) and no content by default (third + argument).
    • +
    +
    await api.waitUntilSynced();
    +
    +
      +
    • Back on the client, since we created a new note on the server, we now + need to wait for the change to be reflected in the client.
    • +
    +
    await api.activateNewNote(taskNoteId);
    +
    +
      +
    • Since we know the ID of + the newly created note, all we have to do now is to show this note to the + user.
    • +
    +
    diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/File.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/File.html index 60467d9bc..4c52887b8 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/File.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/File.html @@ -25,9 +25,9 @@

Supported file types

PDFs

-

- -

+
+ +

PDFs can be browsed directly from Trilium.

Interaction:

    @@ -45,9 +45,10 @@

Images

-

- -

+
+ +

Interaction:

  • Copy reference to clipboard, for embedding the image within  @@ -56,9 +57,10 @@ more information.

Videos

-

- -

+
+ +

Video files can be added in as well. The file is streamed directly, so when accessing the note from a server it doesn't have to download the entire video to start playing it.

@@ -73,9 +75,10 @@ of Trilium significantly.

Audio

-

- -

+
+ +

Adding a supported audio file will reveal a basic audio player that can be used to play it.

Interactions:

@@ -88,9 +91,10 @@ volume.

Text files

-

- -

+
+ +

Files that are identified as containing text will show a preview of their content. One common use case for this type of file is to embed text files whose content is not necessarily of interest to the user, such as third-party @@ -106,9 +110,10 @@ of characters. To view the full file, consider opening it in an external application.

Unknown file types

-

- -

+
+ +

If the file could not be identified as any of the supported file types from above, it will be treated as an unknown file. In this case, all the default interactions will be available such as downloading or opening the @@ -130,9 +135,13 @@

Relation with other notes

    -
  • Files are also displayed in the Note List based - on their type: - +
  • +

    Files are also displayed in the Note List based + on their type:

    +

    + +

  • Non-image files can be embedded into text notes as read-only widgets via the Include Note functionality.
  • diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Geo Map.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Geo Map.html index 8bc263eae..93e4e9977 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Geo Map.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Geo Map.html @@ -13,7 +13,7 @@

    Geo Map

    -
    +
    @@ -34,14 +34,20 @@
1 - +
+ +
Right click on any note on the note tree and select Insert child noteGeo Map (beta).
2 - +
+ +
By default the map will be empty and will show the entire world.
- - - - - +
+
@@ -74,15 +75,15 @@ - + ) in the top-right of the map. + @@ -91,7 +92,7 @@ width="1730" height="416"> @@ -107,8 +108,8 @@ @@ -120,7 +121,7 @@

The location of a marker is stored in the #geolocation attribute of the child notes:

- +

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.

@@ -153,9 +154,10 @@

Icon and color of the markers

-

- image -

+
+ image +

The markers will have the same icon as the note.

It's possible to add a custom color to a marker by assigning them a #color attribute such as #color=green.

@@ -165,8 +167,13 @@

The value of the attribute is made up of the latitude and longitude separated by a comma.

Adding from Google Maps

-
-
 
1To create a marker, first navigate to the desired point on the map. Then + To create a marker, first navigate to the desired point on the map. Then press the - button in the Floating buttons (top-right) - area. + button in the Floating buttons (top-right) + area. 

If the button is not visible, make sure the button section is visible by pressing the chevron button ( - ) in the top-right of the map.
 
2 Once pressed, the map will enter in the insert mode, as illustrated by - the notification.    + the notification.    

Simply click the point on the map where to place the marker, or the Escape key to cancel.
4 - + Once confirmed, the marker will show up on the map and it will also be displayed as a child note of the map.
+
+
+ + + + + @@ -178,13 +185,16 @@ @@ -192,14 +202,20 @@
 
1 - +
+ +
Go to Google Maps on the web and look for a desired location, right click - on it and a context menu will show up.    + on it and a context menu will show up.    

Simply click on the first item displaying the coordinates and they will - be copied to clipboard.    + be copied to clipboard.    

Then paste the value inside the text box into the #geolocation attribute of a child note of the map (don't forget to surround the value with a " character).
2 - +
+ +
In Trilium, create a child note under the map.
3 - +
+ +
And then go to Owned Attributes and type #geolocation=", then paste from the clipboard as-is and then add the ending " character. @@ -211,8 +227,13 @@

Adding from OpenStreetMap

Similarly to the Google Maps approach:

-
- +
+
+ + + + + @@ -224,7 +245,8 @@ @@ -232,17 +254,19 @@ @@ -253,8 +277,13 @@

Adding GPS tracks (.gpx)

Trilium has basic support for displaying GPS tracks on the geo map.

-
 
1 - + Go to any location on openstreetmap.org and right click to bring up the context menu. Select the “Show address” item.
2 - + The address will be visible in the top-left of the screen, in the place - of the search bar.    + of the search bar.    

Select the coordinates and copy them into the clipboard.
3 - + Simply paste the value inside the text box into the #geolocation attribute of a child note of the map and then it should be displayed on the map.
+ class="table" style="width:100%;"> +
+ + + + + @@ -266,7 +295,10 @@ @@ -274,7 +306,10 @@ @@ -282,9 +317,12 @@ - @@ -292,9 +330,10 @@
 
1 - +
+ +
To add a track, simply drag & drop a .gpx file inside the geo map in the note tree.
2 - +
+ +
In order for the file to be recognized as a GPS track, it needs to show up as application/gpx+xml in the File type field.
3 - +
+ +
When going back to the map, the track should now be visible.    + When going back to the map, the track should now be visible.    

The start and end points of the track are indicated by the two blue markers.

Troubleshooting

-

- -

+
+ +

Grid-like artifacts on the map

This occurs if the application is not at 100% zoom which causes the pixels of the map to not render correctly due to fractional scaling. The only diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams.html index 46b8a133a..1c54e986e 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams.html @@ -33,7 +33,7 @@

It's possible to switch between the two layouts at any time by pressing the - icon in the Floating buttons area.

+ icon in the Floating buttons area.

Interaction

  • The source code of the diagram (in Mermaid format) is displayed on the @@ -47,8 +47,7 @@
    • There are dedicated buttons at the bottom-right of the preview to control the zoom in, zoom out or re-center the diagram: - +
    • The preview can be moved around by holding the left mouse button and dragging.
    • Zooming can also be done by using the scroll wheel.
    • @@ -60,7 +59,7 @@ the border between them and dragging it with the mouse.
    • In the Floating buttons area:
        -
      • The source/preview can be laid out left-right or bottom-top via the Move editing pane to the left / bottom option.
      • +
      • The source/preview can be laid out left-right or bottom-top via the Move editing pane to the left / bottom option.
      • Press Lock editing to automatically mark the note as read-only. In this mode, the code pane is hidden and the diagram is displayed full-size. Similarly, press Unlock editing to mark a read-only note as editable.
      • diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams/ELK layout.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams/ELK layout.html index 1ef36121d..c40226ac4 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams/ELK layout.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mermaid Diagrams/ELK layout.html @@ -21,33 +21,24 @@ config: layout: elk --- -
        - - - - - - - - - - - - - -
        With ELK offWith ELK on
        -
        - -
        -

         

        -
        -
        - -
        -
        -
        + + + + + + + + + + + + + +
        With ELK offWith ELK on
        + + + +
        diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mind Map.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mind Map.html index 918291dbf..cbe5bd648 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mind Map.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Mind Map.html @@ -13,7 +13,7 @@

        Mind Map

        -
        +
        diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Note Map.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Note Map.html index 358d90e30..27b48d8c1 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Note Map.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Note Map.html @@ -13,15 +13,15 @@

        Note Map

        -
        - +
        +

        A Note map is a note type which displays a standalone version of the feature of the same name: Note Map (Link map, Tree map).

        Once created, the note map will display the relations between notes. Only the notes that are part of the parent of the note map will be displayed (including their children).

        -

         

        diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Images/Image references.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Images/Image references.html index 010a721bc..730e254ee 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Images/Image references.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Images/Image references.html @@ -13,7 +13,7 @@

        Image references

        -
        +
        @@ -31,8 +31,7 @@

        Steps

        1. Go to one of the supported notes (listed above) and look for the - button in the Floating buttons area.
        2. + button in the Floating buttons area.
        3. Go to a Text note and use the Paste function to insert the reference to that note.
        diff --git a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Include Note.html b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Include Note.html index 4a522d47d..f2fb35e5f 100644 --- a/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Include Note.html +++ b/src/public/app/doc_notes/en/User Guide/User Guide/Note Types/Text/Include Note.html @@ -19,7 +19,7 @@

        Including a note

        In the Formatting toolbar, look for the - button. There is also a keyboard shortcut defined for it but it is not + button. There is also a keyboard shortcut defined for it but it is not allocated by default.