docs: How to add hyperlinks in dashboards

This commit is contained in:
jamesread 2026-05-21 10:16:53 +01:00
parent 3c8490fa57
commit 7fa8e0025c
3 changed files with 45 additions and 0 deletions

View File

@ -86,6 +86,7 @@
** xref:dashboards/2-fieldsets.adoc[Fieldsets]
** xref:dashboards/3-folders.adoc[Folders]
** xref:dashboards/4-displays.adoc[Displays]
** xref:dashboards/faq-display-hyperlinks.adoc[Hyperlinks (Displays)]
** xref:dashboards/5-output-views.adoc[Output Views]
** xref:dashboards/entity-directories.adoc[Entity Directories]
* xref:entities/intro.adoc[Entities]

View File

@ -0,0 +1,43 @@
[#faq-dashboard-display-hyperlinks]
= Hyperlinks in dashboards
This page explains how to add clickable links on dashboards using xref:dashboards/4-displays.adoc[display components] (`type: display`).
== How do I add a clickable link on a dashboard?
Use a `type: display` component and put normal HTML in its `title` field. OliveTin renders `title` as HTML, so use an anchor element, for example:
[source,html]
----
<a href="https://example.com">Documentation</a>
----
== Should I open external links in a new tab?
For links that leave OliveTin, `target="_blank"` is convenient. Combine it with `rel="noopener noreferrer"` so the new page cannot access your OliveTin tab and referrer details are limited. Example:
[source,yaml]
----
contents:
- type: display
title: |
<a href="https://example.com/docs" target="_blank" rel="noopener noreferrer">Open docs</a>
----
== Can I mix links with entity variables or plain text?
Yes. `title` can combine literal text, xref:entities/intro.adoc[entity template variables], and HTML (such as `<br />`, `<strong>`, or `<a>`). Use YAML's `|` block scalar when you need several lines.
== Does Markdown link syntax like `[text](url)` work?
No. Display `title` is not run through a Markdown parser; it is treated as HTML. Use `<a href="...">...</a>` (or other tags you need) explicitly.
== What should I avoid when embedding HTML?
Treat anything you put in `title` as trusted markup only you control; do not paste untrusted strings into `href` or other attributes without strict validation.
Some deployments use xref:security/content_security_policy.adoc[Content Security Policy] headers, which may block certain schemes or injected scripts—ordinary `https:` links are usually the safest choice.
== Where else is this documented?
See xref:dashboards/4-displays.adoc[Displays] for full display configuration (including xref:dashboards/css.adoc[CSS classes]).

View File

@ -89,6 +89,7 @@ Now that you understand dashboards, explore these related features:
* xref:dashboards/2-fieldsets.adoc[Learn about fieldsets] - Group actions visually on dashboards
* xref:dashboards/3-folders.adoc[Organize with folders] - Create folder structures for better organization
* xref:dashboards/4-displays.adoc[Add displays] - Show information alongside actions
* xref:dashboards/faq-display-hyperlinks.adoc[FAQ: Hyperlinks in displays] - Clickable links in display components
* xref:dashboards/5-output-views.adoc[Configure output views] - Customize how action output is displayed
* xref:entities/intro.adoc[Use entities with dashboards] - Dynamically generate actions from entity files
* xref:dashboards/examples.adoc[View dashboard examples] - See complete dashboard configurations