Cards: link to cards and themes (#31970)

2025-07-21 16:27:19 +00:00 · 2024-03-20 16:14:39 +01:00 · 2024-03-20 16:14:39 +01:00 · a7a519a19f
commit a7a519a19f
parent 7b00bfb23c
30 changed files with 133 additions and 16 deletions
--- a/source/_dashboards/alarm-panel.markdown
+++ b/source/_dashboards/alarm-panel.markdown
@ -5,7 +5,7 @@ sidebar_label: Alarm panel
 description: "The alarm panel card allows you to arm and disarm your alarm control panel integrations."
 ---

-The alarm panel card allows you to arm and disarm your [alarm control panel](/integrations/#alarm) integrations.
+The alarm panel card allows you to arm and disarm your [alarm control panel](/integrations/#alarm) {% term integrations %}.

 <p class='img'>
 <img src='/images/dashboards/alarm_panel_card.gif' alt='Screenshot of the alarm panel card'>
@ -81,3 +81,8 @@ states:
  - arm_night
  - armed_custom_bypass
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/area.markdown
+++ b/source/_dashboards/area.markdown
@ -5,7 +5,7 @@ sidebar_label: Area
 description: "The area card gives control of your entities in a specified area."
 ---

-The area card lets you control and monitor an individual area.
+The area card lets you control and monitor an individual {% term area %}.

 <p class='img'>
  <img src='/images/dashboards/area-card.png' alt='Screenshot of the area card'>
@ -16,9 +16,9 @@ The area card lets you control and monitor an individual area.

 All options for this card can be configured via the user interface.

-Buttons will appear on the card for the entities in the area including fan, light and switch. A motion sensor icon will appear in the top left if a motion sensor is in the area and motion is detected by the motion sensor.
+Buttons will appear on the card for the {% term entities %} in the area including fan, light, and switch. A motion sensor icon will appear in the top left if a motion sensor is in the area and if motion is detected by the motion sensor.

-If a camera is added to the area you can show the camera feed instead of the area picture.
+If a camera is added to the {% term area %} you can show the camera feed instead of the area picture.

 ## YAML configuration

@ -86,3 +86,8 @@ navigation_path: my_bedroom
 show_camera: true
 theme: green
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/button.markdown
+++ b/source/_dashboards/button.markdown
@ -141,3 +141,5 @@ Screenshot of the button card with script service.

 - [Card actions](/dashboards/actions/)
 - [Scripts](/docs/scripts/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/calendar.markdown
+++ b/source/_dashboards/calendar.markdown
@ -5,7 +5,7 @@ sidebar_label: Calendar
 description: "The calendar card displays your calendar entities in a month, day and list view"
 ---

-The calendar card displays your [calendar](/integrations/#calendar) entities in a month, day and list view (7 days).
+The calendar card displays your [calendar](/integrations/#calendar) {% term entities %} in a month, day, and list view (7 days).

 <p class='img'>
  <img src='/images/dashboards/calendar_card.png' alt='Screenshot of the 
@ -52,3 +52,8 @@ entities:
  - calendar.calendar_1
  - calendar.calendar_2
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/conditional.markdown
+++ b/source/_dashboards/conditional.markdown
@ -36,6 +36,7 @@ card:
 ## Examples

 Only show when all the conditions are met:
+
 ```yaml
 type: conditional
 conditions:
@ -59,6 +60,7 @@ card:
 ```

 Example condition where only one of the conditions needs to be met:
+
 ```yaml
 type: conditional
 conditions:
@ -188,3 +190,7 @@ users:
  description: User ID that can see the card (unique hex value found on the Users configuration page).
  type: list
 {% endconfiguration %}
+
+## Related topics
+
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/energy.markdown
+++ b/source/_dashboards/energy.markdown
@ -229,3 +229,8 @@ The following example limits the number of shown devices to 5:
 type: energy-devices-detail-graph
 max_devices: 5
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/entities.markdown
+++ b/source/_dashboards/entities.markdown
@ -461,3 +461,4 @@ entities:

 - [Card actions](/dashboards/actions/)
 - [Card header and footer](/dashboards/header-footer/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/entity.markdown
+++ b/source/_dashboards/entity.markdown
@ -82,3 +82,5 @@ footer:
 ## Related topics

 - [Card header and footer](/dashboards/header-footer/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/gauge.markdown
+++ b/source/_dashboards/gauge.markdown
@ -181,3 +181,9 @@ segments:
  - from: 65
    color: var(--error-color)
 ```
+
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/glance.markdown
+++ b/source/_dashboards/glance.markdown
@ -161,3 +161,5 @@ entities:
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/grid.markdown
+++ b/source/_dashboards/grid.markdown
@ -80,3 +80,8 @@ cards:
        entity: light.bed_light
        image: /local/bed_2.png
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/history-graph.markdown
+++ b/source/_dashboards/history-graph.markdown
@ -107,3 +107,8 @@ entities:
  - entity: sensor.attic_temperature
    name: "Attic"
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/horizontal-stack.markdown
+++ b/source/_dashboards/horizontal-stack.markdown
@ -46,3 +46,7 @@ cards:
  <img src='/images/dashboards/horizontal_stack.png' alt='Two picture cards in a horizontal stack card'>
  Two picture cards in a horizontal stack card.
 </p>
+
+## Related topics
+
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/iframe.markdown
+++ b/source/_dashboards/iframe.markdown
@ -56,3 +56,7 @@ type: iframe
 url: https://www.home-assistant.io
 aspect_ratio: 75%
 ```
+
+## Related topics
+
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/light.markdown
+++ b/source/_dashboards/light.markdown
@ -84,3 +84,5 @@ Screenshot of the Light card names.
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/logbook.markdown
+++ b/source/_dashboards/logbook.markdown
@ -65,3 +65,8 @@ entities:
  - light.ceiling_lights
 hours_to_show: 24
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/map.markdown
+++ b/source/_dashboards/map.markdown
@ -134,3 +134,8 @@ entities:
    focus: false
 hours_to_show: 48
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/markdown.markdown
+++ b/source/_dashboards/markdown.markdown
@ -140,3 +140,8 @@ content: |
  <ha-alert alert-type="success">This is a success alert — check it out!</ha-alert>
  <ha-alert title="Test alert">This is an alert with a title</ha-alert>
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/media-control.markdown
+++ b/source/_dashboards/media-control.markdown
@ -46,3 +46,8 @@ Basic example:
 type: media-control
 entity: media_player.lounge_room
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/picture-elements.markdown
+++ b/source/_dashboards/picture-elements.markdown
@ -577,3 +577,5 @@ elements:
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/picture-entity.markdown
+++ b/source/_dashboards/picture-entity.markdown
@ -142,3 +142,5 @@ The filename needs to be a path that is writable by Home Assistant in your syste
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/picture-glance.markdown
+++ b/source/_dashboards/picture-glance.markdown
@ -271,3 +271,5 @@ entity: group.living.room
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/picture.markdown
+++ b/source/_dashboards/picture.markdown
@ -78,3 +78,5 @@ tap_action:
 ## Related topics

 - [Card actions](/dashboards/actions/)
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/plant-status.markdown
+++ b/source/_dashboards/plant-status.markdown
@ -48,3 +48,8 @@ Basic example:
 type: plant-status
 entity: plant.bonsai
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/sensor.markdown
+++ b/source/_dashboards/sensor.markdown
@ -83,3 +83,8 @@ type: sensor
 entity: sensor.illumination
 name: Illumination
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/statistic.markdown
+++ b/source/_dashboards/statistic.markdown
@ -172,3 +172,8 @@ period:
      seconds: -10
 stat_type: change
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/statistics-graph.markdown
+++ b/source/_dashboards/statistics-graph.markdown
@ -96,3 +96,8 @@ entities:
  - entity: sensor.inside_temperature
    name: Inside
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/tile.markdown
+++ b/source/_dashboards/tile.markdown
@ -134,3 +134,4 @@ You want to colorize the tile card? Choose one of the following colors: `primary

 - [Card actions](/dashboards/actions/)
 - [Card features](/dashboards/features)
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/vertical-stack.markdown
+++ b/source/_dashboards/vertical-stack.markdown
@ -71,3 +71,7 @@ cards:
  <img src="/images/dashboards/vertical-horizontal-stack.png" alt="Create a grid layout using vertical and horizontal stack">
  Create a grid layout using vertical and horizontal stack.
 </p>
+
+## Related topics
+
+- [Dashboard cards](/dashboards/cards/)
--- a/source/_dashboards/weather-forecast.markdown
+++ b/source/_dashboards/weather-forecast.markdown
@ -153,3 +153,8 @@ Example theme configuration:
 ```yaml
 --weather-icon-sunny: url("/local/sunny.png")
 ```
+
+## Related topics
+
+- [Themes](/integrations/frontend/)
+- [Dashboard cards](/dashboards/cards/)