Home › Forums › WoodMart support forum › Cart icon the same on wishlist add to cart button

Cart icon the same on wishlist add to cart button

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • April 12, 2018 at 7:07 pm #52253

    nephyhlim
    Participant

    Hi

    how can I make the icon on the mobile wishlist the same as in the header?

    See Picture attached.

    Thanks in advance

    Attachments:
    You must be logged in to view attached files.
    April 13, 2018 at 7:21 am #52300

    Elise Noromit
    Member

    Hello,

    You can change this in Header Builder: http://prntscr.com/j4mvx0

    Please navigate to Woodmart > Head builder http://prntscr.com/iyd2pe

    Choose the proper header type (your current) http://prntscr.com/iyd333

    Modify elements as per your needs: http://prntscr.com/iyd3h3

    Best Regards

    April 13, 2018 at 7:31 am #52302

    nephyhlim
    Participant

    Hey Elise

    sorry I dont want to adjust the icon in the header. I want to adjust it on the Wishlist (on the image attached at the bottom)

    Do you understand what I want to do?

    April 13, 2018 at 9:46 am #52341

    Elise Noromit
    Member

    Hello,

    Please add this CSS code to Theme Settings > Custom CSS > chose the proper width or put in global.

    .woocommerce table.wishlist_table td.product-add-to-cart .add_to_cart:before {
    content: “\f107”;
    }
    If you have any questions feel free to cotnact us.

    Best Regards

    April 13, 2018 at 7:00 pm #52444

    nephyhlim
    Participant

    Hi Elise

    that did not work sadly ;-(- I attached an image, developer console gives an error cant update cart – maybe that has to do with it?

    April 13, 2018 at 7:01 pm #52445

    nephyhlim
    Participant

    again the image

    Attachments:
    You must be logged in to view attached files.
    April 14, 2018 at 8:07 am #52486

    Elise Noromit
    Member

    Hello,

    The console errors are never caused by CSS.

    I have checked the code provided try to use other icon code 

    .woocommerce table.wishlist_table td.product-add-to-cart .add_to_cart:before {
   content: "\f120";
}

    Also, put it not only to mobile but also to Custom CSS for mobile landscape and Custom CSS for tablet fields of custom CSS otherwise it will appear only on small devices.

    Best Regards

    April 14, 2018 at 8:29 am #52489

    nephyhlim
    Participant

    Hey Elise

    awesome that worked better, but how can I center align the icon and “add
    to cart text” on the right to the icon?

    I attached an image

    Attachments:
    You must be logged in to view attached files.
    April 14, 2018 at 4:36 pm #52539

    Elise Noromit
    Member

    Hello,

    In order to align icon in the middle correct the provided custom CSS

    .woocommerce table.wishlist_table td.product-add-to-cart .add_to_cart:before {
   content: "\f120";
   display:block;
   margin:auto;
}

    Add this CSS to Theme Settings > Custom CSS > Mobile 

    .woocommerce table.wishlist_table td.product-add-to-cart .add_to_cart{
    margin:auto;
}

    Best Regards

    April 14, 2018 at 4:59 pm #52542

    nephyhlim
    Participant

    Hi Elise

    aligning the icon worked, thank you!

    But how do I add “add to cart text” on the right to the icon?

    April 15, 2018 at 7:30 am #52566

    Elise Noromit
    Member

    Hello,

    In order to add this text, you will need to customize files of Wishlist plugins, in addition, it will require more CSS to ensure a good view. Our support can provide minor CSS modification however we do not change the structure of third parties plugins templates.

    Best Regards

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