Vue ordinateur et vue portable

Bonjour, finalement nous avançons bien et trouvons des solutions à nos soucis.. Merci pour vos différents guidages.

Nous sommes proches d'une version finale, mais je rencontre encore un petit blocage. Lorsque vous visualisé le formulaire avec un téléphone (avec votre simulation) la deuxième en-tête qui cite "Panier de la semaine..." apparaît sur uniquement une ligne verticale ce qui est quasi illisible. Qu'en pensez-vous. Merci encore.

Hi Sylvia,

Thanks for reaching out to Jotform Support. Unfortunately, our French Support agents are busy helping other Jotform users at the moment. 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, keep in mind that you'd have to wait until they're available again.

Now, let me help you with your question. If you want to display the header horizontally, we can easily do that by injecting a CSS code into your form. Let me show you how:

• In Form Builder, on the right side of the page, click on the Paint Roller icon.
• On the menu that opens, go to the Styles tab.
• Copy and paste the code below to the Inject Custom CSS area.

@media screen and (max-width:480px) { 

.form-section div .hasImage {

  margin: auto;

}

}

• Click on the Save button. That's it.

Give it a try and reach out again if you have any other questions.

Hello LYLA , thanks you, very nice! it's a good job👍

re, Lyla

pour continuer dans nos demandes, merci d'avance pour les requêtes suivantes;

Est-il possible d'activer le choix d'une visualisation soit en grilles (original) soit en ligne comme ceci (voir plus bas)? Et aussi pourquoi dans cette visualisation-ci disparait l'image de fond ?

Dans cette même forme de présentation nous n'arrivons pas non plus à aligner les cases "Quantité, conditionnement, et taille"./

Merci grandement pour vos compétence.

Hi Sylvia,

Thanks for getting back to us. Glad to know that the solution provided by my colleague worked perfectly for you. I understand you want to show the product in a single column and align the options. I cloned your form and tested it to see if I could replicate the issue, and I ran into the same problem. This can be fixed using custom CSS code. Please paste the code below into the Inject Custom CSS area:

/*To align Quantity, packaging, and size - 5506133*/

.form-product-item .form-product-container .form-sub-label-container {

    display: flex !important;

    flex-direction: column;

}

Here's what the result will look like:

Here's the cloned version of the form that you can test.

Please give it a try and let us know how it goes. 

Parfait super merci Afzal, effectivement cela fonctionne sur votre version clonée, mais dans notre version cela ne semble pas fonctionner, je vais essayer plus tard, (il se fait tard ici en France)

Ensuite est-il possible de proposer à nos client le choix de ces deux affichages (colonnes ou lignes) par un bouton en en-tête par exemple?

Nous ne savons pas encore si nous devions choisir laquelle des versions nous leur proposerons.

J'ai basculé la visualisation en 3 colonne , elle très intéressante aussi, mais j'ai relevé un disfonctionnement d'affiche avec la tablette, pas le téléphone (le deuxième cadre s'affiche sur uniquement une ligne) voir les photos ci-après.

Le même soucis à été rencontré plus tôt pour la formule à deux colonne je crois.

Merci beaucoup encore pour ces correctifs.

Hello Sylvia,

Thanks for getting back to us. I understand that you need help with adjusting the layout of the products. Allow me some time to work on it and will reach out again as soon as I have an update.

We appreciate your patience and understanding.

Hi Sylvia,

Thanks for patiently waiting. It seems that you entered the code inside of another code that only activates when the form is viewed on mobile. The code should look like this:

In addition, the Quantity, Packaging, and Size columns will only be aligned on the same row on the Single and 2-column layout that the Product List widget natively provides.

Unfortunately, providing your users with the option to change the layout while filling out the form is not possible. This layout change can only be done within the Product List settings which your users have no access to.

Finally, after fixing the CSS code on a cloned version of your form, I didn't come across the 3-column layout problem on both Tablet and Mobile view. Check the screencast below:

Reach out again if you need any other help.

Merci Gamelle pour toutes ces nouvelles informations, mais je ne résout pas le soucis, ici la comparaison des entrées css :

LYLA, semble avoi résolu le même soucis pour ce même emplacement en affichage téléphone

Autre réglage à amener lorsque nous ouvrons le formulaire (visualisation clientèle), une de nos catégorie (herbes, bulbes..) restes replier et pas les autres, ici l'image :

Merci encore pout tout..

Hi Sylvia, 

Thanks for getting back to us. You can set it to folded or not folded by clicking the Arrow icon on the right side of the category title. Check out the screenshot below:

It will show the same layout when you view it on your builder mode and when it is published.

Reach out again if you have any other questions.