Home › Forums › WoodMart support forum › Change quick view icon

Change quick view icon

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • June 30, 2020 at 8:54 am #207498

    jc
    Participant

    Hi there,

    I want to change the quick view button icon with another custom icon.
    Can you please help me?

    thanks in advanced

    June 30, 2020 at 10:12 am #207516

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    To change the quick view button on the products you need to add the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

    .product-grid-item .wd-action-btn.wd-quick-view-btn > a::before {
content: "\f125";
font-family: "woodmart-font";
}

    Best Regards.

    July 4, 2020 at 2:57 pm #208622

    jc
    Participant

    Hi there,

    i have allready insert the above custom css in my theme setings, but when i try to change “\f125” in to something like “\f333”, i got the attached image below.

    Any ideas?

    Attachments:
    You must be logged in to view attached files.
    July 6, 2020 at 6:15 am #208818

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I saw the screenshot you attached. You need to replace the font family of the icon in the CSS as well to make it work.

    From which website are you trying to use icons from??

    Because, Only font awesome 4.70 icons are supported. https://fontawesome.com/v4.7.0/

    Best Regards.

    July 6, 2020 at 3:36 pm #208996

    jc
    Participant

    Hi again,

    well i try to do what you are adviced me but i get the same issue.
    I want to replace with the “eye” icon font so i move to font awseome icon web page (https://fontawesome.com/v4.7.0/icon/eye) and i took Unicode: f06e.

    Then i move to my Theme settings> custom css and i insert the following css:

    .product-grid-item .wd-action-btn.wd-quick-view-btn > a::before {

    content: “\f06e”;

    font-family: “woodmart-font”;

    }

    After clear cache i got the same issue.
    So, whats wrong?

    July 6, 2020 at 3:38 pm #208998

    jc
    Participant

    Maybe i have to change and the line:

    font-family: “woodmart-font”;

    with something else…is thats right?

    July 7, 2020 at 6:09 am #209098

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    As I mentioned in my previous reply you need to replace the font-family as well to “fontawesome”. Then clear cache and check back.

    Note: Our theme supports only a set of icons of font awesome. If you want to use all the icons then you need to import the library manually only then you can use all the icons.

    Best Regards.

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)