Odoo Help

Welcome!

This community is for beginners and experts willing to share their Odoo knowledge. It's not a forum to discuss ideas, but a knowledge base of questions and their answers.

0

webshop grid adding second image hidden to product picture in DOM for java script usage

By
joachim grubelnik
on 3/24/16, 8:03 AM 319 views
  • Goal:

adding an icon container which i can use later with a javascript, this should not harm existing stuff

first i tried to replace the ribbon which works but this was not a good idea i think :-) it harms....

i don't want to replace the existing picture, i just want to add a icon container which should be hidden in background


  • info:
    not sure if i would need the <a> this is how its done in some areas  i have checked ...maybe giving the icon container z-index: and or display: none; to later activate it via the css or java script 

  • Thats what i tried yet:

<template id="products_item_icon_container" inherit_id="website_sale.products_item" name="icon container">

<xpath expr="//div[@class='oe_product_image']" position="after">

<!-- Product Image -->
<div class="oe_product_image">
<a itemprop="url" class="front" t-att-href="keep('/shop/product/%s' % slug(product), page=(pager['page']['num'] if pager['page']['num']>1 else None))">
<img itemprop="image" class="img img-responsive" t-att-src="website.image_url(product, 'image', None if product_image_big else '300x300')" t-att-alt="product.name"/>
</a>
<div class="icon_container">
<img src="/shopgrid_config/static/img/icon_box.png"/>
</div>
</div>
</xpath>
</template>

thanks 
0
joachim grubelnik
On 3/30/16, 7:21 AM

maybe this helps someone else 

ok as maybe lots of you already know, you cannot insert something into an existing structure if i want to add some elements inside 

so you always have to replace the whole existing content if you want to have a new container wrapping around the whole part where you want to insert, the problem is if any other module overrides this part you replacing there will be a totaly crash. 

even if you inherit an existing id its not rendered first and your addings are added to it, you have to replace the whole part. 

so i replaced this part for example:

<template id="wsd_products_item_image" inherit_id="website_sale.products_item" name="Square Images" customize_show="True" active="False">
 <xpath expr="//div[@class='oe_product_image']" position="replace">
 <div class="flip">
 <div class="front">
 <div class="oe_product_image">
 <a itemprop="url" t-att-href="keep('/shop/product/%s' % slug(product), page=(pager['page']['num'] if pager['page']['num']>1 else None))"> <img itemprop="image" class="img img-responsive" t-att-src="website.image_url(product, 'image_square')" t-att-alt="product.name"/> </a>
 </div>
 </div>
 <div class="back">
 <div class="wsd-icon_container">
 </div>
 </div>
 </div>
 </xpath>
</template> 

and in another modul i just insert whatever i needed inside this container so existing stuff is not harmed

<template id="products_item_flip_image" inherit_id="website_sale_donate.wsd_products_item_image" name="Some Products Item Image">
<xpath expr="//div[@class='wsd-icon_container']" position="inside">
<img src="/some_config/static/img/icon_geschenk.png"/>
</xpath>
</template>

Your Answer

Please try to give a substantial answer. If you wanted to comment on the question or answer, just use the commenting tool. Please remember that you can always revise your answers - no need to answer the same question twice. Also, please don't forget to vote - it really helps to select the best questions and answers!

About This Community

This community is for professionals and enthusiasts of our products and services. Read Guidelines

Question tools

1 follower(s)

Stats

Asked: 3/24/16, 8:03 AM
Seen: 319 times
Last updated: 3/30/16, 7:21 AM