Home › Forums › WoodMart support forum › Product style issue

Product style issue

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • September 26, 2018 at 2:48 am #79058

    amaury_santillan
    Participant

    Hi guys.

    1. Price is not displaying for external/affiliate products on product summary unless user hover it.

    2. Rating stars are not displaying corectly even if user hovers it.

    3. I need the featured image to display full width but its something forcing some kind of padding inside the box.

    Could you help me?

    Thanks

    Attachments:
    You must be logged in to view attached files.
    September 26, 2018 at 6:05 am #79078

    Artem Temos
    Keymaster

    Hello,

    When we visit your shop page we don’t see any of the mentioned issues https://gyazo.com/d434d3dceb6e37b2dca104a6c47f1c8b
    How can we reproduce them?

    Regards

    September 26, 2018 at 2:30 pm #79210

    amaury_santillan
    Participant

    Obviously you have to hover the item.

    Anyway. Points 1 and 2 are already done.

    I need gelp though with the 3rd point.

    I need the image to display full width. I mean to fit on iys container without any padding.

    4. I wouild like to place an icon of mine when the add to cdart its hover. Could you please help setting this icon https://www.outlet.viajes/wp-content/uploads/2018/09/icono-avión.png instead the cart one?

    Thanks

    September 26, 2018 at 3:05 pm #79219

    Artem Temos
    Keymaster

    3. What featured image do you mean? Please, send us a screenshot.

    4. Unfortunately, it is not possible to set an image there. It is a vector icon and it changes the color on smaller screens http://prntscr.com/kz091m
    It can’t be done with your png image.

    September 26, 2018 at 3:12 pm #79220

    amaury_santillan
    Participant

    3. The product image. http://prntscr.com/kz091m

    4. Anyway. I would like to change it. I can upload a svg file. Just tell me how to replace it.

    September 26, 2018 at 3:22 pm #79226

    Artem Temos
    Keymaster

    3. You make them full width with CSS only

    .products-spacing-30 .product {
    padding-left: 0;
    padding-right: 0;
}

    4. SVG file will not be changing the color as well.

    September 26, 2018 at 3:29 pm #79229

    amaury_santillan
    Participant

    3. Thanks that affected the entire box (section). I only need to affect the image inside that box.

    4. Yes, I understand. But I need to replace it whatever it means

    September 26, 2018 at 5:43 pm #79274

    Artem Temos
    Keymaster

    3. It is applied for the image only now. Show us on the screenshot how you want it to be.

    4.

    body .product-grid-item .product-information .fade-in-block .woodmart-buttons .woodmart-add-btn>a:before {
	background-image: url(https://www.outlet.viajes/wp-content/uploads/2018/09/icono-avi%C3%B3n.png);
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: center;
	content: "";
}
    September 26, 2018 at 6:24 pm #79309

    amaury_santillan
    Participant

    3. https://www.dropbox.com/s/39054z9atvlvl8j/InkedCaptura%20de%20pantalla%202018-09-26%2009.16.52_LI.jpg?dl=0

    https://www.dropbox.com/s/ctdxtsn8jc7vj5c/InkedCaptura%20de%20pantalla%202018-09-26%2009.17.36_LI.jpg?dl=0

    4. It does not work.

    Onm the screen shot i specify which button im talking about

    September 26, 2018 at 7:01 pm #79318

    Artem Temos
    Keymaster

    3. Use this code

    body .woodmart-hover-base .content-product-imagin {
    top: 0;
    left: 15px;
    right: 15px;
}

    and this for mobile devices

    body .woodmart-hover-base .content-product-imagin {
    left: 10px;
    right: 10px;
}

    4. It seems to work now https://gyazo.com/a2bcc9535349b621c14cea4a211f0e21

    September 26, 2018 at 8:36 pm #79354

    amaury_santillan
    Participant

    3. Thank you very much. That worked just fine. DONE

    4. Almost there. Its not working as well on mobiles.

    Could ypou help me?

    September 27, 2018 at 6:17 am #79372

    Bogdan Donovan
    Keymaster

    Please, upload the same icon in black colour, and we will prepare a code snippet for you.

    Regards

    September 27, 2018 at 3:19 pm #79482

    amaury_santillan
    Participant

    Thanks

    This will be the icon

    https://www.outlet.viajes/wp-content/uploads/2018/09/icono-avión-movil.png

    September 27, 2018 at 6:34 pm #79509

    Elise Noromit
    Member

    Hello,

    Please add this snippet to the Theme settings > Custom CSS > Custom CSS for tablet/ Custom CSS for mobile landscape /Custom CSS for mobile

    .product-grid-item .product-information .fade-in-block .woodmart-buttons .woodmart-add-btn>a:before {
	height: 40px;
	width: 100%;
    background-image: url(https://www.outlet.viajes/wp-content/uploads/2018/09/icono-avión-movil.png);
}

    Best Regards

    September 27, 2018 at 7:15 pm #79523

    amaury_santillan
    Participant

    I did it.

    Still not working thoug.

    September 28, 2018 at 6:17 am #79585

    Artem Temos
    Keymaster

    Sorry, try to replace with the following code

    body .product-grid-item .product-information .fade-in-block .woodmart-buttons .woodmart-add-btn>a:before {
	height: 40px;
	width: 100%;
	background-image: url(https://www.outlet.viajes/wp-content/uploads/2018/09/icono-avión-movil.png);
}
  • Author
    Posts
Viewing 16 posts - 1 through 16 (of 16 total)