Formulaire Breezinform dans une lightbox élégante

Réduire
X
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [RÉGLÉ] Formulaire Breezinform dans une lightbox élégante

    Bonjour à tous,
    J'ai en projet de déployer plusieurs formulaires Breezingform sur un site, via des liens sur différentes pages. Pour ne pas encombrer visuellement ces pages, l'idée serait d'ouvrir le formulaire concerné dans une lightbox en cliquant sur un lien ou un bouton présent sur la page. J'ai jeté un œil à la démo Fenêtre modale que propose le plugin Up, mais ce n'est pas réellement une lightbox. J'ai également lu que cela pouvait se faire à partir de JCE, en y ajoutant MédiaBox. Mais dans ce cas, comment appeler le formulaire ? Bien entendu, le principe doit être fiable, y compris sur les Smartphones. L'un de vous ici, a t'il déjà eu à faire cela ? Si vous pouvez me mettre sur la voie ... Merci d'avance.
    "Si vous n’êtes pas impliqués émotionnellement dans ce que vous créez, laissez tomber."
    https://www.graphiquedesign-bf.com/

  • #2
    Bonjour GraphiqueDesign.

    JCE permet en effet de charger un formulaire BreezingForms dans une popup mais un formulaire classique semble ne pas fonctionner. les scripts et styles du formulaire ne sont pas chargés dans la popup.

    Il faudrait faire des recherches pour charger ces éléments mais alors ces formulaires ne pourraient pas apparaître ailleurs, hors d'une popup, au risque de charger les scripts et styles deux fois.

    Dès que j'ai un peu de temps, je vais creuser un peu voir si ce type de mise en œuvre est possible.
    Cordialement.
    __
    Eddy !!!
    Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

    Commentaire


    • #3
      Quelque chose comme cela ?
      J'utilise ce système depuis des années, je récupère: le nom de la sortie (fosse22/03/1019) ce qui me permet d'utiliser un seul formulaire par type de sortie, le nom et le mail de l'adhérent.
      C'est un hyper lien sur un lien de menu qui porte la date et le nom de la sortie.
      Ce lien de menu pointe vers un article dans lequel j'appelle le formulaire avec le plugin breezingform. Certifié sur ordi et portable. Je regarde aussi pour joomla 4 avec bootstrap, mais breezingformg n'est full compatible . Le lien est fait avec jce, j'ai un article qui regroupe le lien vers le formulaire , les directives pour la sortie, la liste des inscrits(avec contentbuilder et en pop up aussi)
      Dernière édition par blueberry38 à 24/02/2019, 15h36

      Commentaire


      • #4
        Envoyé par blueberry38 Voir le message
        Quelque chose comme cela ?
        J'utilise ce système depuis des années, je récupère: le nom de la sortie (fosse22/03/1019) ce qui me permet d'utiliser un seul formulaire par type de sortie, le nom et le mail de l'adhérent.
        C'est un hyper lien sur un lien de menu qui porte la date et le nom de la sortie.
        Ce lien de menu pointe vers un article dans lequel j'appelle le formulaire avec le plugin breezingform. Certifié sur ordi et portable. Je regarde aussi pour joomla 4 avec bootstrap, mais breezingformg n'est full compatible . Le lien est fait avec jce, j'ai un article qui regroupe le lien vers le formulaire , les directives pour la sortie, la liste des inscrits(avec contentbuilder et en pop up aussi)
        Ah c'est p'tet la solution. J'ai pas pensé aux formulaires intégré à un article.

        Vais tester ça cette semaine.

        Pour Joomla 4, faudra attendre la version 2 de BreezingForms je crois. Je crois qu'elle est en cours de développement.
        Cordialement.
        __
        Eddy !!!
        Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

        Commentaire


        • #5
          Je pense à une chose.
          Un lien vers le formulaire pourrait peut-être fonctionner si on le paramètre pour que le formulaire se charge en iFrame... à tester.

          _____________________ EDIT _____________________

          Nan, ça va pas…
          Dernière édition par Eddy.vh à 24/02/2019, 20h15
          Cordialement.
          __
          Eddy !!!
          Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

          Commentaire


          • #6
            Chouette !!!
            Je vais regarder tout cela !
            Si je comprends bien blueberry38, il me faut créer un formulaire déployé dans un article à l'aide du plugin Breezinform ou du module en loadposition puis relier cette page à un menu (caché ?) que j'appelle à l'aide de JCE dans une lightbox à l'aide de Médiabox.

            L'avantage est que l'on encombre pas la page, car même si un formulaire peut être stylisé et beau, ça reste un formulaire ! Mais aussi que l'on peut utiliser beaucoup de formulaires selon beaucoup de paramètres mais surtout qu'une fois le formulaire envoyé, on se retrouve sur la même page, au même endroit et on continue la visite ! Je suis vraiment très favorable à ce type de déploiement ! Merci à vous deux ! Et c'est vrai que ce tutorial sera amha souvent consulté sur ton site, Eddy !

            Question naïve mais combien tentante, y aurait-il moyen d'intégrer dans ce formulaire la page 2 pour les remerciements et un script genre ()closeWindow qui fermerait la lightbox après quelques secondes ?
            Dernière édition par GraphiqueDesign à 24/02/2019, 16h52
            "Si vous n’êtes pas impliqués émotionnellement dans ce que vous créez, laissez tomber."
            https://www.graphiquedesign-bf.com/

            Commentaire


            • #7
              Aucune idee, ce sont des choses que je n'ai jamais eu a mettre en oeuvre et que je ne connais donc pas (encore).
              Cordialement.
              __
              Eddy !!!
              Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

              Commentaire


              • #8
                Dans l'article tu appelles ton formulaire (ici sort_levant) par son nom système BreezingForms ets le plugin, les { } sont obligatoires. Un menu caché pointe sur ces formulaire, ouvert en pop up par jce

                {BreezingForms : sort_levant}

                Commentaire


                • #9
                  Bon apparemment il n'y a que l'option de blueberry38 qui fonctionne.
                  Pour la fermeture automatique de la popup, je ne pense pas que ça puisse fonctionner, il faudrait forcer la fonction du côté de JCE et non de BreezingForms je pense…
                  Dernière édition par Eddy.vh à 25/02/2019, 12h25
                  Cordialement.
                  __
                  Eddy !!!
                  Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                  Commentaire


                  • #10
                    Bonnes nouvelles.
                    J'ai pris contact avec Crosstec via leur forum afin de savoir si on peut fermer automatiquement une popup JCE.
                    J'ai eu réponse et ai fait un test sans succès (ouais, la bonne nouvelle arrive plus loin) mais l'option que Mario m'a fournie m'a mis sur une voie parallèle et si je ne parviens pas à fermer cette popup, j'arrive à recharger la page mère, bien sûr, la popup ne recharge pas elle.

                    Dans le formulaire, propriétés avancées, plus d'options, onglet script, script de soumission.
                    Lorsque l'on a une page de remerciement, BreezingForms crée lui-même le code de passage vers cette page à la soumission du formulaire. Le code se présente comme suit :
                    Code:
                    function ff_FORMULAIRE_submitted(status, message){if(status==0){ff_switchpage(2);}else{alert(message);}}
                    Il faut lui ajouter une petite fonction de rechargement de la page mère :
                    Code:
                    setTimeout(function(){window.parent.location.reload();},3000);
                    Pour obtenir au final ce code :
                    Code:
                    function ff_FORMULAIRE_submitted(status, message){if(status==0){ff_switchpage(2); setTimeout(function(){window.parent.location.reload();},3000);}else{alert(message);}}
                    PS : FORMULAIRE dans le script ci-dessus doit être le nom de ton formulaire comme le script automatique l'a généré et 3000 est le délai en millisecondes pour le rechargement de la page, il peut être adapté au contenu afin de laisser au "client" le temps de lire le message de remerciement.
                    GraphiqueDesign likes this.
                    Cordialement.
                    __
                    Eddy !!!
                    Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                    Commentaire


                    • #11
                      Ouawwww !
                      La passion, ça ne trompe pas !
                      J'en suis pas encore à ce stade mais impatient d'y arriver. Je testerais bien également le popup modal de Up qui lui permet de charger directement un modul. En retravaillant légèrement le style ... Le coup de la fermeture automatique, si ça fonctionne, c'est vraiment tip top !
                      "Si vous n’êtes pas impliqués émotionnellement dans ce que vous créez, laissez tomber."
                      https://www.graphiquedesign-bf.com/

                      Commentaire


                      • #12
                        Le problème sera le même je pense, de charger les scripts nécessaires au fonctionnement du formulaire.
                        Ces scripts ne se chargent qu'avec la page sur laquelle le formulaire s'affiche. Il faut donc essayer de paramétrer le module en iFrame.
                        C'est à essayer.

                        La fermeture automatique ? Ben oui qu'ça fonctionne... testé et approuvé.
                        Cordialement.
                        __
                        Eddy !!!
                        Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                        Commentaire


                        • #13
                          Bonjour.

                          Test d'ouverture de module formulaire BreezingForms en popup Modal de lomart.
                          La popup est parfaitement fonctionnelle. La fermeture automatique ne marche toujours pas mais le rechargement de la page se produit sans la popup et remplit donc le besoin.

                          Cette méthodes est encore plus facile à mettre en œuvre que celle de blueberry38 (qui reste toutefois une option envisageable).

                          Il faut une fois encore paramétrer le module pour ouvrir le formulaire en iFrame sous peine de ne pas charger les scripts nécessaire à son fonctionnement.

                          On voit encore la force de ce plugin UP et sa capacité à s'adapter à de très nombreuses situations ! Merci Loic.

                          En revanche, avec la méthode UP, il faut prévoir la hauteur de la popup car si le formulaire est long, elle ne devient pas scrollable. Je vois avec Loic si on peut y faire quelque chose.

                          Si tu souhaites l'utiliser en l'ayant modifiée (css p.ex.), n'oublie pas de dupliquer l'action, la renommer, l'adapter avant les modifs sur cette copie afin d'éviter un écrasement en cas de mise à jour.

                          Encore quelques idées de tuto pour mon site…
                          Dernière édition par Eddy.vh à 26/02/2019, 13h12
                          Cordialement.
                          __
                          Eddy !!!
                          Tutoriels BreezingForms en Français : https://www.breezingforms.eddy-vh.com/

                          Commentaire

                          Annonce

                          Réduire
                          1 sur 2 < >

                          C'est [Réglé] et on n'en parle plus ?

                          A quoi ça sert ?
                          La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                          Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                          Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                          Comment ajouter la mention [Réglé] à votre discussion ?
                          1 - Aller sur votre discussion et éditer votre premier message :


                          2 - Cliquer sur la liste déroulante Préfixe.

                          3 - Choisir le préfixe [Réglé].


                          4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                          2 sur 2 < >

                          Assistance au forum - Outil de publication d'infos de votre site

                          Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                          Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                          Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                          UTILISER À VOS PROPRES RISQUES :
                          L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                          Problèmes connus :
                          FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                          Installation :

                          1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                          Archive zip : https://github.com/AFUJ/FPA/zipball/master

                          2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                          3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                          4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                          5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                          6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                          et remplacer www. votresite .com par votre nom de domaine


                          Exemples:
                          Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                          Télécharger le script fpa-fr.php dans: /public_html/
                          Pour executer le script: http://www..com/fpa-fr.php

                          Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                          Télécharger le script fpa-fr.php dans: /public_html/cms/
                          Pour executer le script: http://www..com/cms/fpa-fr.php

                          En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                          Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                          Voir plus
                          Voir moins

                          Partenaire de l'association

                          Réduire

                          Hébergeur Web PlanetHoster
                          Travaille ...
                          X