diff --git a/app/assets/images/menu/icn-cart.svg b/app/assets/images/menu/icn-cart.svg
new file mode 100755
index 0000000000..3f5fe008e3
--- /dev/null
+++ b/app/assets/images/menu/icn-cart.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="18" viewBox="0 0 20 18">
+    <path fill="#FFF" fill-opacity=".5" fill-rule="nonzero" d="M18.338 10.593l1.64-7.312a.841.841 0 0 0-.812-1.031H5.528L5.21.675A.836.836 0 0 0 4.393 0H.833A.839.839 0 0 0 0 .844v.562c0 .466.373.844.833.844H3.26l2.439 12.074c-.584.34-.977.977-.977 1.707 0 1.088.87 1.969 1.945 1.969 1.074 0 1.944-.881 1.944-1.969 0-.55-.224-1.049-.584-1.406h7.28c-.36.357-.585.855-.585 1.406 0 1.088.87 1.969 1.945 1.969 1.074 0 1.944-.881 1.944-1.969 0-.78-.447-1.453-1.096-1.772l.191-.853a.841.841 0 0 0-.812-1.031h-9.32l-.228-1.125h10.179c.389 0 .726-.273.813-.657z"/>
+</svg>
diff --git a/app/views/shared/menu/_cart.html.haml b/app/views/shared/menu/_cart.html.haml
index 63a5224c90..865ceb4074 100644
--- a/app/views/shared/menu/_cart.html.haml
+++ b/app/views/shared/menu/_cart.html.haml
@@ -1,71 +1,10 @@
 %span.cart-span{"ng-controller" => "CartCtrl", "ng-class" => "{ dirty: Cart.dirty || Cart.empty(), 'pure-dirty': Cart.dirty }"}
   %a#cart.icon{cart: true}
-    %span.nav-branded
-      %i.ofn-i_027-shopping-cart
+    %span
+      = t '.cart'
+    %span.count
+      %img{ src: "/assets/menu/icn-cart.svg" }
       %span
         {{ Cart.total_item_count() }}
-        = t 'cart_items'
 
