mirror of
https://gitlab.com/octtspacc/OcttKB
synced 2025-01-09 13:23:57 +01:00
55 lines
2.8 KiB
Plaintext
55 lines
2.8 KiB
Plaintext
title: $:/plugins/danielo515/ContextPlugin/readme
|
|
|
|
!Usage
|
|
|
|
After installing the plugin you will have a new tab in [[$:/AdvancedSearch]] called [[Context Search]]. If you want this functionality in other places you will have to edit the desired tiddler yourself adding the ''context widget''. For more details about using the widget see the section below.
|
|
|
|
!!Using the widget
|
|
|
|
The very basic usage of the widget is the following:
|
|
|
|
```
|
|
<$context term="lorem"/>
|
|
```
|
|
Which will render as:
|
|
<$context term="lorem"/>
|
|
|
|
The widgets will search inside the current tiddler by default. Because that you see the same content twice here. This example is not very useful. Other more meaningful would be:
|
|
|
|
```
|
|
<$list filter="[search{$:/temp/advancedsearch}sort[title]limit[250]]">
|
|
{{!!title||$:/core/ui/ListItemTemplate}}
|
|
<$context term={{$:/temp/advancedsearch}}/>
|
|
</$list>
|
|
```
|
|
|
|
That will search for tiddlers containing the text specified in [[$:/temp/advancedsearch]] and will display a link to the matching tiddlers plus a preview of the matching content. Something very similar is used in [[Context Search]]. Below you can find a complete list of parameters and their default values.
|
|
|
|
|! parameter |! description | !default |
|
|
| term | The term you want to search ||
|
|
| searchTerm | An alias for the previous one ||
|
|
| tiddler | The tiddler's name to look into | current tiddler |
|
|
| length | Number of context characters to show | 50 |
|
|
| before | Number of characters before the matched term to show | the value of the length parameter |
|
|
| after | Number of characters after the matched term to show | the value of the length parameter |
|
|
| maxMatches | maximun number of matched elements to show. Incrementing this can cause several performance issues | 10 |
|
|
| element | Node element to create. This element will contain the results of the search. If you want to style it its class is `tw-context` | `<pre>` |
|
|
| matchClass | The css class to assign to the matched terms in the results. This is used to highlight the results | matched |
|
|
|
|
!Customizing the output
|
|
There are not many ways to customize the output of this widget. You can specify ''what type of node you want to create'' to wrap the results (div,span...). The default is `<pre>`. This container is created with the class `tw-context` so you can easily apply styles to it. Something similar happens to the ''highlighted'' words. You can specify the name of the class to assign to it and also you can apply styles to that class.
|
|
|
|
A very basic example of customization could be:
|
|
|
|
# Create a tiddler, for example [[$/plugins/danielo515/context/css]]
|
|
# Paste the following text or any css rule you want: """
|
|
|
|
<pre>
|
|
.matched{background-color:yellow}
|
|
.tw-context {
|
|
border:1px solid blue;
|
|
word-break: break-all; word-wrap: break-word;}
|
|
</pre>
|
|
"""
|
|
# Tag it with `$:/tags/stylesheet`
|
|
# Save the tiddler |