diff --git a/addons/website/models/ir_qweb.py b/addons/website/models/ir_qweb.py
index 6e33742803d..00b63e88f63 100644
--- a/addons/website/models/ir_qweb.py
+++ b/addons/website/models/ir_qweb.py
@@ -227,7 +227,7 @@ class Image(orm.AbstractModel):
         url = element.find('img').get('src')
 
         url_object = urlparse.urlsplit(url)
-        query = urlparse.parse_qs(url_object.query)
+        query = dict(urlparse.parse_qsl(url_object.query))
         if url_object.path == '/website/image' and query['model'] == 'ir.attachment':
             attachment = self.pool['ir.attachment'].browse(
                 cr, uid, int(query['id']), context=context)
diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css
index 68e40e9118b..f10cb6f52e0 100644
--- a/addons/website/static/src/css/website.css
+++ b/addons/website/static/src/css/website.css
@@ -1,3 +1,4 @@
+@charset "utf-8";
 /*       THIS CSS FILE IS FOR WEBSITE THEMING CUSTOMIZATION ONLY
  *
  * css for editor buttons, openerp widget included in the website and other
@@ -434,7 +435,6 @@ ul.nav-stacked > li > a {
 .oe_dark {
   background: #eff8f8;
   background: rgba(100, 200, 200, 0.14);
-  background-image: none !important;
   -webkit-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
   -moz-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
   box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
@@ -442,20 +442,17 @@ ul.nav-stacked > li > a {
 
 .oe_black {
   background-color: rgba(0, 0, 0, 0.9);
-  background-image: none !important;
 }
 
 .oe_green {
   background-color: rgba(0, 128, 0, 0.8);
-  background-image: none !important;
 }
 
 .oe_red {
   background-color: rgba(255, 0, 0, 0.8);
-  background-image: none !important;
 }
 
-.oe_custom_bg {
+.oe_img_bg {
   height: 100%;
   background-size: 100%;
 }
diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass
index ec992256d6e..932f46a1912 100644
--- a/addons/website/static/src/css/website.sass
+++ b/addons/website/static/src/css/website.sass
@@ -328,17 +328,13 @@ ul.nav-stacked > li > a
 .oe_dark
     background: #eff8f8
     background: rgba(100, 200, 200, 0.14)
-    background-image: none !important
     +box-shadow(0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset)
 .oe_black
     background-color: rgba(0, 0, 0, 0.9)
-    background-image: none !important
 .oe_green
     background-color: rgba(0, 128, 0, 0.8)
-    background-image: none !important
 .oe_red
     background-color: rgba(255, 0, 0, 0.8)
-    background-image: none !important
-.oe_custom_bg
+.oe_img_bg
     height: 100%
-    background-size: 100%
+    background-size: 100%
\ No newline at end of file
diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js
index feb8e403c54..e8544221b00 100644
--- a/addons/website/static/src/js/website.editor.js
+++ b/addons/website/static/src/js/website.editor.js
@@ -30,8 +30,8 @@
     function link_dialog(editor) {
         return new website.editor.RTELinkDialog(editor).appendTo(document.body);
     }
-    function image_dialog(editor) {
-        return new website.editor.RTEImageDialog(editor).appendTo(document.body);
+    function image_dialog(editor, image) {
+        return new website.editor.RTEImageDialog(editor, image).appendTo(document.body);
     }
 
     // only enable editors manually
@@ -53,7 +53,7 @@
                             && !element.data('cke-realelement')
                             && !element.isReadOnly()
                             && (element.data('oe-model') !== 'ir.ui.view')) {
-                        image_dialog(editor);
+                        image_dialog(editor, element);
                         return;
                     }
 
@@ -69,13 +69,9 @@
                 }, null, null, 500);
 
                 var previousSelection;
-                editor.on('selectionChange', function (evt) {
-                    var selected = evt.data.path.lastElement;
-                    if (previousSelection) {
-                        // cleanup previous selection
-                        $(previousSelection).next().remove();
-                        previousSelection = null;
-                    }
+                $(editor.element.$).on('mouseenter', 'img', function () {
+                    if (previousSelection) { return; }
+                    var selected = new CKEDITOR.dom.element(this);
                     if (!selected.is('img')
                             || selected.data('cke-realelement')
                             || selected.isReadOnly()
@@ -84,13 +80,13 @@
                     }
 
                     // display button
-                    var $el = $(previousSelection = selected.$);
+                    var $el = $((previousSelection = selected).$);
                     var $btn = $('<button type="button" class="btn btn-primary image-edit-button" contenteditable="false">Edit</button>')
                         .insertAfter($el)
                         .click(function (e) {
                             e.preventDefault();
                             e.stopPropagation();
-                            image_dialog(editor);
+                            image_dialog(editor, selected);
                         });
 
                     var position = $el.position();
@@ -99,6 +95,14 @@
                         top: $el.height() / 2 + position.top - $btn.outerHeight() / 2,
                         left: $el.width() / 2 + position.left - $btn.outerWidth() / 2,
                     });
+                }).on('mouseleave', 'img', function (e) {
+                    var $button = $(previousSelection.$).next('button');
+                    $button.css('visibility', 'hidden');
+                    var el = document.elementFromPoint(e.clientX, e.clientY);
+                    $button.css('visibility', '');
+                    if (el === this) { return; }
+                    $button.remove();
+                    previousSelection = null;
                 });
                 editor.on('destroy', function (evt) {
                     if (previousSelection) {
@@ -1182,26 +1186,30 @@
         },
     });
     website.editor.RTEImageDialog = website.editor.ImageDialog.extend({
-        init: function () {
-            this._super.apply(this, arguments);
+        init: function (editor, image) {
+            this._super(editor);
+
+            this.element = image;
 
             this.on('start', this, this.proxy('started'));
             this.on('save', this, this.proxy('saved'));
         },
         started: function (holder) {
-            var selection = this.editor.getSelection();
-            var el = selection && selection.getSelectedElement();
-            this.element = null;
-
-            if (el && el.is('img')) {
-                this.element = el;
-                _(this.image_styles).each(function (style) {
-                    if (el.hasClass(style)) {
-                        holder.style = style;
-                    }
-                });
-                holder.url = el.getAttribute('src');
+            if (!this.element) {
+                var selection = this.editor.getSelection();
+                this.element = selection && selection.getSelectedElement();
             }
+
+            var el = this.element;
+            if (!el || !el.is('img')) {
+                return;
+            }
+            _(this.image_styles).each(function (style) {
+                if (el.hasClass(style)) {
+                    holder.style = style;
+                }
+            });
+            holder.url = el.getAttribute('src');
         },
         saved: function (data) {
             var element, editor = this.editor;
diff --git a/addons/website/static/src/js/website.snippets.animation.js b/addons/website/static/src/js/website.snippets.animation.js
index 7277f80ba95..34edfe9d259 100644
--- a/addons/website/static/src/js/website.snippets.animation.js
+++ b/addons/website/static/src/js/website.snippets.animation.js
@@ -82,7 +82,7 @@
             var self = this;
             var speed = parseFloat(self.$target.attr("data-scroll-background-ratio") || 0);
 
-            if (speed == 1) {
+            if (speed === 1 || this.$target.css("background-image") === "none") {
                 this.$target.css("background-attachment", "fixed").css("background-position", "0px 0px");
                 return;
             } else {
@@ -101,7 +101,7 @@
                 } else {
                     offset = - self.$target.offset().top * speed;
                 }
-                self.$target.attr("data-scroll-background-offset", offset);
+                self.$target.attr("data-scroll-background-offset", offset > 0 ? 0 : offset);
                 $(window).scroll();
             };
             img.src = this.$target.css("background-image").replace(/url\(['"]*|['"]*\)/g, "");
diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js
index 7d7aade081f..a4f51c6ab39 100644
--- a/addons/website/static/src/js/website.snippets.editor.js
+++ b/addons/website/static/src/js/website.snippets.editor.js
@@ -77,6 +77,7 @@
         hack_to_add_snippet_id();
     });
 
+    website.snippet.styles = {};
     website.snippet.selector = [];
     website.snippet.BuildingBlock = openerp.Widget.extend({
         template: 'website.snippets',
@@ -138,22 +139,19 @@
         },
         fetch_snippet_templates: function () {
             var self = this;
-            this.style_templates = {};
 
             openerp.jsonRpc("/website/snippets", 'call', {})
                 .then(function (html) {
                     var $html = $(html);
 
-                    var $styles = $html.find("#snippet_styles");
-                    $styles.find("> [data-snippet-id]").each(function () {
+                    var $styles = $html.find("[data-snippet-style-id]");
+                    $styles.each(function () {
                         var $style = $(this);
-                        var snipped_id = $style.data('snippet-id');
-                        self.style_templates[snipped_id] = {
-                            'snipped-id' : snipped_id,
+                        var style_id = $style.data('snippet-style-id');
+                        website.snippet.styles[style_id] = {
+                            'snippet-style-id' : style_id,
                             'selector': $style.data('selector'),
-                            'class': $style.data("class"),
-                            'label': $style.find(".oe_snippet_label").text(),
-                            'group': $style.find(".oe_snippet_group").text()
+                            '$el': $style,
                         };
                     });
                     $styles.addClass("hidden");
@@ -529,13 +527,212 @@
     });
 
 
+    website.snippet.styleRegistry = {};
+    website.snippet.StyleEditor = openerp.Class.extend({
+        // initialisation (don't overwrite)
+        init: function (parent, $target, snippet_id) {
+            this.parent = parent;
+            this.$target = $target;
+            var styles = this.$target.data("snippet-style-ids") || {};
+            styles[snippet_id] = this;
+            this.$target.data("snippet-style-ids", styles);
+            this.$overlay = this.$target.data('overlay');
+            this['snippet-style-id'] = snippet_id;
+            this.$el = website.snippet.styles[snippet_id].$el.find(">li").clone();
+
+            this.required = this.$el.data("required");
+
+            this.set_active();
+            this.$el.find('li[data-class] a').on('mouseover mouseout click', _.bind(this._mouse, this));
+            this.$target.on('snippet-style-reset', _.bind(this.set_active, this));
+
+            this.start();
+        },
+        _mouse: function (event) {
+            var self = this;
+
+            if (event.type === 'mouseout') {
+                if (!this.over) return;
+                this.over = false;
+            } else if (event.type === 'click') {
+                this.over = false;
+            }else {
+                this.over = true;
+            }
+
+            var $prev, $next;
+            if (event.type === 'mouseout') {
+                $prev = $(event.currentTarget).parent();
+                $next = this.$el.find("li[data-class].active");
+            } else {
+                $prev = this.$el.find("li[data-class].active");
+                $next = $(event.currentTarget).parent();
+            }
+            if (!$prev.length) {
+                $prev = false;
+            }
+            if ($prev && $prev[0] === $next[0]) {
+                $next = false;
+                if (this.required) {
+                    return;
+                }
+            }
+
+            var np = {'$next': $next, '$prev': $prev};
+
+            if (event.type === 'click') {
+                setTimeout(function () {
+                    self.set_active();
+                    self.$target.trigger("snippet-style-change", [self, np]);
+                },0);
+                this.select(event, {'$next': $next, '$prev': $prev});
+            } else {
+                setTimeout(function () {
+                    self.$target.trigger("snippet-style-preview", [self, np]);
+                },0);
+                this.preview(event, np);
+            }
+        },
+        // start is call just after the init
+        start: function () {
+        },
+        /* select
+        *  called when a user select an item
+        *  variables: np = {$next, $prev}
+        *       $next is false if they are no next item selected
+        *       $prev is false if they are no previous item selected
+        */
+        select: function (event, np) {
+            var self = this;
+            // add or remove html class
+            if (np.$prev) {
+                this.$target.removeClass(np.$prev.data('class' || ""));
+            }
+            if (np.$next) {
+                this.$target.addClass(np.$next.data('class') || "");
+            }
+        },
+        /* preview
+        *  called when a user is on mouse over or mouse out of an item
+        *  variables: np = {$next, $prev}
+        *       $next is false if they are no next item selected
+        *       $prev is false if they are no previous item selected
+        */
+        preview: function (event, np) {
+            var self = this;
+
+            // add or remove html class
+            if (np.$prev) {
+                this.$target.removeClass(np.$prev.data('class') || "");
+            }
+            if (np.$next) {
+                this.$target.addClass(np.$next.data('class') || "");
+            }
+        },
+        /* set_active
+        *  select and set item active or not (add highlight item and his parents)
+        *  called before start
+        */
+        set_active: function () {
+            var self = this;
+            this.$el.find('li').removeClass("active");
+            var $active = this.$el.find('li[data-class]')
+                .filter(function () {
+                    var $li = $(this);
+                    return  ($li.data('class') && self.$target.hasClass($li.data('class')));
+                })
+                .first()
+                .addClass("active");
+            this.$el.find('li:has(li[data-class].active)').addClass("active");
+        }
+    });
+
+
+    website.snippet.styleRegistry['size'] = website.snippet.StyleEditor.extend({
+        select: function(event, np) {
+            this._super(event, np);
+            this.parent.parent.cover_target(this.$overlay, this.$target);
+        },
+        preview: function (event, np) {
+            this._super(event, np);
+            this.parent.parent.cover_target(this.$overlay, this.$target);
+        }
+    });
+
+    website.snippet.styleRegistry.background = website.snippet.StyleEditor.extend({
+        _get_bg: function () {
+            return this.$target.css("background-image").replace(/url\(['"]*|['"]*\)|^none$/g, "");
+        },
+        _set_bg: function (src) {
+            this.$target.css("background-image", src && src !== "" ? 'url(' + src + ')' : "");
+        },
+        start: function () {
+            this._super();
+            var src = this._get_bg();
+            this.$el.find("li[data-class].active.oe_custom_bg").data("src", src);
+        },
+        select: function(event, np) {
+            var self = this;
+            this._super(event, np);
+            if (np.$next) {
+                if (np.$next.hasClass("oe_custom_bg")) {
+                    var editor = new website.editor.ImageDialog();
+                    editor.on('start', self, function (o) {o.url = np.$prev && np.$prev.data("src") || "";});
+                    editor.on('save', self, function (o) {
+                        self._set_bg(o.url);
+                        np.$next.data("src", o.url);
+                        self.$target.trigger("snippet-style-change", [self, np]);
+                    });
+                    editor.on('cancel', self, function () {
+                        if (!np.$prev || np.$prev.data("src") === "") {
+                            np.$next.removeClass('active');
+                            self.$target.removeClass(np.$next.data("class"));
+                            self.$target.trigger("snippet-style-change", [self, np]);
+                        }
+                    });
+                    editor.appendTo($('body'));
+                } else {
+                    this._set_bg(np.$next.data("src"));
+                }
+            } else {
+                this._set_bg(false);
+            }
+        },
+        preview: function (event, np) {
+            this._super(event, np);
+            if (np.$next) {
+                this._set_bg(np.$next.data("src"));
+            }
+        },
+        set_active: function () {
+            var self = this;
+            var bg = self.$target.css("background-image");
+            this.$el.find('li').removeClass("active");
+            var $active = this.$el.find('li[data-class]')
+                .filter(function () {
+                    var $li = $(this);
+                    return  ($li.data('src') && bg.indexOf($li.data('src')) >= 0) ||
+                            (!$li.data('src') && self.$target.hasClass($li.data('class')));
+                })
+                .first();
+            if (!$active.length) {
+                $active = this.$target.css("background-image") !== 'none' ?
+                    this.$el.find('li[data-class].oe_custom_bg') :
+                    this.$el.find('li[data-class=""]');
+            }
+            $active.addClass("active");
+            this.$el.find('li:has(li[data-class].active)').addClass("active");
+        }
+    });
+
+
     website.snippet.editorRegistry = {};
     website.snippet.Editor = openerp.Class.extend({
-        init: function (parent, dom, force_snippet_id) {
+        init: function (parent, dom) {
             this.parent = parent;
             this.$target = $(dom);
             this.$overlay = this.$target.data('overlay');
-            this.snippet_id = force_snippet_id || this.$target.data("snippet-id");
+            this.snippet_id = this.$target.data("snippet-id");
             this._readXMLData();
             this.load_style_options();
             this.get_parent_block();
@@ -652,90 +849,21 @@
         },
 
         load_style_options: function () {
-            if (this.$target.data('snippetStyles')) {
-                return;
-            }
-
             var self = this;
             var $styles = this.$overlay.find('.oe_options');
             var $ul = $styles.find('ul:first');
-            _.each(this.parent.style_templates, function (val) {
+            _.each(website.snippet.styles, function (val) {
                 if (!self.parent.dom_filter(val.selector).is(self.$target)) {
                     return;
                 }
-                var $li = $("<li class='oe_style'/>").data(val);
-                $li.append($('<a/>').text(val.label));
-                if (self.$target.hasClass( val.class )) {
-                    $li.addClass("active");
-                }
-
-                if (val.group.length) {
-                    var $group = $ul.find("li.dropdown-submenu").filter(function () {
-                        return $("a:first", this).text() === val.group;
-                    });
-                    if (!$group.length) {
-                        $group = $('<li class="dropdown-submenu"><a href="#" tabindex="-1"/><ul class="dropdown-menu"/></li>');
-                        $group.find("a").text(val.group);
-                        $ul.append($group);
-                    }
-                    $group.find("ul").append($li);
-                } else {
-                    $ul.append($li);
-                }
+                var Editor = website.snippet.styleRegistry[val['snippet-style-id']] || website.snippet.StyleEditor;
+                var editor = new Editor(self, self.$target, val['snippet-style-id']);
+                $ul.prepend(editor.$el);
             });
             
             if ($ul.find("li").length) {
                 $styles.removeClass("hidden");
-                // il they are only one group, display in flat mode
-                var $groups = $ul.find("li.dropdown-submenu");
-                if ($groups.length === 1) {
-                    $ul.append($groups.find("ul li"));
-                    $groups.remove();
-                }
             }
-
-            this.$target.data('snippetStyles', $styles);
-            this.change_style();
-        },
-        change_style: function () {
-            var self = this;
-
-            this.$overlay.find('.oe_options li.oe_style a')
-                .on('click', function (event) {
-                    var $li = $(event.currentTarget).parent();
-                    var active = $li.hasClass("active");
-
-                    if ($li.hasClass("active")) {
-                        self.$target.removeClass($li.data('class'));
-                    } else {
-                        var $prev = $li.parent("ul").find("li.active").removeClass("active");
-                        if ($prev.length) {
-                            self.$target.removeClass($prev.data('class'));
-                            // active snippet after remove class
-                            if (website.snippet.editorRegistry[$prev.data("snipped-id")]) {
-                                new website.snippet.editorRegistry[$prev.data("snipped-id")](self.parent, self.$target, $prev.data("snipped-id"))
-                                    .drop_and_build_snippet(self.$target);
-                            }
-                        }
-                        self.$target.addClass($li.data('class'));
-                    }
-
-                    // active snippet after add or remove class
-                    if (website.snippet.editorRegistry[$li.data("snipped-id")]) {
-                        new website.snippet.editorRegistry[$li.data("snipped-id")](self.parent, self.$target, $li.data("snipped-id"))
-                            .drop_and_build_snippet(self.$target);
-                    }
-                    
-                    $li.toggleClass("active");
-                })
-                .on('mouseover', function (event) {
-                    self.$target.removeClass(self.$overlay.find('.oe_options li.oe_style.active').data('class') || "");
-                    self.$target.addClass($(event.currentTarget).parent().data('class') || "");
-                })
-                .on('mouseout', function (event) {
-                    self.$target.removeClass($(event.currentTarget).parent().data('class') || "");
-                    self.$target.addClass(self.$overlay.find('.oe_options li.oe_style.active').data('class') || "");
-                });
         },
 
         get_parent_block: function () {
@@ -801,59 +929,6 @@
         clean_for_save: function () {
 
         },
-
-        change_background: function (bg, ul_options, callback) {
-            var self = this;
-            this.set_options_background(bg, ul_options);
-            var $ul = this.$editor.find(ul_options);
-            var bg_value = (typeof bg === 'string' ? this.$target.find(bg) : $(bg)).css("background-image").replace(/url\(['"]*|['"]*\)/g, "");
-
-            // bind event on options
-            var $li = $ul.find("li");
-            $li.on('click', function (event) {
-                    if ($(this).data("value")) {
-                        $li.removeClass("active");
-                        $(this).addClass("active");
-                        self.$editor.find('input').val("");
-                    } else {
-                        var editor = new website.editor.ImageDialog();
-                        editor.on('start', self, function (o) {o.url = bg_value;});
-                        editor.on('save', self, function (o) {
-                            var $bg = typeof bg === 'string' ? self.$target.find(bg) : $(bg);
-                            $bg.css("background-image", "url(" + o.url + ")");
-                        });
-                        editor.appendTo($('body'));
-                    }
-                    if (callback) {
-                        callback();
-                    }
-                })
-                .on('mouseover', function (event) {
-                    if ($(this).data("value")) {
-                        var src = $(this).data("value");
-                        var $bg = typeof bg === 'string' ? self.$target.find(bg) : $(bg);
-                        $bg.css("background-image", "url(" + src + ")");
-                    }
-                })
-                .on('mouseout', function (event) {
-                    var src = $ul.find('li.active').data("value");
-                    var $bg = typeof bg === 'string' ? self.$target.find(bg) : $(bg);
-                    $bg.css("background-image", "url(" + src + ")");
-                });
-        },
-
-        set_options_background: function (bg, ul_options) {
-            var $ul = this.$editor.find(ul_options);
-            var bg_value = (typeof bg === 'string' ? this.$target.find(bg) : $(bg)).css("background-image").replace(/url\(['"]*|['"]*\)|^none$/g, "");
-
-            // select in ul options
-            $ul.find("li").removeClass("active");
-            var selected = $ul.find('[data-value="' + bg_value + '"], [data-value="' + bg_value.replace(/.*:\/\/[^\/]+/, '') + '"]');
-            selected.addClass('active');
-            if (!selected.length) {
-                $ul.find('.oe_custom_bg b').html(bg_value);
-            }
-        },
     });
 
 
@@ -1070,11 +1145,15 @@
             if(!this.$target.find(".item.active").length) {
                 this.$target.find(".item:first").addClass("active");
             }
+            this.$target.css("background-image", "");
+            console.log(this._class);
+            this.$target.removeClass(this._class);
             this.$target.removeAttr('contentEditable')
                 .find('.content, .carousel-image img')
                     .removeAttr('contentEditable');
         },
         start : function () {
+            var self = this;
             this._super();
 
             this.id = this.$target.attr("id");
@@ -1085,20 +1164,38 @@
             this.$editor.find(".js_add").on('click', _.bind(this.on_add, this));
             this.$editor.find(".js_remove").on('click', _.bind(this.on_remove, this));
 
-            this.change_background(".item.active", 'ul[name="carousel-background"]');
-            this.change_style();
-            this.change_size();
-            this.set_options_style();
-            this.$target.carousel();
+            this.rebind_event();
+
+            // set background and prepare to clean for save
+            var add_class = function (c){
+                if (c) self._class = (self._class || "").replace(new RegExp("[ ]+" + c.replace(" ", "|[ ]+")), '') + ' ' + c;
+                return self._class || "";
+            };
+            this.$target.on('snippet-style-change snippet-style-preview', function (event, style, np) {
+                var $active = self.$target.find(".item.active");
+                if (style['snippet-style-id'] === "size") return;
+                if (style['snippet-style-id'] === "background") {
+                    $active.css("background-image", self.$target.css("background-image"));
+                }
+                if (np.$prev) {
+                    $active.removeClass(np.$prev.data("class"));
+                }
+                if (np.$next) {
+                    $active.addClass(np.$next.data("class"));
+                    add_class(np.$next.data("class"));
+                }
+            });
+            this.$target.on('slid', function () { // slide.bs.carousel
+                var $active = self.$target.find(".item.active");
+                self.$target
+                    .css("background-image", $active.css("background-image"))
+                    .removeClass(add_class($active.attr("class")))
+                    .addClass($active.attr("class"))
+                    .trigger("snippet-style-reset");
 
-            var self = this;
-            this.$target.on('slide.bs.carousel', function () {
-                self.set_options_style();
-                self.set_options_background(".item.active", 'ul[name="carousel-background"]');
                 self.$target.carousel();
             });
-
-            this.rebind_event();
+            this.$target.trigger('slid');
         },
         // rebind event to active carousel on edit mode
         rebind_event: function () {
@@ -1121,9 +1218,15 @@
             this.$indicators.append('<li data-target="#' + this.id + '" data-slide-to="' + cycle + '"></li>');
 
             var $clone = this.$el.find(".item.active").clone();
-            var avtive_bg = $active.css("background-image").replace(/.*:\/\/[^\/]+|\)$/g, '');
-            var bg = this.$editor.find('ul[name="carousel-background"] li:not([data-value="'+ avtive_bg +'"]):first').data("value");
-            $clone.css("background-image", "url('"+ bg +"')");
+
+            // choose an other background
+            var $styles = this.$target.data("snippet-style-ids").background.$el.find("li[data-class]:not(.oe_custom_bg)");
+            var styles_index = $styles.index($styles.filter(".active")[0]);
+            var $select = $($styles[styles_index >= $styles.length-1 ? 0 : styles_index+1]);
+            $clone.css("background-image", $select.data("src") ? "url('"+ $select.data("src") +"')" : "");
+            $clone.addClass($select.data("class") || "");
+
+            // insert
             $clone.removeClass('active').insertAfter($active);
             this.$target.carousel().carousel(++index);
             this.rebind_event();
@@ -1158,78 +1261,16 @@
                 this.$target.find('.carousel-control, .carousel-indicators').addClass("hidden");
             }
         },
-        set_options_style: function () {
-            var style = false;
-            var $el = this.$inner.find('.item.active');
-            var $ul = this.$editor.find('ul[name="carousel-style"]');
-
-            if ($el.hasClass('text_only'))
-                style = 'text_only';
-            if ($el.hasClass('image_text'))
-                style = 'image_text';
-            if ($el.hasClass('text_image'))
-                style = 'text_image';
-
-            $ul.find('[data-value="' + style + '"]').addClass('active');
-        },
-        change_style: function () {
-            var self = this;
-            var $ul = this.$editor.find('ul[name="carousel-style"]');
-            var $li = $ul.find("li");
-
-            $li.on('click', function (event) {
-                    $li.removeClass("active");
-                    $(this).addClass("active");
-                })
-                .on('mouseover', function (event) {
-                    var $el = self.$inner.find('.item.active');
-                    $el.removeClass('image_text text_image text_only');
-                    $el.addClass($(event.currentTarget).data("value"));
-                })
-                .on('mouseout', function (event) {
-                    var $el = self.$inner.find('.item.active');
-                    $el.removeClass('image_text text_image text_only');
-                    $el.addClass($ul.find('li.active').data("value"));
-                });
-        },
-        change_size: function () {
-            var $el = this.$target;
-
-            var size = 'oe_big';
-            if (this.$target.hasClass('oe_small'))
-                size = 'oe_small';
-            else if (this.$target.hasClass('oe_medium'))
-                size = 'oe_medium';
-
-            var $ul = this.$editor.find('ul[name="carousel-size"]');
-            var $li = $ul.find("li");
-
-            $ul.find('[data-value="' + size + '"]').addClass('active');
-
-            $li.on('click', function (event) {
-                    $li.removeClass("active");
-                    $(this).addClass("active");
-                })
-                .on('mouseover', function (event) {
-                    $el.removeClass('oe_big oe_small oe_medium');
-                    $el.addClass($(event.currentTarget).data("value"));
-                })
-                .on('mouseout', function (event) {
-                    $el.removeClass('oe_big oe_small oe_medium');
-                    $el.addClass($ul.find('li.active').data("value"));
-                });
-        }
     });
 
     website.snippet.editorRegistry.parallax = website.snippet.editorRegistry.resize.extend({
         start : function () {
             var self = this;
             this._super();
-            this.change_background(this.$target, 'ul[name="parallax-background"]', function () {
+            this.scroll();
+            this.$target.on('snippet-style-change snippet-style-preview', function () {
                 self.$target.data("snippet-view").set_values();
             });
-            this.scroll();
-            this.change_size();
         },
         scroll: function () {
             var self = this;
@@ -1252,60 +1293,6 @@
             this.$target.find(".parallax")
                 .css("background-position", '')
                 .removeAttr("data-scroll-background-offset");
-        },
-        change_size: function () {
-            var self = this;
-
-            var size = 'oe_big';
-            if (this.$target.hasClass('oe_small'))
-                size = 'oe_small';
-            else if (this.$target.hasClass('oe_medium'))
-                size = 'oe_medium';
-            var $ul = this.$editor.find('ul[name="parallax-size"]');
-            var $li = $ul.find("li");
-
-            $ul.find('[data-value="' + size + '"]').addClass('active');
-
-            $li.on('click', function (event) {
-                    $li.removeClass("active");
-                    $(this).addClass("active");
-                    self.$target.data("snippet-view").set_values();
-                    return false;
-                })
-                .on('mouseover', function (event) {
-                    self.$target.removeClass('oe_big oe_small oe_medium');
-                    self.$target.addClass($(event.currentTarget).data("value"));
-                })
-                .on('mouseout', function (event) {
-                    self.$target.removeClass('oe_big oe_small oe_medium');
-                    self.$target.addClass($ul.find('li.active').data("value"));
-                });
-        }
-    });
-
-    website.snippet.editorRegistry.custom_background = website.snippet.Editor.extend({
-        drop_and_build_snippet: function() {
-            var self = this;
-            var active = this.$target.hasClass(this.$el.data("class"));
-            if (active) {
-                var bg_value = this.$target.css("background-image").replace(/url\(['"]*|['"]*\)|^none$/g, "");
-                var editor = new website.editor.ImageDialog();
-                editor.on('start', self, function (o) {o.url = bg_value;});
-                editor.on('save', self, function (o) {
-                    self.$target.css("background-image", "url(" + o.url + ")");
-                });
-                editor.on('cancel', self, function () {
-                    if (bg_value === "") {
-                        self.$target.data("snippetStyles").find(".oe_style").filter(function () {
-                            return $(this).data('snipped-id') === 'custom_background';
-                        }).removeClass('active');
-                        self.$target.removeClass(self.$el.data("class"));
-                    }
-                });
-                editor.appendTo($('body'));
-            } else {
-                this.$target.css("background-image", "");
-            }
         }
     });
 
diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml
index af417a53538..33e9ad30ceb 100644
--- a/addons/website/views/snippets.xml
+++ b/addons/website/views/snippets.xml
@@ -14,43 +14,6 @@
 <div id="snippet_structure" class="tab-pane fade in active">
 
     <div data-snippet-id="carousel" data-selector-children=".oe_structure, [data-oe-type=html]">
-        <li class="oe_snippet_options dropdown-submenu">
-            <a tabindex="-1" href="#">Size</a>
-            <ul class="dropdown-menu" name="carousel-size">
-                <li data-value="oe_small"><a>Small</a></li>
-                <li data-value="oe_medium"><a>Medium</a></li>
-                <li data-value="oe_big"><a>Big</a></li>
-            </ul>
-        </li>
-        <li class="oe_snippet_options dropdown-submenu">
-            <a tabindex="-1" href="#">Background</a>
-            <ul class="dropdown-menu" name="carousel-background">
-                <li data-value="/website/static/src/img/banner/aqua.jpg"><a>Aqua</a></li>
-                <li data-value="/website/static/src/img/banner/baby_blue.jpg"><a>Baby Blue</a></li>
-                <li data-value="/website/static/src/img/banner/black.jpg"><a>Black</a></li>
-                <li data-value="/website/static/src/img/banner/business_guy.jpg"><a>Business Guy</a></li>
-                <li data-value="/website/static/src/img/banner/color_splash.jpg"><a>Color Splash</a></li>
-                <li data-value="/website/static/src/img/banner/flower_field.jpg"><a>Flowers Field</a></li>
-                <li data-value="/website/static/src/img/banner/greenfields.jpg"><a>Greenfields</a></li>
-                <li data-value="/website/static/src/img/banner/landscape.jpg"><a>Landscape</a></li>
-                <li data-value="/website/static/src/img/banner/mango.jpg"><a>Mango</a></li>
-                <li data-value="/website/static/src/img/banner/mountains.jpg"><a>Mountains</a></li>
-                <li data-value="/website/static/src/img/banner/orange_red.jpg"><a>Orange Red</a></li>
-                <li data-value="/website/static/src/img/banner/flower.jpg"><a>Purple</a></li>
-                <li data-value="/website/static/src/img/banner/velour.jpg"><a>Velour</a></li>
-                <li data-value="/website/static/src/img/banner/wood.jpg"><a>Wood</a></li>
-                <li data-value="/website/static/src/img/banner/yellow_green.jpg"><a>Yellow Green</a></li>
-                <li class="oe_custom_bg"><a><b>Choose a photo...</b></a></li>
-            </ul>
-        </li>
-        <li class="oe_snippet_options dropdown-submenu">
-            <a tabindex="-1" href="#">Layout</a>
-            <ul class="dropdown-menu" name="carousel-style">
-                <li data-value="text_only"><a>Text Only</a></li>
-                <li data-value="image_text"><a>Image - Text</a></li>
-                <li data-value="text_image"><a>Text - Image</a></li>
-            </ul>
-        </li>
         <li class="oe_snippet_options divider"></li>
         <li class="oe_snippet_options">
             <a href="#" class="button js_add">Add Slide</a>
@@ -678,24 +641,6 @@
             <img class="oe_snippet_thumbnail_img" src="/website/static/src/img/blocks/block_parallax.png"/>
             <span class="oe_snippet_thumbnail_title">Parallax</span>        
         </div>
-        <li class="oe_snippet_options dropdown-submenu">
-            <a tabindex="-1" href="#">Size</a>
-            <ul class="dropdown-menu" name="parallax-size">
-                <li data-value="oe_small"><a>Small</a></li>
-                <li data-value="oe_medium"><a>Medium</a></li>
-                <li data-value="oe_big"><a>Big</a></li>
-            </ul>
-        </li>
-        <li class="oe_snippet_options dropdown-submenu">
-            <a tabindex="-1" href="#">Background</a>
-            <ul class="dropdown-menu" name="parallax-background">
-                <li data-value="/website/static/src/img/banner/greenfields.jpg"><a>Greenfields</a></li>
-                <li data-value="/website/static/src/img/banner/landscape.jpg"><a>Landscape</a></li>
-                <li data-value="/website/static/src/img/banner/mountains.jpg"><a>Mountains</a></li>
-                <li data-value="/website/static/src/img/parallax/parallax_bg.jpg"><a>Office</a></li>
-                <li class="oe_custom_bg"><a><b>Choose your picture</b></a></li>
-            </ul>
-        </li>
         <li class="oe_snippet_options dropdown-submenu">
             <a tabindex="-1" href="#">Scroll Speed</a>
             <ul class="dropdown-menu" name="parallax-scroll">
@@ -709,7 +654,7 @@
         </li>
         <div class="oe_snippet_body parallax oe_small oe_structure"
                 style="background-image: url('/website/static/src/img/parallax/parallax_bg.jpg')"
-                data-scroll-background-ratio="0.6">
+                data-scroll-background-ratio="0.3">
         </div>
     </div>
 
@@ -792,26 +737,78 @@
 </div>
 
 <div id="snippet_styles" class="hidden">
-    <div data-snippet-id='darken' data-selector='section' data-class="oe_dark">
-        <div class='oe_snippet_label'>Darken</div>
-        <div class='oe_snippet_group'>Background</div>
+
+    <div data-snippet-style-id='carousel-style' data-selector='div[data-snippet-id="carousel"]'>
+        <li class="dropdown-submenu" data-required="true">
+            <a tabindex="-1" href="#">Layout</a>
+            <ul class="dropdown-menu">
+                <li data-class="text_only"><a>Text Only</a></li>
+                <li data-class="image_text"><a>Image - Text</a></li>
+                <li data-class="text_image"><a>Text - Image</a></li>
+            </ul>
+        </li>
     </div>
-    <div data-snippet-id='green' data-selector='section' data-class="oe_green">
-        <div class='oe_snippet_label'>Green</div>
-        <div class='oe_snippet_group'>Background</div>
+
+    <div data-snippet-style-id='size' data-selector='div[data-snippet-id="parallax"], div[data-snippet-id="carousel"]'>
+        <li class="dropdown-submenu" data-required="true">
+            <a tabindex="-1" href="#">Size</a>
+            <ul class="dropdown-menu">
+                <li data-class='oe_small'><a>Small</a></li>
+                <li data-class='oe_medium'><a>Medium</a></li>
+                <li data-class='oe_big'><a>Big</a></li>
+            </ul>
+        </li>
     </div>
-    <div data-snippet-id='red' data-selector='section' data-class="oe_red">
-        <div class='oe_snippet_label'>Red</div>
-        <div class='oe_snippet_group'>Background</div>
-    </div>
-    <div data-snippet-id='black' data-selector='section' data-class="oe_black">
-        <div class='oe_snippet_label'>Black</div>
-        <div class='oe_snippet_group'>Background</div>
-    </div>
-    <div data-snippet-id='custom_background' data-selector='section' data-class="oe_custom_bg">
-        <div class='oe_snippet_label'>Custom Picture...</div>
-        <div class='oe_snippet_group'>Background</div>
+
+    <div data-snippet-style-id='background' data-selector='section, div[data-snippet-id="parallax"], div[data-snippet-id="carousel"]'>
+        <li class="dropdown-submenu">
+            <a tabindex="-1" href="#">Background</a>
+            <ul class="dropdown-menu">
+                <li class="dropdown-submenu">
+                    <a tabindex="-1" href="#">Uniform Color</a>
+                    <ul class="dropdown-menu">
+                        <li data-class='oe_dark'><a>Darken</a></li>
+                        <li data-class='oe_green'><a>Green</a></li>
+                        <li data-class='oe_red'><a>Red</a></li>
+                        <li data-class='oe_black'><a>Black</a></li>
+                    </ul>
+                </li>
+                <li class="dropdown-submenu">
+                    <a tabindex="-1" href="#">People</a>
+                    <ul class="dropdown-menu">
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/parallax/parallax_bg.jpg"><a>Sunflower</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/business_guy.jpg"><a>Business Guy</a></li>
+                    </ul>
+                </li>
+                <li class="dropdown-submenu">
+                    <a tabindex="-1" href="#">Landscape</a>
+                    <ul class="dropdown-menu">
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/flower_field.jpg"><a>Flowers Field</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/landscape.jpg"><a>Landscape</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/mountains.jpg"><a>Mountains</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/greenfields.jpg"><a>Greenfields</a></li>
+                    </ul>
+                </li>
+                <li class="dropdown-submenu">
+                    <a tabindex="-1" href="#">Various</a>
+                    <ul class="dropdown-menu">
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/aqua.jpg"><a>Aqua</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/baby_blue.jpg"><a>Baby Blue</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/black.jpg"><a>Black</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/color_splash.jpg"><a>Color Splash</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/mango.jpg"><a>Mango</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/orange_red.jpg"><a>Orange Red</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/flower.jpg"><a>Purple</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/velour.jpg"><a>Velour</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/wood.jpg"><a>Wood</a></li>
+                        <li data-class="oe_img_bg" data-src="/website/static/src/img/banner/yellow_green.jpg"><a>Yellow Green</a></li>
+                    </ul>
+                </li>
+                <li class="oe_custom_bg" data-class="oe_img_bg"><a><b>Choose a photo...</b></a></li>
+            </ul>
+        </li>
     </div>
+
 </div>
 
     </div>
diff --git a/addons/website_sale/controllers/main.py b/addons/website_sale/controllers/main.py
index b298e40dc6b..cb44d16ec98 100644
--- a/addons/website_sale/controllers/main.py
+++ b/addons/website_sale/controllers/main.py
@@ -240,10 +240,10 @@ class Ecommerce(http.Controller):
                     filter[index.index(cat_id)].append( cat[2] )
             post.pop(key)
 
-        return request.redirect("/shop/?filter=%s%s%s%s" % (
+        return request.redirect("/shop/?filter=%s%s%s" % (
                 simplejson.dumps(filter),
-                post.get("search") and "&search=%s" % post.get("search") or "",
-                post.get("category") and "&category=%s" % post.get("category") or ""
+                post.get("search") and ("&search=%s" % post.get("search")) or "",
+                post.get("category") and ("&category=%s" % post.get("category")) or ""
             ))
 
     def attributes_to_ids(self, attributes):
@@ -259,7 +259,12 @@ class Ecommerce(http.Controller):
         att = obj.read(request.cr, request.uid, att_ids, ["product_id"], context=request.context)
         return [r["product_id"][0] for r in att]
 
-    @website.route(['/shop/', '/shop/page/<int:page>/'], type='http', auth="public", multilang=True)
+    @website.route([
+        '/shop/',
+        '/shop/page/<int:page>/',
+        '/shop/category/<int:category>/',
+        '/shop/category/<int:category>/page/<int:page>/'
+    ], type='http', auth="public", multilang=True)
     def category(self, category=0, filter="", page=0, **post):
         # TDE-NOTE: shouldn't we do somethign about product_template without variants ???
         # TDE-NOTE: is there a reason to call a method category when the route is
@@ -283,8 +288,8 @@ class Ecommerce(http.Controller):
                 ('product_variant_ids.public_categ_id.name', 'ilike', "%%%s%%" % post.get("search"))]
 
         if category:
-            cat_id = int(category)
-            domain = [('product_variant_ids.public_categ_id.id', 'child_of', cat_id)] + domain
+            category_id = int(category)
+            domain = [('product_variant_ids.public_categ_id.id', 'child_of', category_id)] + domain
 
         if filter:
             filter = simplejson.loads(filter)
diff --git a/addons/website_sale/static/src/js/website_sale.editor.js b/addons/website_sale/static/src/js/website_sale.editor.js
index 366b4fadce5..87be89b59c6 100644
--- a/addons/website_sale/static/src/js/website_sale.editor.js
+++ b/addons/website_sale/static/src/js/website_sale.editor.js
@@ -19,4 +19,60 @@
             }
         }),
     });
+
+
+    $(document).on('click', '.js_publish_management .js_go_to_top,.js_publish_management .js_go_to_bottom', function (event) {
+        var $a = $(event.currentTarget);
+        var $data = $a.parents(".js_publish_management:first");
+        openerp.jsonRpc('/shop/change_sequence/', 'call', {'id': $data.data('id'), 'top': $a.hasClass('js_go_to_top')});
+    });
+
+    $(document).on('click', '.js_options ul[name="style"] a', function (event) {
+        var $a = $(event.currentTarget);
+        var $li = $a.parent();
+        var $data = $a.parents(".js_options:first");
+        var $product = $a.parents(".oe_product:first");
+
+        $li.parent().removeClass("active");
+        openerp.jsonRpc('/shop/change_styles/', 'call', {'id': $data.data('id'), 'style_id': $a.data("id")})
+            .then(function (result) {
+                $product.toggleClass($a.data("class"));
+                $li.toggleClass("active", result);
+            });
+    });
+
+    $(document).on('mouseenter', '#products_grid .js_options ul[name="size"] table', function (event) {
+        $(event.currentTarget).addClass("oe_hover");
+    });
+    $(document).on('mouseleave', '#products_grid .js_options ul[name="size"] table', function (event) {
+        $(event.currentTarget).removeClass("oe_hover");
+    });
+    $(document).on('mouseover', '#products_grid .js_options ul[name="size"] td', function (event) {
+        var $td = $(event.currentTarget);
+        var $table = $td.parents("table:first");
+        var x = $td.index()+1;
+        var y = $td.parent().index()+1;
+
+        var tr = [];
+        for (var yi=0; yi<y; yi++) tr.push("tr:eq("+yi+")");
+        var $select_tr = $table.find(tr.join(","));
+        var td = [];
+        for (var xi=0; xi<x; xi++) td.push("td:eq("+xi+")");
+        var $select_td = $select_tr.find(td.join(","));
+
+        $table.find("td").removeClass("select");
+        $select_td.addClass("select");
+    });
+    $(document).on('click', '#products_grid .js_options ul[name="size"] td', function (event) {
+        var $td = $(event.currentTarget);
+        var $data = $td.parents(".js_options:first");
+        var x = $td.index()+1;
+        var y = $td.parent().index()+1;
+        openerp.jsonRpc('/shop/change_size/', 'call', {'id': $data.data('id'), 'x': x, 'y': y})
+            .then(function () {
+                var search = location.search.replace(/\?|$/, '?enable_editor=1&');
+                location.href = location.href.replace(/(\?|#).*/, search + location.hash);
+            });
+    });
+
 })();
diff --git a/addons/website_sale/static/src/js/website_sale.js b/addons/website_sale/static/src/js/website_sale.js
index 484ec764f7f..856c8bd1aa6 100644
--- a/addons/website_sale/static/src/js/website_sale.js
+++ b/addons/website_sale/static/src/js/website_sale.js
@@ -77,60 +77,6 @@ $(document).ready(function () {
         $price.html($price.data("price")+parseFloat($label.find(".badge span").text() || 0));
     });
 
-    $(document).on('click', '.js_publish_management .js_go_to_top,.js_publish_management .js_go_to_bottom', function (event) {
-        var $a = $(event.currentTarget);
-        var $data = $a.parents(".js_publish_management:first");
-        openerp.jsonRpc('/shop/change_sequence/', 'call', {'id': $data.data('id'), 'top': $a.hasClass('js_go_to_top')});
-    });
-
-    $(document).on('click', '#products_grid .js_options ul[name="style"] a', function (event) {
-        var $a = $(event.currentTarget);
-        var $li = $a.parent();
-        var $data = $a.parents(".js_options:first");
-        var $product = $a.parents(".oe_product:first");
-
-        $li.parent().removeClass("active");
-        openerp.jsonRpc('/shop/change_styles/', 'call', {'id': $data.data('id'), 'style_id': $a.data("id")})
-            .then(function (result) {
-                $product.toggleClass($a.data("class"));
-                $li.toggleClass("active", result);
-            });
-    });
-
-    $(document).on('mouseenter', '#products_grid .js_options ul[name="size"] table', function (event) {
-        $(event.currentTarget).addClass("oe_hover");
-    });
-    $(document).on('mouseleave', '#products_grid .js_options ul[name="size"] table', function (event) {
-        $(event.currentTarget).removeClass("oe_hover");
-    });
-    $(document).on('mouseover', '#products_grid .js_options ul[name="size"] td', function (event) {
-        var $td = $(event.currentTarget);
-        var $table = $td.parents("table:first");
-        var x = $td.index()+1;
-        var y = $td.parent().index()+1;
-
-        var tr = [];
-        for (var yi=0; yi<y; yi++) tr.push("tr:eq("+yi+")");
-        var $select_tr = $table.find(tr.join(","));
-        var td = [];
-        for (var xi=0; xi<x; xi++) td.push("td:eq("+xi+")");
-        var $select_td = $select_tr.find(td.join(","));
-
-        $table.find("td").removeClass("select");
-        $select_td.addClass("select");
-    });
-    $(document).on('click', '#products_grid .js_options ul[name="size"] td', function (event) {
-        var $td = $(event.currentTarget);
-        var $data = $td.parents(".js_options:first");
-        var x = $td.index()+1;
-        var y = $td.parent().index()+1;
-        openerp.jsonRpc('/shop/change_size/', 'call', {'id': $data.data('id'), 'x': x, 'y': y})
-            .then(function () {
-                var search = location.search.replace(/\?|$/, '?enable_editor=1&');
-                location.href = location.href.replace(/(\?|#).*/, search + location.hash);
-            });
-    });
-
 
     $(".js_slider").each(function() {
         var $slide = $(this);
diff --git a/addons/website_sale/views/website_sale.xml b/addons/website_sale/views/website_sale.xml
index 12ea594b680..d30be42a3ca 100644
--- a/addons/website_sale/views/website_sale.xml
+++ b/addons/website_sale/views/website_sale.xml
@@ -14,10 +14,9 @@
                 </a>
             </li>
         </xpath>
-        <xpath expr="//head" position="inside">
-            <t t-if="editable">
-                <script type="text/javascript" src="/website_sale/static/src/js/website.tour.shop.js"></script>
-            </t>
+        <xpath expr="//t[@id='editable_scripts_hook']" position="inside">
+              <script type="text/javascript" src="/website_sale/static/src/js/website_sale.editor.js" t-ignore="true"></script>
+              <script type="text/javascript" src="/website_sale/static/src/js/website.tour.shop.js" t-ignore="true"></script>
         </xpath>
     </template>
 
@@ -25,7 +24,7 @@
 
     <template id="categories_recursive" name="Category list">
         <li t-att-class="str(category.id) == search.get('category') and 'active' or ''">
-            <a t-att-class="category.id not in categ[1] and 'unpublish' or ''" t-href="/shop/?category=#{ category.id }" t-field="category.name" t-keep-query="search,facettes"></a>
+            <a t-att-class="category.id not in categ[1] and 'unpublish' or ''" t-href="/shop/category/#{ category.id }/" t-field="category.name"></a>
             <ul t-if="category.child_id" class="nav nav-pills nav-stacked nav-hierarchy">
                 <t t-foreach="category.child_id" t-as="category">
                     <t t-if="category.id in categ[1] or editable">
@@ -49,7 +48,7 @@
         <div class="ribbon"><span contentEditable="true">Promo</span></div>
       </div>
       <div class="oe_product_description">
-          <a t-href="/shop/product/#{ product.id }/" t-keep-query="category,search,facettes">
+          <a t-href="/shop/product/#{ product.id }/" t-keep-query="category,search,filter">
               <b t-field="product.name"/>
           </a>
       </div>
@@ -69,7 +68,7 @@
           </b>
       </div>
       <div class="oe_product_image text-center">
-          <a t-href="/shop/product/#{ product.id }/" t-keep-query="category,search,facettes">
+          <a t-href="/shop/product/#{ product.id }/" t-keep-query="category,search,filter">
               <span t-field="product.image" t-field-options='{"widget": "image"}'/>
           </a>
       </div>
@@ -118,7 +117,7 @@
 
                                 <div class="oe_product_cart" t-att-data-publish="product.website_published and 'on' or 'off'">
 
-                                  <div class="css_options" t-ignore="true" t-if="is_website_publisher">
+                                  <div class="css_options" t-ignore="true" t-if="editable">
                                     <div t-attf-class="dropdown js_options" t-att-data-id="product.id">
                                       <a class="btn btn-default" t-att-id="'dopprod-%s' % product.id" role="button" data-toggle="dropdown">Options <span class="caret"></span></a>
                                       <ul class="dropdown-menu" role="menu" t-att-aria-labelledby="'dopprod-%s' % product.id">
@@ -245,7 +244,7 @@
                   <div class="col-sm-5">
                       <ol class="breadcrumb">
                           <li><a href="/shop">Products</a></li>
-                          <li t-if="search.get('category')"><a t-href="/shop/" t-keep-query="category,search,facettes"><span t-field="category.name"/></a></li>
+                          <li t-if="search.get('category')"><a t-href="/shop/" t-keep-query="category,search,filter"><span t-field="category.name"/></a></li>
                           <li class="active"><span t-field="product.name"></span></li>
                       </ol>
                   </div><div class="col-sm-3">
@@ -517,7 +516,7 @@
 
     <template id="products_attributes" inherit_option_id="website_sale.products" name="Product Filters and Attributes">
         <xpath expr="//div[@id='products_grid_before']" position="inside">
-            <form t-action="/shop/filter/" method="post" t-keep-query="category,search,add_filter">
+            <form t-action="/shop/filter/" method="post" t-keep-query="category,search">
                 <ul class="nav nav-pills nav-stacked mt16">
                     <t t-set="attribute_ids" t-value="Ecommerce.get_attribute_ids()"/>
                     <t t-foreach="attribute_ids" t-as="attribute_id">
diff --git a/addons/website_sale/website_sale_data.xml b/addons/website_sale/website_sale_data.xml
index b8849a6234f..223d7fe03ba 100644
--- a/addons/website_sale/website_sale_data.xml
+++ b/addons/website_sale/website_sale_data.xml
@@ -1,12 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <openerp>
-    <data>
-        <template id="website_sale_script" inherit_id="website.layout" name="Website Sale script">
-            <xpath expr="//t[@id='editable_scripts_hook']" position="inside">
-                <script type="text/javascript" src="/website_sale/static/src/js/website_sale.editor.js" t-ignore="true"></script>
-            </xpath>
-        </template>
-    </data>
     <data noupdate="1">
 
         <record id="menu_shop" model="website.menu">