-  .joyride-tip-guide{"ng-class" => "{ in: open }", "ng-show" => "open"}
-    %span.joyride-nub.top
-    .joyride-content-wrapper
-      %h5
-        = t 'cart_headline'
-      .buttons.text-right
-        %a.button.secondary.tiny.add_to_cart{ href: cart_path, type: :submit, "ng-disabled" => "Cart.dirty || Cart.empty()", "ng-class" => "{ dirty: Cart.dirty }" }
-          = "{{ Cart.dirty ? '#{t(:cart_updating)}' : (Cart.empty() ? '#{t(:cart_empty)}' : '#{t(:cart_edit)}' ) }}"
-        %a.button.primary.tiny{href: checkout_path, "ng-disabled" => "Cart.dirty || Cart.empty()"}
-          = t '.checkout'
-      %table
-        %tr.product-cart{"ng-repeat" => "line_item in Cart.line_items", "id" => "cart-variant-{{ line_item.variant.id }}"}
-          %td
-            %small
-              %strong
-                {{ line_item.variant.extended_name }}
-          %td.text-right
-            %small
-              %span.quantity {{ line_item.quantity }}
-              %i.ofn-i_009-close
-              %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
-
-          %td
-            %small
-              \=
-              %strong
-                .total-price.right {{ line_item.total_price | localizeCurrency }}
-
-      %table{"ng-show" => "Cart.line_items.length > 0"}
-        %tr.total-cart
-          %td
-            %em
-              = t 'total'
-              \:
-          %td.text-right
-            %strong {{ Cart.total()  | localizeCurrency }}
-
-      .buttons.text-right
-        %a.button.secondary.tiny.add_to_cart{ href: cart_path, type: :submit, "ng-disabled" => "Cart.dirty || Cart.empty()", "ng-class" => "{ dirty: Cart.dirty }" }
-          = "{{ Cart.dirty ? '#{t(:cart_updating)}' : (Cart.empty() ? '#{t(:cart_empty)}' : '#{t(:cart_edit)}' ) }}"
-        %a.button.primary.tiny{href: checkout_path, "ng-disabled" => "Cart.dirty || Cart.empty()"}
-          = t '.checkout'
-      - if order_changes_allowed?
-        %h5{"ng-if" => "Cart.line_items_finalised.length", style: 'margin-top: 1em'}
-          = t '.already_ordered_products'
-        %table
-          %tr.product-cart{"ng-repeat" => "line_item in Cart.line_items_finalised",
-          "id" => "cart-variant-{{ line_item.variant.id }}"}
-            %td
-              %small
-                %strong
-                  {{ line_item.variant.extended_name }}
-            %td.text-right
-              %small
-                %span.quantity {{ line_item.quantity }}
-                %i.ofn-i_009-close
-                %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
-
-            %td
-              %small
-                \=
-                %strong
-                  .total-price.right {{ line_item.total_price | localizeCurrency }}
+  = render 'shared/menu/joyride'
diff --git a/app/views/shared/menu/_joyride.html.haml b/app/views/shared/menu/_joyride.html.haml
new file mode 100644
index 0000000000..7c819191e3
--- /dev/null
+++ b/app/views/shared/menu/_joyride.html.haml
@@ -0,0 +1,63 @@
+.joyride-tip-guide{"ng-class" => "{ in: open }", "ng-show" => "open"}
+  %span.joyride-nub.top
+  .joyride-content-wrapper
+    %h5
+      = t 'cart_headline'
+    .buttons.text-right
+      %a.button.secondary.tiny.add_to_cart{ href: cart_path, type: :submit, "ng-disabled" => "Cart.dirty || Cart.empty()", "ng-class" => "{ dirty: Cart.dirty }" }
+        = "{{ Cart.dirty ? '#{t(:cart_updating)}' : (Cart.empty() ? '#{t(:cart_empty)}' : '#{t(:cart_edit)}' ) }}"
+      %a.button.primary.tiny{href: checkout_path, "ng-disabled" => "Cart.dirty || Cart.empty()"}
+        = t '.checkout'
+    %table
+      %tr.product-cart{"ng-repeat" => "line_item in Cart.line_items", "id" => "cart-variant-{{ line_item.variant.id }}"}
+        %td
+          %small
+            %strong
+              {{ line_item.variant.extended_name }}
+        %td.text-right
+          %small
+            %span.quantity {{ line_item.quantity }}
+            %i.ofn-i_009-close
+            %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
+
+        %td
+          %small
+            \=
+            %strong
+              .total-price.right {{ line_item.total_price | localizeCurrency }}
+
+    %table{"ng-show" => "Cart.line_items.length > 0"}
+      %tr.total-cart
+        %td
+          %em
+            = t 'total'
+            \:
+        %td.text-right
+          %strong {{ Cart.total()  | localizeCurrency }}
+
+    .buttons.text-right
+      %a.button.secondary.tiny.add_to_cart{ href: cart_path, type: :submit, "ng-disabled" => "Cart.dirty || Cart.empty()", "ng-class" => "{ dirty: Cart.dirty }" }
+        = "{{ Cart.dirty ? '#{t(:cart_updating)}' : (Cart.empty() ? '#{t(:cart_empty)}' : '#{t(:cart_edit)}' ) }}"
+      %a.button.primary.tiny{href: checkout_path, "ng-disabled" => "Cart.dirty || Cart.empty()"}
+        = t '.checkout'
+    - if order_changes_allowed?
+      %h5{"ng-if" => "Cart.line_items_finalised.length", style: 'margin-top: 1em'}
+        = t '.already_ordered_products'
+      %table
+        %tr.product-cart{"ng-repeat" => "line_item in Cart.line_items_finalised",
+        "id" => "cart-variant-{{ line_item.variant.id }}"}
+          %td
+            %small
+              %strong
+                {{ line_item.variant.extended_name }}
+          %td.text-right
+            %small
+              %span.quantity {{ line_item.quantity }}
+              %i.ofn-i_009-close
+              %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
+
+          %td
+            %small
+              \=
+              %strong
+                .total-price.right {{ line_item.total_price | localizeCurrency }}
\ No newline at end of file