Home › Forums › WoodMart support forum › Product attributes disabled attribute customissation on Single product page

Product attributes disabled attribute customissation on Single product page

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 29, 2024 at 12:16 pm #545004

    sohail
    Participant

    HI

    1) I want to customise the color attribute swatches disabled/not available color swatches attaching oon the single product page the Snaps bellow pls check and provide custom CSS for the same

    2) The product grid prices Sale price and regular price on the product archive shop page is not align screenshot attached for the same I want to make it in one line

    February 29, 2024 at 12:20 pm #545005

    sohail
    Participant

    attahed Screenshots

    Attachments:
    You must be logged in to view attached files.
    February 29, 2024 at 3:03 pm #545069

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    01. Go to Products > Attributes > edit attribute > Choose the Disabled swatch style.

    02. Please add the following Custom CSS code to Theme Settings > Custom CSS > Custom CSS for mobile:

     html .wd-product .price, html .wd-product .price > .amount, html .wd-product .price ins > .amount {
    font-size: 13px !important;
    }
.wd-product.wd-hover-fw-button .wrap-price {
    width: 195px;
}

    Best Regards.

    March 1, 2024 at 12:03 pm #545340

    sohail
    Participant

    thank you Aijaz, this worked

    March 1, 2024 at 12:28 pm #545354

    sohail
    Participant

    the first option

    01. Go to Products > Attributes > edit attribute > Choose the Disabled swatch style.

    not has the customisation I am looking for
    its making an X mark i dont want X mark

    Attachments:
    You must be logged in to view attached files.
    March 1, 2024 at 3:46 pm #545437

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

    [class*="wd-swatches"].wd-size-large {
    --wd-swatch-size: 50px !important;
}
.wd-swatch {
    width: 50px !important;
    height: 50px !important;
}

    Best Regards.

    March 2, 2024 at 5:03 pm #545661

    sohail
    Participant

    i Dont want to change the swatch style nor the size I just want the this diagonal line / which appears like this “/ ” on the colors swatch which is not avaible or disabled swatch I want to increase the widht of it or the color of thee same
    it is so thin that it is bearly visible please see aattached snap for example

    Attachments:
    You must be logged in to view attached files.
    March 4, 2024 at 10:53 am #545897

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Try to add the following code snippet to the Custom CSS area in Theme Settings for swatches:

    [class*="wd-swatches"].wd-dis-style-3 .wd-swatch.wd-disabled {
    opacity: 2.4 !important; 
    --wd-swatch-brd-color: var(--brdcolor-gray-500) !important;
}

    For other customization, We use this file woocommerce/single-product/add-to-cart/variable.php for showing single swatches, you can copy this file into the child theme, and customize it.

    Best Regards.

    March 4, 2024 at 12:39 pm #545953

    sohail
    Participant

    thank you so much Aijaz you are an amazing guy thanks a lot

    March 4, 2024 at 1:22 pm #545973

    Aizaz Imtiaz Awan
    Keymaster

    Most Welcome 🙂

    If you do not mind, can you please leave 5 stars rating for our theme by going here: http://themeforest.net/downloads It will allow us to release more updates and provide dedicated support in future. It would encourage our work a lot. If you like our Theme and Support.

    Have a great day 🙂

    Topic Closed.
    Best Regards.

  • Author
    Posts

Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Product attributes disabled attribute customissation on Single product page’ is closed to new replies.