Merci beaucoup @ZogStriP
Super je vais pouvoir moi aussi essayer de comprendre ses balises html
Merci
1 « J'aime »
Le widget en lui-même ne consomme pas de ressources si ce n’est un tout petit peu de mémoire.
Ce qui consomme des ressources, c’est la source de données qui vient pinger l’IPX toutes les X secondes (d’où mon sujet : Widget HTML/JavaScript et mise à jour automatique)
Mais bon, rien de bien méchant au final 
1 « J'aime »
Bonjour,
C’est encore moi, je m’incruste dans le sujet
Q1- J’ai réussi à changer l’icône (glyphicons- xxxx), la couleur ( ‹ ff7f00 › : ‹ 0f0 › ) et je voudrais appliquer ces modifications sur un autre widget HTML qui viendrait remplacer un autre widget qui est du type Retour d’état entrée mais je n’y arrive pas, sans doute à cause de var IsGateOpen que j’ai laissé. Comment fait-on pour changer de variable ?
Q2- La bibliothèque de glyphicons est super intéressante et bien entendu, ma question est : peut-on en importer pour enrichir celle de la V4, quitte à supprimer ceux qui ne sont pas utiles (pour ménager la mémoire, peut-être) ?
Cordialement.
1 « J'aime »
Il suffit de la renommer Genre
var isSwitchedOn = datasources["V4"]["response"]["in"][0] == 0;
var color = `color: #${ isSwitchedOn ? 'f00' : '0f0' };`;
Il faut bien entendu remplacer « isGateOpen » par « isSwitchedOn » dans le reste du code du widget et changer l’indice « [0] » par le numéro de l’entrée - 1.
Il n’y pas besoin d’importer quoi que ce soit pour utiliser les autres icones
C’est une police de caractères qui contient plein de symboles (je n’ai pas la liste exhaustive, le mieux est d’essayer pour voir ceux qui marchent).
2 « J'aime »
Super ! et merci pour votre réponse. Je me suis torturé l’esprit depuis hier pour essayer de comprendre les
modifications apportées et comment les appliquer dans d’autres widgets sans y parvenir complètement.
Avec vous, c’est tout simple 
Encore merci pour votre disponibilité et votre patience.
Maintenant, place à la pratique
Bonne journée.
1 « J'aime »
Bonjour,
@ZogStriP
Ce topic devrait avoir sa place dans le wiki.
Cdt
1 « J'aime »
Bonjour @fmmomo,
Pourrait-on avoir un retour sur ce que cela donne au niveau du dashboard ?
Merci.
Cdlt
Bonjour,
grâce aux conseils de @ZogStriP je me suis amuser avec les couleurs et format texte j essayerais de poursuivre ce soir
J aimerais faire comme toi ajouter les icônes
Super ! Merci. Vas-tu ajouter °C ou laisser comme ça ?
Justement j’aimerais bien rajouté °C mais pas évident pour trouvé les formules a ajouté.
J’ai réussi à ajouté des glyphicones devant mais j aimerais changer tout sa et bien sûr aligner tout
Mais pas simple
Bonjour,
En m’inspirant des réponses de @ZogStriP et en faisant des recherches complémentaires, j’ai fini par obtenir un résultat non sans mal, car je suis une buse. Si cela peut t’aider…
Il y a certainement beaucoup mieux à faire que ce que j’ai fait, mais je n’y ai pas réussi. En fait, je voulais faire un alignement vertical et horizontal pour améliorer la présentation mais niet !
Bonne journée.
5 « J'aime »
Super merci @Aspro95
Je vais essayé le tiens car c est aligné moi j ai du mal avec les balises « span » Voila ce que j ai fait mais vais essayer avec margin comme toi
Merci
Bonjour,
Pour parfaire vos alignements, vous pouvez utiliser les tableaux.
La structure :
<table>et</table>encadrent le tableau<tr>et</tr>définissent une ligne de tableau<td>et</td>définissent une cellule de la ligne
<table>
<tr>
<td align=left>donnée1</td>
<td align=left>donnée2</td>
<td align=right>donnee3</td>
</tr>
</table>
Pour vous aider dans le tableau, je vous ai replacé des balises <span> pour que vous puissiez localiser l’emplacement où mettre vos données.
vous obtiendriez:
<table width='100%'>
<tr>
<td align=left width='10%'><span color='#0F0'>placer ici glyphicons</span></td>
<td align=left width='50%'><span color='blue'>placer ici le titre </span></td>
<td align=right><span color='green'>placer ici la valeur</span></td>
</tr>
<tr>
<td align=left width='10%'><span color='#0F0'>placer ici glyphicons 2</span></td>
<td align=left width='50%'><span color='blue'>placer ici le titre 2 </span></td>
<td align=right><span color='green'>placer ici la valeur 2</span></td>
</tr>
</table>
voilà, si ça peut aider
Merci @Zogstrip d’avoir supprimé la clause « si IPX supporte ». Après réflexion, tu as raison, l’IPX n’a rien à supporter puisque c’est le navigateur du client qui interprète les balises Html. 
4 « J'aime »
Merci beaucoup @fgtoul d avoir regardé mon histoire d alignement , j essaie de mettre sa en place ce soir
Merci bonne journée
1 « J'aime »
si tu veux pousser plus loin avec les alignements, tu verras que dans le code j’ai utilisé l’attribut align=left
align correspond à l’alignement horizontal dans la cellule. Les valeurs possibles sont :
- left (texte aligné à gauche)
- center (texte aligné au centre)
- right (texte aligné à droite)
- justify (texte justifié, peut utilisé sur le web car pas bien rendu)
Il existe un autre attribut, pour aligner le texte verticalement dans la cellule. Cet attribut est valign
ses valeurs sont :
- top (texte aligné en haut)
- middle (texte aligné au milieu)
- bottom (texte aligné en bas)
Ainsi, pour chaque cellule tu peux avoir un alignement horizontal ou vertical comme tu le souhaites.
tu obtiendrais par exemple :
<table width='100%'>
<tr>
<td align=left valign=middle width='10%'><span color='#0F0'>placer ici glyphicons</span></td>
<td align=left valign=middle width='50%'><span color='#0F0'>placer ici le titre </span></td>
<td align=right valign=middle><span color='#0F0'>placer ici la valeur</span></td>
</tr>
<tr>
<td align=left valign=middle width='10%'><span color='#0F0'>placer ici glyphicons 2</span></td>
<td align=left valign=middle width='50%'><span color='#0F0'>placer ici le titre 2 </span></td>
<td align=right valign=middle ><span color='#0F0'>placer ici la valeur 2</span></td>
</tr>
</table>
EDIT : Attention le code ci-dessus est un exemple.
une adaptation plus précise a été donnée plus bas.
4 « J'aime »
Bonjour @fgtoul,
Merci beaucoup pour ces infos et explications qui répondent parfaitement au besoin. Mais comme je l’ai dit précédemment, je suis une buse.
Je les ai appliquées à la lettre et cependant les couleurs ne sont pas prises en compte et glyphicons non plus.
Ai-je mal fait ou oublié quelque chose ? Certainement mais quoi ???
2 « J'aime »
non, la buse c’est moi, à force de coder, je mélange les langages 
remplace les couleurs que j’ai mises par celles que tu avais, avec l’attribut
style='color: #0F0' (syntaxe donnée par ZogStriP)
en fait tu ne devrais rien changer à la syntaxe que tu avais avec <Span>.....</Span>
ça devrait donner un truc du genre
<table width='100%'>
<tr>
<td width='10%' align=left valign=middle><span style='color: #ffff00' class="glyphicons glyphicons-temperature x2"></span></td>
<td width='50%' align=left valign=middle><span style='color: #ffff00' >Ambiante :</span></td>
<td align=right valign=middle><span style='color: #ffff00; font-size: 20px;'>${([((datasource………………..} °C</span></td>
</tr>
…..
</table>
je ne sais pas si je suis clair.
4 « J'aime »
Merci @fgtoul c’est clair et ça rend très bien (à mon goût) !
A toi de jouer @fmmomo
Bonne fin de journée, moi j’arrête là, j’ai la tête qui fume 
return `
<table width='100%'>
<tr>
<td align=left valign=middle width='10%'><span style='color: #ffff00'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #ffff00'>Ambiante</span></td>
<td align=right valign=middle><span style='color: #ffff00;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog0"])*0.0050354)-49]/1).toFixed(1)} °C</span></td>
</tr>
<tr>
<td align=left valign=middle width='10%'><span style='color: #00ffff'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #00ffff'>Extérieure</span></td>
<td align=right valign=middle><span style='color: #00ffff;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog1"])*0.0050354)-51]/1).toFixed(1)} °C</span></td>
</tr>
<tr>
<td align=left valign=middle width='10%'><span style='color: #ff00ff'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #ff00ff'>Départ plancher</span></td>
<td align=right valign=middle><span style='color: #ff00ff;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog3"])*0.0050354)-49]/1).toFixed(1)} °C</span></td>
</tr>
</table>
`;
6 « J'aime »