Ajouter une icône d'image à mon champ de choix unique

  • monadressemel
    Demandé le 10 décembre 2024 à 09:55

    Bonjour,

    Dans mon formulaire "Commande de Vin Maison Blanche_V_CRYPTO", je souhaites rajouter des images icône dans les lignes situées dans le paragraphe "Choisir une méthode de paiement" :

    • dans la ligne: Crypto Pay Direct
    • dans la ligne: Credit Card, Google Pay ou Apple Pay

    D'avance merci pour votre aide


    Ajouter une icône dimage à mon champ de choix unique Image 1 Screenshot 20

  • Lorevie Jotform Support
    Répondu le 10 décembre 2024 à 13:08

    Hi Francis,

    Thanks for reaching out to Jotform Support. Our French Support agents are busy helping other Jotform users right now, so I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in French, let us know and we can have them do that. But, it might take a while until they're available again.

    Now, coming back to your question, I'll need some time to look into this. I'll get back to you as soon as I can.

    We appreciate your patience and understanding.

  • Lorevie Jotform Support
    Répondu le 10 décembre 2024 à 13:43

    Hi Francis,

    To my understanding, you want to add an image icon to Choisir une méthode de paiement field. Is that right? You can't add an icon to a Single Choice element. As a workaround, I suggest using our Image Radio Button widget. Let me walk you through this:

    1. In Form Builder, click on Add Element on the left side of the page.
    2. From the Widgets tab, search for Image Radio Button. Ajouter une icône dimage à mon champ de choix unique Image 1 Screenshot 40
    3. Click on the Wand icon of the Image Radio Button.
    4. From the General tab, paste the Image URLs of your icon images.
    5. Enter your Image Labels.
    6. Click on Update Widget at the bottom of the page. Ajouter une icône dimage à mon champ de choix unique Image 2 Screenshot 51

    Here's the result:

    Ajouter une icône dimage à mon champ de choix unique Image 3 Screenshot 62 Let us know if you have any other questions.

  • monadressemel
    Répondu le 10 décembre 2024 à 16:07

    Thanks for the solution.

    But how can I do tu use my own icon located on my pc ?

  • monadressemel
    Répondu le 10 décembre 2024 à 16:22

    Not possible to do something like this with CSS for exemple ?

    Ajouter une icône dimage à mon champ de choix unique Image 1 Screenshot 20

  • Frédéric Jotform Support
    Répondu le 11 décembre 2024 à 03:24

    Hi Francis,

    This element is handled by the payment gateways so that it's not possible to customize the icons related to the gateways by the means of CSS. Note also that, as far as I know, it's not possible to use custom CSS to change the content such as source URLs.

    Reach out again if you have any other questions. 

  • monadressemel
    Répondu le 11 décembre 2024 à 03:46

    But how can I do tu use my own icon located on my pc regarding the solution of the jotform support agent Lorevie ?

  • Lorevie Jotform Support
    Répondu le 11 décembre 2024 à 04:20

    Hi Francis,

    Unfortunately, you will need an image URL for this. So you need to search another one on a website and copy the image address like the one below:

    Ajouter une icône dimage à mon champ de choix unique Image 1 Screenshot 70

    If you want to use the image in your pc, you may want to try using our Image Picker Widget. This will let you upload an image from your desktop. Let me walk you through this:

    1. In Form Builder, click on Add Element on the left side of the page.
    2. From the Widgets tab, search for Image Picker. Ajouter une icône dimage à mon champ de choix unique Image 2 Screenshot 81
    3. Click on the Wand icon of the Image Picker widget.
    4. Click on the Trash Can icon of the default image. Ajouter une icône dimage à mon champ de choix unique Image 3 Screenshot 92
    5. Click on Add New Images.
    6. Enter your preferred Image Label.
    7. Click on Choose a File to Upload the image from your desktop.
    8. Click on Save . Ajouter une icône dimage à mon champ de choix unique Image 4 Screenshot 103
    9. Enter your preferred Image Size.
    10. Enter 1 as the Max Selection.
    11. Click on the Update Widget button at the bottom of the page. Ajouter une icône dimage à mon champ de choix unique Image 5 Screenshot 114

    Here's the result:

    Ajouter une icône dimage à mon champ de choix unique Image 6 Screenshot 125 Let us know if you have any other questions.

  • monadressemel
    Répondu le 11 décembre 2024 à 05:27

    Sorry but I can't see your screenshots

  • monadressemel
    Répondu le 11 décembre 2024 à 05:29

    I can see them now...