diff --git a/README.md b/README.md
index 82ceba58..19bd3c29 100644
--- a/README.md
+++ b/README.md
@@ -23,12 +23,12 @@ Les informations affichées :
 - informations météorologiques détaillées,
 - pluviométrie dans l'heure (prévisions à 5 puis 10 minutes),
 - alertes météos en cours (inondations, vents violents, etc) en rapport à votre département,
-- prévisions météo quotidienne de 1 à 15 jours maximum (réglable) ou des prévisions horaires de 1 à x heures (réglable),
+- prévisions météo quotidiennes de 1 à 15 jours maximum (réglable) et des prévisions horaires de 1 à x heures (réglable),
 - sélection des informations à afficher pour personnaliser votre carte.
 
 Un exemple de rendu :
 
-![Weather Card](https://github.com/hacf-fr/lovelace-meteofrance-weather-card/blob/Meteo-France/meteofrance-weather-card.png)
+![Weather Card](meteofrance-weather-card.png)
 
 ## Installation
 
@@ -59,21 +59,17 @@ Vous trouverez la carte dans la liste des cartes personnalisées (en fin de list
 
 Une fois choisi, sa configuration est la suivante :
 
-1. **Définir un nom** pour la carte (généralement la ville, comme pour l'intégration).
+1. **Sélectionner l'entité météo** que vous avez défini avec l'intégration (par défaut la carte en choisit une mais ce n'est pas forcément l'entité météo france que vous avez configuré).
 
-2. **Sélectionner l'entité météo** que vous avez définit avec l'intégration (par défaut la carte en choisit une mais ce n'est pas forcément l'entité météo france que vous avez configuré).
+2. Toutes les autres entités **sont automatiquement définies** mais vous pouvez les redéfinir ou les supprimer à votre guise.
 
-3. Toutes les autres entités **sont automatiquement définies** mais vous pouvez les redéfinir ou les supprimer à votre guise.
+3. **Sélectionner les éléments** de la carte **à afficher** (vous pouvez ainsi avoir plusieurs cartes avec des affichages différents).
 
-4. Seule l'entité pour **les alertes est à préciser manuellement**.
+4. **Préciser les nombres d'heures et de jours de prévision** à afficher.
 
-5. **Sélectionner les parties** de la carte **à afficher** (vous pouvez ainsi avoir plusieurs cartes avec des affichages différents).
+5. `Enregistrer` votre configuration.
 
-6. **Préciser le nombre de jours de prévision** à afficher en bas de carte, maximum 5.
-
-7. `Enregistrer` votre configuration.
-
-![Weather Card Configuration](https://github.com/hacf-fr/lovelace-meteofrance-weather-card/blob/Meteo-France/meteofrance-weather-card-editor.png)
+![Weather Card Configuration](meteofrance-weather-card-editor.png)
 
 ### Installation manuelle (utilisateurs avancés)
 
@@ -117,23 +113,32 @@ Ci-dessous les éléments de configuration avec pour exemple l'usage d'une inté
 view:
     cards:
     - type: "custom:meteofrance-weather-card"
-        name: Nantes # nom de la carte, peut être différent du nom de l'intégration
-        entity: weather.nantes # Entité météo principale
-        # Les entités annexes de météo france
-        cloudCoverEntity: sensor.nantes_cloud_cover
-        rainChanceEntity: sensor.nantes_rain_chance
-        freezeChanceEntity: sensor.nantes_freeze_chance
-        snowChanceEntity: sensor.nantes_snow_chance
-        uvEntity: sensor.nantes_uv
-        rainForecastEntity: sensor.nantes_next_rain
-        alertEntity: sensor.44_weather_alert
-        number_of_forecasts: "5"
-        # Les switches pour afficher ou non les différentes zones.
-        current: true
-        details: true
-        one_hour_forecast: true
-        alert_forecast: true
-        forecast: true
+      entity: weather.nantes # Entité météo principale
+      name: Nantes # nom de la carte, peut être différent du nom de l'intégration
+      # Les switches pour afficher ou non les différentes zones.
+      current: true
+      details: true
+      alert_forecast: true
+      one_hour_forecast: true
+      daily_forecast: true
+      hourly_forecast: true
+      humidity_forecast: true
+      wind_forecast_icons: true
+      animated_icons: true
+      # Les curseurs
+      number_of_hourly_forecasts: "5"
+      number_of_daily_forecasts: "5"
+      # Les entités annexes de météo france
+      detailEntity: sensor.nantes_daily_precipitation
+      cloudCoverEntity: sensor.nantes_cloud_cover
+      rainChanceEntity: sensor.nantes_rain_chance
+      freezeChanceEntity: sensor.nantes_freeze_chance
+      snowChanceEntity: sensor.nantes_snow_chance
+      uvEntity: sensor.nantes_uv
+      rainForecastEntity: sensor.nantes_next_rain
+      alertEntity: sensor.44_weather_alert
+      # Chemin
+      icons: /local/community/lovelace-meteofrance-weather-card/icons/
 ```
 
 #### options avancées via YAML
diff --git a/dist/meteofrance-weather-card-editor.js b/dist/meteofrance-weather-card-editor.js
old mode 100644
new mode 100755
index 54f0d1fa..a27b5b77
--- a/dist/meteofrance-weather-card-editor.js
+++ b/dist/meteofrance-weather-card-editor.js
@@ -31,6 +31,7 @@ const css = LitElement.prototype.css;
 const HELPERS = window.loadCardHelpers();
 
 const DefaultSensors = new Map([
+  ["detailEntity", "_rain_chance"],
   ["cloudCoverEntity", "_cloud_cover"],
   ["rainChanceEntity", "_rain_chance"],
   ["freezeChanceEntity", "_freeze_chance"],
@@ -42,6 +43,12 @@ const DefaultSensors = new Map([
 export class MeteofranceWeatherCardEditor extends LitElement {
   setConfig(config) {
     this._config = { ...config };
+
+    // Set default sub-entities at first Init (when there are only "entity" & "type" in config)
+    if (Object.keys(config).length === 2 && config.entity !== undefined) {
+      this._weatherEntityChanged(config.entity.split(".")[1]);
+      fireEvent(this, "config-changed", { config: this._config });
+    }
   }
 
   static get properties() {
@@ -68,12 +75,20 @@ export class MeteofranceWeatherCardEditor extends LitElement {
     return this._config.details !== false;
   }
 
-  get _forecast() {
-    return this._config.forecast !== false;
+  get _daily_forecast() {
+    return this._config.daily_forecast !== false;
   }
 
-  get _number_of_forecasts() {
-    return this._config.number_of_forecasts || 5;
+  get _number_of_daily_forecasts() {
+    return this._config.number_of_daily_forecasts || 5;
+  }
+
+  get _hourly_forecast() {
+    return this._config.hourly_forecast !== false;
+  }
+
+  get _number_of_hourly_forecasts() {
+    return this._config.number_of_hourly_forecasts || 5;
   }
 
   // Météo France
@@ -97,7 +112,7 @@ export class MeteofranceWeatherCardEditor extends LitElement {
   get _humidity_forecast() {
     return this._config.humidity_forecast !== false;
   }  
-  // Config value
+
   get _alertEntity() {
     return this._config.alertEntity || "";
   }
@@ -146,70 +161,57 @@ export class MeteofranceWeatherCardEditor extends LitElement {
     return html`
       <div class="card-config">
         <div>
-          <paper-input
-            label="Name"
-            .value="${this._name}"
-            .configValue="${"name"}"
-            @value-changed="${this._valueChanged}"
-          ></paper-input>
+          <!-- Primary weather entity -->
+          ${this.renderWeatherPicker("Entité", this._entity, "entity")}
+          ${this.renderTextField("Nom", this._name, "name")}
           ${this.renderSensorPicker(
             "Détail",
             this._detailEntity,
             "detailEntity"
           )}
-          <paper-input
-            label="Icons location"
-            .value="${this._icons}"
-            .configValue="${"icons"}"
-            @value-changed="${this._valueChanged}"
-          ></paper-input>
-          <!-- Primary weather entity -->
-          ${this.renderWeatherPicker("Entity", this._entity, "entity")}
           <!-- Switches -->
           <ul class="switches">
-            ${this.renderSwitchOption("Show current", this._current, "current")}
-            ${this.renderSwitchOption("Show details", this._details, "details")}
+            ${this.renderSwitchOption("Météo actuelle", this._current, "current")}
+            ${this.renderSwitchOption("Détails", this._details, "details")}
             ${this.renderSwitchOption(
-              "Show one hour forecast",
+              "Alertes",
+              this._alert_forecast,
+              "alert_forecast"
+            )}
+            ${this.renderSwitchOption(
+              "Pluie dans l'heure",
               this._one_hour_forecast,
               "one_hour_forecast"
             )}
             ${this.renderSwitchOption(
-              "Show alert",
-              this._alert_forecast,
-              "alert_forecast"
+              "Prévisions par heure",
+              this._hourly_forecast,
+              "hourly_forecast"
             )}
             ${this.renderSwitchOption(
-              "Show forecast",
-              this._forecast,
-              "forecast"
+              "Prévisions par jour",
+              this._daily_forecast,
+              "daily_forecast"
             )}
             ${this.renderSwitchOption(
-              "Use animated icons",
-              this._animated_icons,
-              "animated_icons"
+              "Humidité",
+              this._humidity_forecast,
+              "humidity_forecast"
             )}
             ${this.renderSwitchOption(
-              "Show wind icons",
+              "Girouette",
               this._wind_forecast_icons,
               "wind_forecast_icons"
-            )}	
+            )}
             ${this.renderSwitchOption(
-              "Show humidity forecast",
-              this._humidity_forecast,
-              "humidity_forecast"
-            )}					
+              "Icones animées",
+              this._animated_icons,
+              "animated_icons"
+            )}				
           </ul>
           <!-- -->
