Skip to Content
Menu
This question has been flagged
2 Replies
2257 Views

Hi everyone


Ribbon is a cool feature I am using on my website. I add it on the product page to say for example "New product" and it is display on tree view on the website.

However I am trying to add it on the product page, after clicking on the product in the list view. I think it is strange to loose this information after going in detail on the product.


So what I did with success :

Add custom code in server/odoo/addons/website_sale/views/templates.xml

in order to display the ribbon

With this, I saw I was able to do it, and to display it where I wanted it (I mean on the main product image on the product page)


What I try do now with no success :

Move this custom code in a custom module, to not modify standard code


When I updated standard code first to see if I was at the good place, I add my span inside this block

        

            

        

        

    


But now that I try to inherit this view templates.xml and to inject my span with an xpath I am not finding the right xpath to write ...


this is a template, with inside divs conditionned by if-else, without id ...

 

I tried many things, for example 

But I have an error saying it was not found in the parent view...

My whole code


           
               
                   
                   
                   
                   
               
                   
       

why is there NO WAY to display code on this forum !!!!!! (with or without code balise it keep everything empty)

Avatar
Discard
Author Best Answer

Huge thank you for your help, I think it is close to the solution, but I still have an error with your code (as with mine)

Error when compiling xml template
SyntaxError: t-elif directive must be preceded by t-if or t-elif directive
Template: website_sale.shop_product_image
Path: /t/div[2]
Node: 

SUCCESS with this xpath : xpath expr="//div[contains(@t-att-class, 'image_classes')]"

Thank you again for your help, with your answer I succeed in achieving it


The code I use to display the ribbon with the good design

t t-set="bg_color" t-value="product['website_ribbon_id']['bg_color'] or ''"/                

t t-set="text_color" t-value="product['website_ribbon_id']['text_color']"/                

t t-set="bg_class" t-value="product['website_ribbon_id']['html_class']"/                

span id="ribbon-override-productimage" t-attf-class="o_ribbon o_not_editable #{bg_class}" t-attf-style="#{text_color and ('color: %s; ' % text_color)}#{bg_color and 'background-color:' + bg_color}" t-out="product['website_ribbon_id']['html'] or ''"/

Avatar
Discard
Best Answer

Hi,

Hi,

It looks like you are using Odoo V16. In V16, the ribbon is only shown in the product items view. In V17, the ribbon shows in both views. If you need to set the ribbon on the product page, you need to inherit a template named 'website_sale.shop_product_image' and add a 'span' for the ribbon like this:

<template t-name='module_name.product_ribbon'     

        t-inherit='website_sale.shop_product_image'>


    <xpath expr='//div[@t-field='product_image.image_1920']' position='before'>


        <span t-attf-class="o_ribbon #{ribbon['html_class']} z-index-1"                   

              t-attf-style="#{text_color and ('color: %s; ' % text_color)}#{bg_color and 'background-color:' + bg_color}"                   

              t-out="ribbon['html'] or ''" />


    </xpath>


</template>

For more details on how to pass ribbon values, you can refer to the V17 source code.


Hope it helps


Avatar
Discard