Payment Field: Adjusting Product Image Size

  • Profile Image
    SFDCERT
    Asked on July 18, 2013 at 01:27 PM

    Is there any way to modify that image size on the Payment Wizard via the wizard itself?  

    Currently you have to get the embed code and then tweak it manually.

    By tweaking the code, it makes us then have to alter that embed code every time we add a product - changing every image size from the standard 50x50 to our chosen larger size 100x100.

    Is there a way in the wizard to add a step  that would give us the option as to what size the image will be and apply that across the code?  It would save us TONS of time by then letting us use the simple jotform link to the form instead of having to copy the embed code, find and replace all instances of 50x50 with 100x100 then ebedding that code.

    Thanks!

  • Profile Image
    jefreylandicho
    Answered on July 18, 2013 at 03:13 PM

    Unfortunately, there is no way you can adjust the product images using the Payment wizard at the moment. However, you can adjust all the product images automatically by injecting the custom CSS below in your form style. 

    .form-product-item img { height:100px; width:100px; }

    By adding the CSS code, all the product images will have the same size automatically. and  you only need to add the CSS code once. To inject a custom CSS in your form styles, go to Setup & Embed -> Preferences -> Form Styles

    If you would like to request the feature of adding an image size option form the payment field, please create a separate thread containing all the details of your request. We can then forward that thread to our developers to consider your request.

    If you need further assistance, please contact us again

  • Profile Image
    SFDCERT
    Answered on July 18, 2013 at 04:28 PM

    "If you would like to request the feature of adding an image size option form the payment field"

    ...thats exactly what I'm looking for - only because using the inject code only lets me have one product size, and I need to have two or three sizes depending on the object.

    I'll start another thread with the request.

  • Profile Image
    txforesttrail
    Answered on September 13, 2016 at 05:51 PM

    I had the same problem.

    I wanted all my products the same width but with various heights, so I adapted the css.

    It works great!

     

    .form-product-item img { height:auto; width: 400px; }