-          <paper-input
-            label="Number of future forcasts"
-            type="number"
-            min="1"
-            max="8"
-            value=${this._number_of_forecasts}
-            .configValue="${"number_of_forecasts"}"
-            @value-changed="${this._valueChanged}"
-          ></paper-input>
+          ${this.renderNumberField("Nombres d'heures", this._number_of_hourly_forecasts, "number_of_hourly_forecasts")}
+          ${this.renderNumberField("Nombres de jours", this._number_of_daily_forecasts, "number_of_daily_forecasts")}
           <!-- Meteo France weather entities -->
           ${this.renderSensorPicker(
             "Risque de pluie",
@@ -242,11 +244,32 @@ export class MeteofranceWeatherCardEditor extends LitElement {
             this._rainForecastEntity,
             "rainForecastEntity"
           )}
+          ${this.renderTextField("Répertoire des icones", this._icons, "icons")}
         </div>
       </div>
     `;
   }
 
+  renderTextField(label, state, configAttr) {
+    return this.renderField(label, state, configAttr, "text");
+  }
+
+  renderNumberField(label, state, configAttr) {
+    return this.renderField(label, state, configAttr, "number");
+  }
+
+  renderField(label, state, configAttr, type) {
+    return html`
+      <ha-textfield
+        label="${label}"
+        .value="${state}"
+        type="${type}"
+        .configValue=${configAttr}
+        @input=${this._valueChanged}
+      ></ha-textfield>
+    `;
+  }
+
   renderWeatherPicker(label, entity, configAttr) {
     return this.renderPicker(label, entity, configAttr, "weather");
   }
@@ -283,14 +306,42 @@ export class MeteofranceWeatherCardEditor extends LitElement {
     `;
   }
 
