mirror of
https://github.com/TriliumNext/Notes.git
synced 2025-08-10 02:02:29 +08:00
34 lines
1.6 KiB
Markdown
34 lines
1.6 KiB
Markdown
# Custom Resource Providers
|
|
A custom resource provider allows any file imported into Trilium (images, fonts, stylesheets) to be publicly accessible via a URL.
|
|
|
|
A potential use case for this is to add embed a custom font alongside a theme.
|
|
|
|
## Steps for creating a custom resource provider
|
|
|
|
1. Import a file such as an image or a font into Trilium by drag & drop.
|
|
2. Select the file and go to the _Owned Attributes_ section.
|
|
3. Add the label `#customResourceProvider=hello`.
|
|
4. To test if it is working, use a browser to navigate to `<protocol>://<host>/custom/hello` (where `<protocol>` is either `http` or `https` based on your setup, and `<host>` is the host or IP to your Trilium server instance). If you are running the TriliumNext application without a server, use `http://localhost:37840` as the base URL.
|
|
5. If everything went well, at the previous step the browser should have downloaded the file uploaded in the first step.
|
|
|
|
Instead of `hello`, the name can be:
|
|
|
|
* A path, such as `fonts/Roboto.ttf`, which would be accessible via `<host>/custom/fonts/Roboto.ttf`.
|
|
* As a more advanced use case, a regular expression to match multiple routes, such as `hello/.*` which will be accessible via `/custom/hello/1`, `/custom/hello/2`, `/custom/hello/world`, etc.
|
|
|
|
## Using it in a theme
|
|
|
|
For example, if you have a custom font to be imported by the theme, first upload a font file into Trilium and assign it the `#customResourceProvider=fonts/myfont.ttf` attribute.
|
|
|
|
Then modify the theme CSS to point to:
|
|
|
|
```css
|
|
@font-face {
|
|
font-family: customFont;
|
|
src: url("/custom/fonts/myfont.ttf");
|
|
}
|
|
|
|
div {
|
|
font-family: customFont;
|
|
}
|
|
``` |