diff --git a/src/components/ha-cards.html b/src/components/ha-cards.html
index 298a29bcb6..a86732387b 100644
--- a/src/components/ha-cards.html
+++ b/src/components/ha-cards.html
@@ -164,7 +164,7 @@
           value: false,
         },
 
-        orderedGroups: Array,
+        orderedGroupEntities: Array,
 
         cards: Object,
       };
@@ -172,7 +172,7 @@
 
     static get observers() {
       return [
-        'updateCards(columns, states, panelVisible, viewVisible, orderedGroups)',
+        'updateCards(columns, states, panelVisible, viewVisible, orderedGroupEntities)',
       ];
     }
 
@@ -181,7 +181,7 @@
       states,
       panelVisible,
       viewVisible,
-      orderedGroups
+      orderedGroupEntities
     ) {
       if (!panelVisible || !viewVisible) {
         if (this.$.main.parentNode) {
@@ -198,7 +198,7 @@
         () => {
           // Things might have changed since it got scheduled.
           if (this.panelVisible && this.viewVisible) {
-            this.cards = this.computeCards(columns, states, orderedGroups);
+            this.cards = this.computeCards(columns, states, orderedGroupEntities);
           }
         }
       );
@@ -212,7 +212,7 @@
       };
     }
 
-    computeCards(columns, states, orderedGroups) {
+    computeCards(columns, states, orderedGroupEntities) {
       const hass = this.hass;
 
       const cards = this.emptyCards();
@@ -285,9 +285,9 @@
       }
 
       const splitted = window.HAWS.splitByGroups(states);
-      if (orderedGroups) {
-        splitted.groups.sort((gr1, gr2) => orderedGroups[gr1.entity_id] -
-          orderedGroups[gr2.entity_id]);
+      if (orderedGroupEntities) {
+        splitted.groups.sort((gr1, gr2) => orderedGroupEntities[gr1.entity_id] -
+          orderedGroupEntities[gr2.entity_id]);
       } else {
         splitted.groups.sort((gr1, gr2) => gr1.attributes.order - gr2.attributes.order);
       }
@@ -327,9 +327,20 @@
         coll[domain].states.push(state);
       });
 
-      iterateDomainSorted(badgesColl, (domain) => {
-        cards.badges.push.apply(cards.badges, domain.states);
-      });
+      if (orderedGroupEntities) {
+        Object.keys(badgesColl)
+          .map(key => badgesColl[key])
+          .forEach((domain) => {
+            cards.badges.push.apply(cards.badges, domain.states);
+          });
+
+        cards.badges.sort((e1, e2) => orderedGroupEntities[e1.entity_id] -
+          orderedGroupEntities[e2.entity_id]);
+      } else {
+        iterateDomainSorted(badgesColl, (domain) => {
+          cards.badges.push.apply(cards.badges, domain.states);
+        });
+      }
 
       iterateDomainSorted(beforeGroupColl, (domain) => {
         addEntitiesCard(domain.domain, domain.states);
diff --git a/src/layouts/partial-cards.html b/src/layouts/partial-cards.html
index 010f8a065f..19ada8afcb 100644
--- a/src/layouts/partial-cards.html
+++ b/src/layouts/partial-cards.html
@@ -113,7 +113,7 @@
           columns='[[_columns]]'
           hass='[[hass]]'
           panel-visible='[[panelVisible]]'
-          ordered-groups='[[orderedGroups]]'
+          ordered-group-entities='[[orderedGroupEntities]]'
         ></ha-cards>
 
         <template is='dom-repeat' items='[[views]]'>
@@ -123,7 +123,7 @@
             columns='[[_columns]]'
             hass='[[hass]]'
             panel-visible='[[panelVisible]]'
-            ordered-groups='[[orderedGroups]]'
+            ordered-group-entities='[[orderedGroupEntities]]'
           ></ha-cards>
         </template>
 
@@ -198,9 +198,9 @@
           computed: 'computeViewStates(currentView, hass, defaultView)',
         },
 
-        orderedGroups: {
+        orderedGroupEntities: {
           type: Array,
-          computed: 'computeOrderedGroups(currentView, hass, defaultView)',
+          computed: 'computeOrderedGroupEntities(currentView, hass, defaultView)',
         },
 
         showTabs: {
@@ -372,19 +372,19 @@
     /*
       Compute the ordered list of groups for this view
     */
-    computeOrderedGroups(currentView, hass, defaultView) {
+    computeOrderedGroupEntities(currentView, hass, defaultView) {
       if (!this.isView(currentView, defaultView)) {
         return null;
       }
 
-      var orderedGroups = {};
+      var orderedGroupEntities = {};
       var entitiesList = hass.states[currentView || DEFAULT_VIEW_ENTITY_ID].attributes.entity_id;
 
       for (var i = 0; i < entitiesList.length; i++) {
-        orderedGroups[entitiesList[i]] = i;
+        orderedGroupEntities[entitiesList[i]] = i;
       }
 
-      return orderedGroups;
+      return orderedGroupEntities;
     }
   }