Problem with iFrame State card

[Per-Henrik_Lind]

Hi,
I am trying to implement this to my HA instance:

Deprecated: Iframe state card for Home Assistant

I needed to display some iframes inside HASS for a small project. Maybe some of you are interested to use the code. Please note that more work is needed (e.g. CSS is a mess, alignment, sizing etc.). Additionally, not all websites allow iframe embedding so don’t blame me for that. [image]

The result I get is like the image below. I only se the icon, but not the actual website that is in the iframe URL.

If I click the icon the correct URL is showing.

This is what I have done so far:
Added this under sensor in configuration.yaml

- platform: template
        sensors:
          iframe:
            value_template: iframe
          iframe2:
            value_template: iframe

Added the “state-card-iframe.html” to my “custom-ui” folder

Added this to my groups.yaml

group_iframe:
    view: true
    icon: mdi:camcorder
    entities:
      - sensor.iframe
group_iframe2:
    name: Name 2
    entities:
      - sensor.iframe2

Added this to the customize.yaml

sensor.iframe:
      custom_ui_state_card: state-card-iframe
      icon: mdi:cam
      config:
        height: 490
        width: 108
        scale: 1
        url: https://www.xxxxxxxxxxx.se/xxxxxx.php

Thanks in advance for any ideas!

[covrig]

It could be the javascript version you use in the frontend section.

The value in the config can be overridden by putting es5 or latest in the URL. For example http://localhost:8123/states?es5

Default value: auto

[Per-Henrik_Lind]

Hi,
Thanks for the reply.

Tried to put "?es5 " after the URL but no noticable difference.