Tagged: , , ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 27, 2015 at 9:02 pm #479297
    RickLodder

    Hello,

    I was wondering if there is a way to change the size of the input fields on the single product pages of variable products. As you can see in the attached image, the size of these boxes (marked yellow) are very large. This causes that the text before it drops on two lines, which I want to prevent from happening. Do you know a way to do so, because I tried some things that did not work.

    Image2

    In addition, is it possible to show the at to cart button before a customer field out the fields?
    Now the customer has to fill out all the fields before the add to cart button and quantity field shows.
    Is there a default way of showing the add to cart button immediately?

    Kind regards,

    Rick Lodder

    July 28, 2015 at 12:19 am #479368
    Yigit

    Hi RickLodder!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    #top .variations td.label {
    width: 25%;
}

    Best regards,
    Yigit

    July 28, 2015 at 10:58 pm #479938
    RickLodder

    Yigit,

    Thank you very much, it worked perfectly!

    Do you also have a solution for my second question regarding the add to cart button that only shows when all the fields are filled out. Is there a way to show this button when the page is loaded and the customer did not fill out anything?

    Kind regards,

    Rick Lodder

    July 29, 2015 at 2:53 pm #480254
    Yigit

    Hey Rick!

    You are going to need to find a plugin or hire a freelance developer for such customization.

    Cheers!
    Yigit

    April 22, 2016 at 3:55 am #619465
    Latif

    Can we have the Select variations fields set next to each other as well? like instead of one field for every line, make it 2 fields… I have tried tweaking its css but I’m having hard time because it is a table.

    Appreciate your help in advance

    April 22, 2016 at 3:08 pm #619994
    Yigit

    Hey!


    @latif     Please start a new thread and attach a link to your page and a screenshot showing the changes you would like to make.

    Best regards,
    Yigit

    May 6, 2017 at 4:33 pm #788855
    vladbejenaru

    Hello,

    I would like to bring the same topic up. I have added the above custom CSS to Quick CSS in Enfold -> General Styling -> Quick CSS but it has no effect on the input field for the variable products: the width of the td is still 100%.

    Is there any update on the topic?

    Thank you!

    May 6, 2017 at 4:45 pm #788858
    vladbejenaru

    Hello, trial&error is back.

    Actually what I wanted I solved with following quick CSS:

    #top .variations  {
    width: 25%;
}

    in my case I will use variation only with one attribute and I found the full width table too big and not so good looking. right now the width of the table for selecting the variable product is only 25%, similar in size with the number of items and the add to cart which are below… a bit better looking from my perspective.

    cheers!

    • This reply was modified 7 years, 6 months ago by vladbejenaru.
    May 7, 2017 at 6:40 am #789035
    Rikard

    Hi @vladbejenaru,

    Great, glad you found a solution and thanks for sharing, much appreciated :-)

    Best regards,
    Rikard

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.