I wasn’t able to find any similar examples for such a useful tool so I’m posting in the hopes this will help others.
This is a simplified overview of a method for creating URLs that can be dynamically updated based on state
changes. URLs created with template_sensors aren’t ‘live’ (clickable) in Lovelace and templates cannot be used directly in Lovelace Cards, but this gap can be bridged via APIs for ‘branded’ URL services. For this example I chose Rebrandly. The end result is a static URL that can be entered in the Frontend as a weblink
which will redirect to a different URL that has been constructed and updated using a shell_command
template triggered by an automation
.
Basic instructions:
- After signing up with Rebrandly (free) and being prompted to create a new link, enter any valid URL (this will be changed later through their API).
- Enter a ‘Friendly Name’ you prefer. In this example the resulting URL would be “https://rebrand.ly/Home-Assistant”.
- You can probably figure this one out.
- Click on the link you created to open its properties(?) page.
- Copy and save the last segment of the URL from your browser address bar. This is the link
id
that their API will use to update the URL.
- At the top-right of the page click on your user icon then API keys, and copy and save your API Key. This is the token their API will use for authentication.
- Create a shell_command that will use cURL to update Rebrandly’s API. Using the example info from above, it would look something like:
update_link: >
curl 'https://api.rebrandly.com/v1/links/e89f137125c74881a98fd2b8e81bbe9d' \ # <-- link id
-H 'apikey: ##X##X###XXX##X#X####XX#########' \ # <-- API key
-H 'Content-Type: application/json' \
-d '{"destination": "https://www.home-assistant.io/"}' # <-- destination URL
…but of course this would be pointless without the link actually being dynamic, so you’ll want something more like this (navigation map URL based on device_tracker
coordinates):
update_link: >
curl 'https://api.rebrandly.com/v1/links/X##X######X#####X##XX#X#X##XXX#X' \
-H 'apikey: ##X##X###XXX##X#X####XX#########' \
-H 'Content-Type: application/json' \
-d '{"destination": "https://www.google.com/maps/dir/?api=1&dir_action=navigate&destination={{state_attr('device_tracker.XXXXXXXXXX', 'latitude') }},{{ state_attr('device_tracker.XXXXXXXXXX', 'longitude')}}"}'
Note: If you use states or attributes that return spaces or special characters you may want to add |urlencode
before the closing double braces (}}
) to help ensure browser / website compatibility. Use the Template Editor in Development Tools to test the resulting URL.
- Create an automation to execute the
shell_command
:
- alias: "Update Link"
initial_state: true
trigger:
platform: state
entity_id: device_tracker.XXXXXXXXXX
action:
- service: shell_command.update_link
- Add a weblink to your Frontend using the resulting URL created in Step 2 (ex: “https://rebrand.ly/Home-Assistant”):
- type: weblink
name: Home Assistant
url: https://rebrand.ly/Home-Assistant # <-- "https://rebrand.ly/" + what you entered as 'Slash tag'
icon: mdi:home-assistant
Some other use-cases that come to mind are:
- Link to a particular LoveLace View (page) based on lights / motion sensor
states
- Link to most recently recorded / downloaded media content
- Link to most recent camera DVR clip
- iFrame Card switching from weather forecast to storm tracking map (refresh required)
- Link to different Calendars / Reminders depending on
zone
- Link to different device UIs depending on warning / error codes
Hope this is as useful for others as it has been for me.