-  _weatherEntityChanged(entityName) {
+  _weatherEntityChanged(weatherEntityName) {
+    const weatherEntityNameFull = "weather." + weatherEntityName;
+    const state = this.hass.states[weatherEntityNameFull];
+    if (state !== undefined) {
+      // Set default Name
+      const friendly_name = state.attributes.friendly_name;
+      this._config = {
+        ...this._config,
+        ["name"]: friendly_name ? friendly_name : "",
+      };
+
+      // Set default Alert sensor
+      // Find Alert Sensor related to its parent device
+      const entity = this.hass.entities[weatherEntityNameFull];
+      const parent_device_id = entity.device_id;
+      Object.keys(this.hass.entities).forEach(entityName => {
+        const entity = this.hass.entities[entityName];
+        if (entity !== undefined && entity.device_id === parent_device_id && entityName.split(".")[1].includes("_weather_alert")) {
+          this._config = {
+            ...this._config,
+            ["alertEntity"]: entityName,
+          };
+          return;
+        }
+      });
+    };
+
+    // Set default Sensors
     DefaultSensors.forEach((sensorSuffix, configAttribute) => {
-      const entity = "sensor." + entityName + sensorSuffix;
-      if (this.hass.states[entity] !== undefined)
+      const entity = "sensor." + weatherEntityName + sensorSuffix;
+      if (this.hass.states[entity] !== undefined) {
         this._config = {
           ...this._config,
           [configAttribute]: entity,
         };
+      };
     });
   }
 
diff --git a/dist/meteofrance-weather-card.js b/dist/meteofrance-weather-card.js
old mode 100644
new mode 100755
index 0c432781..edeb158d
--- a/dist/meteofrance-weather-card.js
+++ b/dist/meteofrance-weather-card.js
@@ -24,6 +24,7 @@ const weatherIconsDay = {
 };
 
 const DefaultSensors = [
+  ["detailEntity", "_rain_chance"],
   ["cloudCoverEntity", "_cloud_cover"],
   ["rainChanceEntity", "_rain_chance"],
   ["freezeChanceEntity", "_freeze_chance"],
@@ -140,6 +141,8 @@ class MeteofranceWeatherCard extends LitElement {
   static get properties() {
     return {
       _config: {},
+      _dailyForecastEvent: {},
+      _hourlyForecastEvent: {},
       hass: {},
     };
   }
@@ -192,11 +195,47 @@ class MeteofranceWeatherCard extends LitElement {
     return entities;
   }
 
+  isDailyForecast(forecast) {
+    const diff =
+      new Date(forecast[1].datetime) - new Date(forecast[0].datetime);
+    return diff > 3600000;
+  }
+
+  // Upgrade config fields if necessary
+  upgradeConfig(config) {
+    const upgradedConfig = { ...config };
+    if (this.hass !== undefined) {
+      const stateObj = this.hass.states[this._config.entity];
+      if (stateObj !== undefined && stateObj.attributes.forecast !== undefined) {
+        // Deduce "daily_forecast" & "hourly_forecast" from deprecated "forecast"
+        if (this.isDailyForecast(stateObj.attributes.forecast)) {
+          if (config["forecast"] !== undefined && config["daily_forecast"] === undefined) {
+            upgradedConfig["daily_forecast"] = config["forecast"];
+            upgradedConfig["hourly_forecast"] = "false";
+          }
+          if (config["number_of_forecasts"] !== undefined && config["number_of_daily_forecasts"] === undefined) {
+            upgradedConfig["number_of_daily_forecasts"] = config["number_of_forecasts"];
+          }
+        }
+        else {
+          if (config["forecast"] !== undefined && config["hourly_forecast"] === undefined) {
+            upgradedConfig["daily_forecast"] = "false";
+            upgradedConfig["hourly_forecast"] = config["forecast"];
+          }
+          if (config["number_of_forecasts"] !== undefined && config["number_of_hourly_forecasts"] === undefined) {
+            upgradedConfig["number_of_hourly_forecasts"] = config["number_of_forecasts"];
+          }
+        }
+      }
+    }
+    return upgradedConfig;
+  }
+
   setConfig(config) {
     if (!config.entity) {
       throw new Error("Please define a weather entity");
     }
-    this._config = config;
+    this._config = this.upgradeConfig(config);
   }
 
   shouldUpdate(changedProps) {
@@ -207,6 +246,92 @@ class MeteofranceWeatherCard extends LitElement {
     return option === undefined || option === true;
   }
 
+  _unsubscribeDailyForecastEvents() {
+    if (this._daily_subscribed) {
+      this._daily_subscribed.then((unsub) => unsub());
+      this._daily_subscribed = undefined;
+    }
+  }
+
+  _unsubscribeHourlyForecastEvents() {
+    if (this._hourly_subscribed) {
+      this._hourly_subscribed.then((unsub) => unsub());
+      this._hourly_subscribed = undefined;
+    }
+  }
+
+  async _subscribeDailyForecastEvents() {
+    this._unsubscribeDailyForecastEvents();
+    if (
+      !this.isConnected ||
+      !this.hass ||
+      !this._config ||
+      !this.isSelected(this._config.daily_forecast)
+    ) {
+      return;
+    }
+
+    this._daily_subscribed = this.hass.connection.subscribeMessage(
+      (event) => {
+        this._dailyForecastEvent = event;
+      },
+      {
+        type: "weather/subscribe_forecast",
+        forecast_type: "daily",
+        entity_id: this._config.entity,
+      }
+    );
+  }
+
+  async _subscribeHourlyForecastEvents() {
+    this._unsubscribeHourlyForecastEvents();
+    if (
+      !this.isConnected ||
+      !this.hass ||
+      !this._config ||
+      !this.isSelected(this._config.hourly_forecast)
+    ) {
+      return;
+    }
+
+    this._hourly_subscribed = this.hass.connection.subscribeMessage(
+      (event) => {
+        this._hourlyForecastEvent = event;
+      },
+      {
+        type: "weather/subscribe_forecast",
+        forecast_type: "hourly",
+        entity_id: this._config.entity,
+      }
+    );
+  }
+
+  connectedCallback() {
+    super.connectedCallback();
+    if (this.hasUpdated && this._config && this.hass) {
+      this._subscribeDailyForecastEvents();
+      this._subscribeHourlyForecastEvents();
+    }
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._unsubscribeDailyForecastEvents();
+    this._unsubscribeHourlyForecastEvents();
+  }
+
+  updated(changedProps) {
+    if (!this.hass || !this._config) {
+      return;
+    }
+    if (changedProps.has("_config") || !this._daily_subscribed) {
+      this._subscribeDailyForecastEvents();
+    }
+    if (changedProps.has("_config") || !this._hourly_subscribed) {
+      this._subscribeHourlyForecastEvents();
+    }
+  }
+
   render() {
     if (!this._config || !this.hass) {
       return html``;
@@ -247,8 +372,11 @@ class MeteofranceWeatherCard extends LitElement {
         ${this.isSelected(this._config.one_hour_forecast)
           ? this.renderOneHourForecast()
           : ""}
-        ${this.isSelected(this._config.forecast)
-          ? this.renderForecast(stateObj.attributes.forecast)
+        ${this.isSelected(this._config.hourly_forecast)
+          ? this.renderForecast(this._hourlyForecastEvent, this._config.number_of_hourly_forecasts)
+          : ""}
+        ${this.isSelected(this._config.daily_forecast)
+          ? this.renderForecast(this._dailyForecastEvent, this._config.number_of_daily_forecasts)
           : ""}
       </ha-card>
     `;
@@ -266,7 +394,7 @@ class MeteofranceWeatherCard extends LitElement {
         ></li>
         <li>
           ${this.getPhenomenaText(stateObj.state, this.isNightTime())}
-          ${this._config.name ? html` <div>${this._config.name}</div>` : ""}
+          <div>${this._config.name !== undefined ? this._config.name : ""}</div>
         </li>
         <li>
           ${this.getUnit("temperature") == "°F"
@@ -450,23 +578,23 @@ class MeteofranceWeatherCard extends LitElement {
     </div>`;
   }
 
-  renderForecast(forecast) {
-    if (!forecast || forecast.length === 0) {
+  renderForecast(forecast, number_of_forecasts) {
+    if (!forecast || !forecast.forecast || forecast.forecast.length === 0) {
       return html``;
     }
 
     const lang = this.hass.selectedLanguage || this.hass.language;
-    const isDaily = this.isDailyForecast(forecast);
+    const isDaily = forecast.type === "daily" ;
 
     this.numberElements++;
     return html` <ul
       class="flow-row forecast ${this.numberElements > 1 ? " spacer" : ""}"
     >
-      ${forecast
+      ${forecast.forecast
         .slice(
           0,
-          this._config.number_of_forecasts
-            ? this._config.number_of_forecasts
+          number_of_forecasts
+            ? number_of_forecasts
             : 5
         )
         .map((daily) => this.renderDailyForecast(daily, lang, isDaily))}
@@ -513,7 +641,7 @@ class MeteofranceWeatherCard extends LitElement {
               </li>
             `
           : ""}
-        ${this._config.humidity_forecast &&
+        ${this.isSelected(this._config.humidity_forecast) &&
         daily.humidity !== undefined &&
         daily.humidity !== null
           ? html`
@@ -540,14 +668,14 @@ class MeteofranceWeatherCard extends LitElement {
               </li>
             `
           : ""}
-        ${this._config.wind_forecast_icons && daily.wind_bearing !== undefined && daily.wind_bearing !== null
+        ${this.isSelected(this._config.wind_forecast_icons) && daily.wind_bearing !== undefined && daily.wind_bearing !== null
           ? html`			
 			<li class="icon"
 				style="background: none, url('/local/community/lovelace-meteofrance-weather-card/icons/arrow-north-static.svg'); background-size: contain; transform: rotate(${daily.wind_bearing + 180}deg) scale(0.5)">
 			  </li>
 			  `
            : ""}
-	 ${this._config.wind_forecast_icons && daily.wind_bearing !== undefined && daily.wind_bearing == null
+	 ${this.isSelected(this._config.wind_forecast_icons) && daily.wind_bearing !== undefined && daily.wind_bearing == null
           ? html`			
 			<li class="icon"
 				style="background: none, url('/local/community/lovelace-meteofrance-weather-card/icons/no-wind-bearing-static.svg'); background-size: contain; transform:  scale(0.5)">
@@ -558,12 +686,6 @@ class MeteofranceWeatherCard extends LitElement {
     </li>`;
   }
 
-  isDailyForecast(forecast) {
-    const diff =
-      new Date(forecast[1].datetime) - new Date(forecast[0].datetime);
-    return diff > 3600000;
-  }
-
   isNightTime(datetimehourly) {
     const sun = this.hass.states["sun.sun"];
     if (!sun) {
diff --git a/info.md b/info.md
index 47c2aa74..19bd3c29 100644
--- a/info.md
+++ b/info.md
@@ -23,12 +23,12 @@ Les informations affichées :
 - informations météorologiques détaillées,
 - pluviométrie dans l'heure (prévisions à 5 puis 10 minutes),
 - alertes météos en cours (inondations, vents violents, etc) en rapport à votre département,
-- prévisions météo quotidienne de 1 à 15 jours maximum (réglable) ou des prévisions horaires de 1 à x heures (réglable),
+- prévisions météo quotidiennes de 1 à 15 jours maximum (réglable) et des prévisions horaires de 1 à x heures (réglable),
 - sélection des informations à afficher pour personnaliser votre carte.
 
 Un exemple de rendu :
 
-![Weather Card](https://github.com/hacf-fr/lovelace-meteofrance-weather-card/blob/Meteo-France/meteofrance-weather-card.png)
+![Weather Card](meteofrance-weather-card.png)
 
 ## Installation
 
@@ -40,15 +40,18 @@ Cette carte est prévue pour utiliser les entités de l'intégration [Météo Fr
 
 #### Installation de la carte
 
-1. Depuis [HACS](https://hacs.xyz/) (Home Assistant Community Store), ouvrez le menu en haut à droite et utiliser l'option `Custom repositories` pour ajouter le dépôt de la carte.
+[![Open your Home Assistant instance and open a repository inside the Home Assistant Community Store.](https://my.home-assistant.io/badges/hacs_repository.svg)](https://my.home-assistant.io/redirect/hacs_repository/?owner=hacf-fr&repository=lovelace-meteofrance-weather-card&category=lovelace)
+Si le lien a fonctionné, passez directement à l'étape 3. Sinon, procédez comme suit :
 
-2. Ajoutez l'adresse <https://github.com/hacf-fr/lovelace-meteofrance-weather-card> avec pour catégorie `Lovelace`, et faire `ADD`. Le dépôt de la carte apparaît dans la liste.
+1. Depuis [HACS](https://hacs.xyz/) (Home Assistant Community Store), sélectionner `Frontend`. Puis ouvrez le menu en haut à droite et utiliser l'option `Dépôts personnalisés` pour ajouter le dépôt de la carte.
 
-3. Sélectionner ce dépôt (cette présentation de la carte va s'afficher dans une fenêtre) et utiliser l'option `INSTALL THIS REPOSITORY` en bas à droite de la fenêtre.
+2. Ajoutez l'adresse <https://github.com/hacf-fr/lovelace-meteofrance-weather-card> avec pour catégorie `Lovelace`, et faire `AJOUTER`. Le dépôt de la carte apparaît dans la liste.
 
-4. Laisser le choix de la dernière version et utiliser l'option `INSTALL` en bas à droite.
+3. La carte de ce `nouveau dépôt` va s'afficher, cliquez sur `INSTALLER`.
 
-5. Faire `RELOAD` pour terminer! La carte est maintenant prête à être utiliser dans votre tableau de bord.
+4. Laisser le choix de la dernière version et utiliser l'option `INSTALLER` en bas à droite.
+
+5. Faire `RECHARGER LA PAGE` pour terminer! La carte est maintenant prête à être utiliser dans votre tableau de bord.
 
 #### Configuration
 
@@ -56,21 +59,17 @@ Vous trouverez la carte dans la liste des cartes personnalisées (en fin de list
 
 Une fois choisi, sa configuration est la suivante :
 
-1. **Définir un nom** pour la carte (généralement la ville, comme pour l'intégration).
-
-2. **Sélectionner l'entité météo** que vous avez définit avec l'intégration (par défaut la carte en choisit une mais ce n'est pas forcément l'entité météo france que vous avez configuré).
-
-3. Toutes les autres entités **sont automatiquement définies** mais vous pouvez les redéfinir ou les supprimer à votre guise.
+1. **Sélectionner l'entité météo** que vous avez défini avec l'intégration (par défaut la carte en choisit une mais ce n'est pas forcément l'entité météo france que vous avez configuré).
 
-4. Seule l'entité pour **les alertes est à préciser manuellement**.
+2. Toutes les autres entités **sont automatiquement définies** mais vous pouvez les redéfinir ou les supprimer à votre guise.
 
-5. **Sélectionner les parties** de la carte **à afficher** (vous pouvez ainsi avoir plusieurs cartes avec des affichages différents).
+3. **Sélectionner les éléments** de la carte **à afficher** (vous pouvez ainsi avoir plusieurs cartes avec des affichages différents).
 
-6. **Préciser le nombre de jours de prévision** à afficher en bas de carte.
+4. **Préciser les nombres d'heures et de jours de prévision** à afficher.
 
-7. `Enregistrer` votre configuration.
+5. `Enregistrer` votre configuration.
 
-![Weather Card Configuration](https://github.com/hacf-fr/lovelace-meteofrance-weather-card/blob/Meteo-France/meteofrance-weather-card-editor.png)
+![Weather Card Configuration](meteofrance-weather-card-editor.png)
 
 ### Installation manuelle (utilisateurs avancés)
 
@@ -114,23 +113,54 @@ Ci-dessous les éléments de configuration avec pour exemple l'usage d'une inté
 view:
     cards:
     - type: "custom:meteofrance-weather-card"
-        name: Nantes # nom de la carte, peut être différent du nom de l'intégration
-        entity: weather.nantes # Entité météo principale
-        # Les entités annexes de météo france
-        cloudCoverEntity: sensor.nantes_cloud_cover
-        rainChanceEntity: sensor.nantes_rain_chance
-        freezeChanceEntity: sensor.nantes_freeze_chance
-        snowChanceEntity: sensor.nantes_snow_chance
-        uvEntity: sensor.nantes_uv
-        rainForecastEntity: sensor.nantes_next_rain
-        alertEntity: sensor.44_weather_alert
-        number_of_forecasts: "5"
-        # Les switches pour afficher ou non les différentes zones.
-        current: true
-        details: true
-        one_hour_forecast: true
-        alert_forecast: true
-        forecast: true
+      entity: weather.nantes # Entité météo principale
+      name: Nantes # nom de la carte, peut être différent du nom de l'intégration
+      # Les switches pour afficher ou non les différentes zones.
+      current: true
+      details: true
+      alert_forecast: true
+      one_hour_forecast: true
+      daily_forecast: true
+      hourly_forecast: true
+      humidity_forecast: true
+      wind_forecast_icons: true
+      animated_icons: true
+      # Les curseurs
+      number_of_hourly_forecasts: "5"
+      number_of_daily_forecasts: "5"
+      # Les entités annexes de météo france
+      detailEntity: sensor.nantes_daily_precipitation
+      cloudCoverEntity: sensor.nantes_cloud_cover
+      rainChanceEntity: sensor.nantes_rain_chance
+      freezeChanceEntity: sensor.nantes_freeze_chance
+      snowChanceEntity: sensor.nantes_snow_chance
+      uvEntity: sensor.nantes_uv
+      rainForecastEntity: sensor.nantes_next_rain
+      alertEntity: sensor.44_weather_alert
+      # Chemin
+      icons: /local/community/lovelace-meteofrance-weather-card/icons/
+```
+
+#### options avancées via YAML
+
+Ci-dessous les éléments de configuration pour masquer certains champs:
+
+Pour masquer les précipitations :
+```yaml
+hide_precipitation: true
+```
+
+Pour masquer certaines alertes:
+```yaml
+hide_alertVentViolent: true
+hide_alertPluieInondation: true
+hide_alertOrages: true
+hide_alertInondation: true
+hide_alertNeigeVerglas: true
+hide_alertCanicule: true
+hide_alertGrandFroid: true
+hide_alertAvalanches: true
+hide_alertVaguesSubmersion: true
 ```
 
 ## Crédits
@@ -141,6 +171,8 @@ Projet réalisé par la communauté de HACF et depuis les projets suivants :
 
 - les améliorations spécifiques à Météo France de la carte [Lovelace animated weather card](https://github.com/Imbuzi/meteo-france-weather-card) de [Nicolas Bourasseau](https://github.com/Imbuzi).
 
+Les icônes animés sont issus du site [amChart](https://www.amcharts.com/free-animated-svg-weather-icons/) et sous licence [CC by 4.0](https://creativecommons.org/licenses/by/4.0/).
+
 ## FAQ
 
 - **Question** : La prévision de pluie dans l'heure ne semble pas fonctionner, les cases sont toujours de la même couleur bien que le temps est changeant et pluvieux.
diff --git a/meteofrance-weather-card-editor.png b/meteofrance-weather-card-editor.png
index ddffb20a..14f069b5 100644
Binary files a/meteofrance-weather-card-editor.png and b/meteofrance-weather-card-editor.png differ
diff --git a/meteofrance-weather-card.png b/meteofrance-weather-card.png
index 5573798d..add59eaf 100644
Binary files a/meteofrance-weather-card.png and b/meteofrance-weather-card.png differ