I apologize for the extremely stupid question, but all my attempts were not crowned with success. As I understood, the file /woocommerce/template/single-product/product-image.php is responsible for the images of all the cards . I tried through the selector of a certain product to do this (in the file woocommerce.css):

#blog > div.container.rsrc-container > div.row.rsrc-fullwidth-home > div.rsrc-home > div > div > div > ul > li { background-image: url ('../assets/css/3.gif'); } 

Tell me the direction, please, I have an idea to insert a .gif image that will be launched only when you hover the mouse (by replacing the static image with the .gif property through the visibility property)

  • What kind of heresy? For the image of the product card "answers" the image that you ask the product in the admin panel. And other product images for the gallery there. - SeVlad
  • that's right, that's it for “the image that you give to the product in the admin panel” and product-image.php is responsible , and I need to hang two images for a single product, one static, the other dynamic via html / css. - user271244
  • What does "dynamic" mean and why via css? - SeVlad
  • Dynamic, I mean .gif (animation), but for a static image to be initially displayed (that is, the first frame of this .gif ), and the .gif itself should appear when we hover over the image with the mouse (: hover) , while the static image using visibility: hidden , there are options how to do this, or work around it in another way? - user271244
  • @ user271244 it all depends on the layout, when you hover on some block in which the picture is located, to hide the image, and set the background to the block - DaemonHK

0