Home › Forums › WoodMart support forum › ADD TO CARD AND BUY NOW BUTTON CHANGES

ADD TO CARD AND BUY NOW BUTTON CHANGES

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • March 22, 2023 at 9:50 pm #453473

    ygzndc
    Participant

    hello,

    i want make ‘add to card’ and ‘buy now’ buttons in product pages fullwitdh buttons. but only for mobile.

    i want add to card to be picture 1 and buy now to be picture 2. (i took these pictures from this link: https://woodmart.xtemos.com/buttons/)

    how can i do that with css?

    thanks a lot!

    Attachments:
    You must be logged in to view attached files.
    March 23, 2023 at 1:18 am #453498

    Elise Noromit
    Member

    Hello,

    Please insert the site admin access into the Private content below the message area. We will take a closer look at the case.

    Best Regards

    March 23, 2023 at 1:34 am #453504

    ygzndc
    Participant

    Sure.

    March 23, 2023 at 2:19 am #453509

    Elise Noromit
    Member

    Hello,

    Could you kindly provide the site URL?

    Best Regards

    March 23, 2023 at 2:54 am #453513

    ygzndc
    Participant

    Hello,

    I did above but sending it again.

    Thanks.

    March 23, 2023 at 5:02 am #453532

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Mobile/Tablet:

    form.cart :where(.single_add_to_cart_button,.wd-buy-now-btn,.quantity) {
    flex: 0 0 100%;
}

    Best Regards

    March 23, 2023 at 1:11 pm #453630

    ygzndc
    Participant

    hello,

    thank you, it works!

    also i wanted to convert them into picture 1 and picture 2 as i mentioned above. is there a way to that? you can see them in attachments in first comment.

    thanks a lot!

    March 24, 2023 at 5:08 am #453769

    Elise Noromit
    Member

    Hello,

    You can configure the main form and colors of the buttons in the Theme settings > Styles and colors > Buttons.

    As soon as you configure it, let us know what to correct.

    If you have any questions please feel free to contact us.

    Best Regards

    March 24, 2023 at 1:04 pm #453853

    ygzndc
    Participant

    Hello,

    i did changes. i just need to make ‘ŞİMDİ SATIN AL’ button (it is buy now button) like picture 2 i shared in the first comment.

    thanks a lot!

    March 26, 2023 at 2:45 am #454165

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    form.cart :where(.wd-buy-now-btn) {
          background-color:white;
	  border:2px solid #000000;
	  color:#000000;
}
form.cart :where(.wd-buy-now-btn):hover {
          background-color:white;
	  border:2px solid #000000;
	  color:#000000;
}

    Best Regards

    March 26, 2023 at 5:40 pm #454226

    ygzndc
    Participant

    hello,

    it works perfectly. only hover effect is missing. can we add hover effect to ‘buy now button’ also?

    thanks a lot!

    March 26, 2023 at 9:05 pm #454255

    Elise Noromit
    Member

    Hello,

    Do you want to have the initial state on hover? https://gyazo.com/d64c6681988eabefdfdb19c6ee3d90ca

    If you want to leave it initial, remove the second CSS block.

    If you have any questions please feel free to contact us.

    Best Regards

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