diff --git a/addons/website_sale/models/product.py b/addons/website_sale/models/product.py
index 291d4185ce5..2f41c8cb384 100644
--- a/addons/website_sale/models/product.py
+++ b/addons/website_sale/models/product.py
@@ -16,7 +16,7 @@ class ProductRibbon(models.Model):
     def name_get(self):
         return [(ribbon.id, '%s (#%d)' % (tools.html2plaintext(ribbon.html), ribbon.id)) for ribbon in self]
 
-    html = fields.Char(string='Ribbon html', required=True, translate=True)
+    html = fields.Html(string='Ribbon html', required=True, translate=True, sanitize=False)
     bg_color = fields.Char(string='Ribbon background color', required=False)
     text_color = fields.Char(string='Ribbon text color', required=False)
     html_class = fields.Char(string='Ribbon class', required=True, default='')
diff --git a/addons/website_sale/models/product_image.py b/addons/website_sale/models/product_image.py
index eea9afb6967..c8cdb4aaf06 100644
--- a/addons/website_sale/models/product_image.py
+++ b/addons/website_sale/models/product_image.py
@@ -22,7 +22,7 @@ class ProductImage(models.Model):
     product_variant_id = fields.Many2one('product.product', "Product Variant", index=True, ondelete='cascade')
     video_url = fields.Char('Video URL',
                             help='URL of a video for showcasing your product.')
-    embed_code = fields.Char(compute="_compute_embed_code")
+    embed_code = fields.Html(compute="_compute_embed_code", sanitize=False)
 
     can_image_1024_be_zoomed = fields.Boolean("Can Image 1024 be zoomed", compute='_compute_can_image_1024_be_zoomed', store=True)
 
diff --git a/addons/website_sale/views/product_views.xml b/addons/website_sale/views/product_views.xml
index c657c02d88e..4322c0874a0 100644
--- a/addons/website_sale/views/product_views.xml
+++ b/addons/website_sale/views/product_views.xml
@@ -125,6 +125,28 @@
         </field>
     </record>
 
+    <!-- Product ribbon -->
+    <record id="product_ribbon_form_view" model="ir.ui.view">
+        <field name="name">product.ribbon form view</field>
+        <field name="model">product.ribbon</field>
+        <field name="arch" type="xml">
+            <form>
+                <sheet>
+                    <group>
+                        <group>
+                            <field name="html" widget="char"/>
+                            <field name="text_color"/>
+                        </group>
+                        <group>
+                            <field name="html_class"/>
+                            <field name="bg_color"/>
+                        </group>
+                    </group>
+                </sheet>
+            </form>
+        </field>
+    </record>
+
     <!-- Product Public Categories -->
     <record id="product_public_category_form_view" model="ir.ui.view">
         <field name="name">product.public.category.form</field>
diff --git a/addons/website_sale/views/templates.xml b/addons/website_sale/views/templates.xml
index b9cc4e8f676..0fcdf56c989 100644
--- a/addons/website_sale/views/templates.xml
+++ b/addons/website_sale/views/templates.xml
@@ -213,7 +213,7 @@
             <t t-set="bg_color" t-value="td_product['ribbon']['bg_color'] or ''"/>
             <t t-set="text_color" t-value="td_product['ribbon']['text_color']"/>
             <t t-set="bg_class" t-value="td_product['ribbon']['html_class']"/>
-            <span t-attf-class="o_ribbon #{bg_class}" t-attf-style="#{text_color and ('color: %s; ' % text_color)}#{bg_color and 'background-color:' + bg_color}" t-raw="td_product['ribbon']['html'] or ''"/>
+            <span t-attf-class="o_ribbon #{bg_class}" t-attf-style="#{text_color and ('color: %s; ' % text_color)}#{bg_color and 'background-color:' + bg_color}" t-out="td_product['ribbon']['html'] or ''"/>
         </form>
     </template>
 
@@ -357,7 +357,7 @@
                 <span class="d-none d-lg-inline font-weight-bold text-muted">Sort By:</span>
                 <a role="button" href="#" class="dropdown-toggle btn btn-light border-0 px-0 text-muted align-baseline" data-toggle="dropdown">
                     <span class="d-none d-lg-inline">
-                        <t t-if='len(website_sale_sortable_current)'>
+                        <t t-if='website_sale_sortable_current'>
                             <t t-esc="website_sale_sortable_current[0][0]"/>
                         </t>
                         <t t-else='1'>
@@ -369,7 +369,7 @@
                 <div class="dropdown-menu dropdown-menu-right" role="menu">
                     <t t-foreach="website_sale_sortable" t-as="sortby">
                         <a role="menuitem" rel="noindex,nofollow" t-att-href="keep('/shop', order=sortby[1])" class="dropdown-item">
-                            <span t-raw="sortby[0]"/>
+                            <span t-out="sortby[0]"/>
                         </a>
                     </t>
                 </div>
@@ -1778,13 +1778,13 @@
                         <i class="fa fa-pencil"></i>
                     </a>
                     <t t-if="payment_tx_id.state == 'pending'">
-                        <t t-raw="payment_tx_id.acquirer_id.sudo().pending_msg"/>
+                        <t t-out="payment_tx_id.acquirer_id.sudo().pending_msg"/>
                     </t>
                     <t t-if="payment_tx_id.state == 'done'">
-                        <span t-if='payment_tx_id.acquirer_id.sudo().done_msg' t-raw="payment_tx_id.acquirer_id.sudo().done_msg"/>
+                        <span t-if='payment_tx_id.acquirer_id.sudo().done_msg' t-out="payment_tx_id.acquirer_id.sudo().done_msg"/>
                     </t>
                     <t t-if="payment_tx_id.state == 'cancel'">
-                        <t t-raw="payment_tx_id.acquirer_id.sudo().cancel_msg"/>
+                        <t t-out="payment_tx_id.acquirer_id.sudo().cancel_msg"/>
                     </t>
                     <t t-if="payment_tx_id.state == 'authorized'">
                         <span>Your payment has been authorized.</span>
@@ -1849,7 +1849,7 @@
                     <t t-foreach="product_images" t-as="product_image">
                         <div t-attf-class="carousel-item h-100#{' active' if product_image_first else ''}">
                             <div t-if="product_image._name == 'product.image' and product_image.embed_code" class="d-flex align-items-center justify-content-center h-100 embed-responsive embed-responsive-16by9">
-                                <t t-raw="product_image.embed_code"/>
+                                <t t-out="product_image.embed_code"/>
                             </div>
                             <div  t-else="" t-field="product_image.image_1920" class="d-flex align-items-center justify-content-center h-100" t-options='{"widget": "image", "preview_image": "image_1024", "class": "product_detail_img mh-100", "alt-field": "name", "zoom": product_image.can_image_1024_be_zoomed and "image_1920", "itemprop": "image"}'/>
                         </div>