Où placer un template pour le desktop

Bonjour,

je cherche à me faire un panneau pour mon imprimante.

j’ai copié-collé celui de @Felix62
j’ai créé l’arborescence /config/www/custom-lovelace/ et ai mis le fichier button_card_templates.yaml
j’ai ensuite édité le fichier de configuration en rajoutant :

button_card_templates:
  !include www/custom-lovelace/button_card_templates.yaml

mais je n’arrive pas à comprendre le message d’erreur:
Impossible d’analyser le YAML : YAMLException: unknown tag !<!include> (5:10) 2 | - title: Home 3 | button_card_templates: 4 | !include www/custom-lovelace/bu … 5 | cards: --------------^ 6 | - type: custom:mushroom-chips-card 7 | chips:

j’ai essayé de mettre le chemin en absolu avec /config/www/custom-lovelace…
même motif - même punition (à part le chemin qui n’est plus relatif).

Là visiblement tu as essayé de copier/coller une petit partie du setup de felix, sans une partie des prérequis.
Tu mets « button_card_templates » en plein milieu d’une vue.
Mais ce n’est pas un mot clé connu de HA… si tu le définit pas avant. Je pense que dans lexemple que tu as pris, c’est dans « decluttering_templates » que tu vas avoir la définition…
De plus pour que mot clé decluttering_templates soit connu il faut que tu ais installé la bon package de HACS. Je ne l’utilise pas donc je peux pas t’aider plus. Mais il me semble que c’est celui là.

Si tu l’as installé déjà désolé, faudra lire la doc pour comprendre comment ça marche, mais comme tu ne le mentionnes pas je ne sais pas si tu l’as… :wink:

j’ai vérifié que le button-card était installé, j’en ai profité pour ajouter le decluttering-card.
quand je crée une carte avec

type: custom:button-card
entity: sensor.lexmark_cx517
name: CX517
color: gray
show_state: true

j’ai le message: Custom element doesn’t exist: button-card …

je vérifie la doc button-card et je comprend pas ceci:

Add the configuration to your ui-lovelace.yaml
resources:
  - url: /hacsfiles/button-card/button-card.js
    type: module

mais c’est où ce fichier ui-lovelace.yaml ?

Fait l’installation à partir de HACS… c’est 100000 de fois plus facile

c’est vrai, avec HACS ca passe crème…

Quel bourrin… en fait, je suis reparti sur une sauvegarde et j’avais pas du le remettre d’aplomb.

second truc, j’ai un fichier template button_card_template.yaml (de Felix62)

####################################################################################################################################################################################################################################################################################################################################################
####    ENCRE IMPRIMANTE
###############################################################################################################################################################
  inkwell:
    show_name: false
    show_state: true
    extra_styles: |
      [[[ return `
        @keyframes pulse {
          5% {
            background-color: ${variables.color};
          }
        }
      `]]]
    styles:
      icon:
        - opacity: 0.7
        - color: '[[[ return variables.color ]]]'
        - filter: drop-shadow( 0 0 2px rgba(0, 0, 0, .7))
      state:
        - font-size: 1.5em
        - font-weight: bold
        - text-shadow: 0 0 6px black
        - overflow: visible
      card:
        - border: solid 3px gray
        - border-top: none
        - background: |
            [[[
              var level = entity.state;
              var color = variables.color;
              return `linear-gradient(to top, ${color}, ${color} ${level}%, rgba(255,255,255,0.12) ${level}%)`
            ]]]
        - animation: |
            [[[
              return (0 + entity.state) < 10
                ? 'pulse ease-in-out 1s infinite'
                : 'none'
            ]]]

et ma carte qui l’appelle

custom_fields:
  k:
    card:
      type: custom:button-card
      template: inkwell
      entity: sensor.lexmark_cx517_black
      variables:
        color: black

où je dois ajouter le chemin où se trouve ce fichier yaml
du genre : button_card_templates: !include www/custom-lovelace/button_card_templates.yaml

Dans l’ui direct plutot qu’un fichier, pas besoin de reload comme ça
https://forum.hacf.fr/t/gerer-tout-le-style-css-sur-custom-hui-element-markdown/11264/12

bien bien bien…

j’en retire que c’est pas gagné cette histoire. l’animation est superbe, mais j’ai pas trouvé comment mettre le gif sur pause, le temps que je puisse faire la même chose… ma garte graphique est plus rapide que mon cerveau embrumé… :laughing:

je vais attaquer cette carte de manière plus basique, quitte à mettre 4 fois la mise en place des icones à la place d’un template.

le template sera pour une autre fois, il vaut mieux que je commence par quelque chose de plus lisible… :thinking:

ça boucle et tu peux passer en affichage maxi en cliquant sur l’animation. Prévoir dopage au :coffee: au pire

Après de toute façon, il faut commencer par simple, mais j’avoue que le declustterring ça mériterai une intégration un peu plus user firendly mais va changer pas mal de trucs chez moi quand même