How to order multiple items

  • ribbonrides
    Asked on April 18, 2016 at 9:45 PM

    I have a Shirt shop - I'm looking for the easiest way to create a t-shirt order form with paypal integration.  Here's what they need to do.

       Choose a design - then choose the shirt type, color, size and quantity.  I have this worked out fine if they only want one shirt in the chosen design.  But if they want to order more than one in that design it doesn't work.

      Currently I have each design as a separate item for purchase - with the shirt type having a price per type, then they select their color and size.  Now if they want two of that size I can add a quantity button in.  But if they want to order 1 t-shirt and 1 sweatshirt in the same design - it doesn't work.  The way it is setup now, they would have to pay for each item individually.

     

      Solutions?

  • Chriistian Jotform Support
    Replied on April 19, 2016 at 4:55 AM

    I believe you can achieve your requirement by checking the "Create sub-products from this option" check-box on the Style option of the product. To do so, please follow the guide below:

    1. Open the paypal wizard and go to the products section. Click the product that you want to modify and select Add New Option.

    How to order multiple items Image 1 Screenshot 70

    2. Check the Custom Quantity box as seen below and click Next > Finish.

    How to order multiple items Image 2 Screenshot 81

    3. Then while on the product wizard, click the pencil icon beside the "Styles". 

    How to order multiple items Image 3 Screenshot 92

    4. Now check the "Create sub-products from this option" and click Next > Finish to complete the setup.

    How to order multiple items Image 4 Screenshot 103

    5. Do the same to the rest of the products and save them after. 

    6. Once you have setup all the products, the product should look like the image below.

    How to order multiple items Image 5 Screenshot 114

    If the product options are not displayed correctly on your form, you can inject the custom css below to fix it:

    .form-product-item.hover-product-item {

        width: 500px;

    }

    Here's a guide on how to inject css: How To Inject Custom CSS Codes

    How to order multiple items Image 6 Screenshot 125

    You can also check out this cloned form where I applied the necessary changes: https://form.jotform.com/61091487254963

    If you need further assistance, please let us know.