Installation de Framaforms mais visualisation (mise en page) étrange

On vient d’installer l’applicatif Framaforms sur un petit serveur Yunohost (sur un dispositif Olimex Lime2) mais le rendu de la page semble étrange.

Il semble en effet, que le javascript sur la page ne fonctionne pas. Est-ce une erreur connue ?
La page obtenue correspond exactement à la page du site framaforms.org sans le javascript activé.

En utilisant la console Réseau, les différences de fichiers JS entre le site de Framaforms.org et le site où l’installation a été faite sont visibles ici : https://libre.nohost.me/zerobin/?bca54ffbe3d10663#l+4/qjfkrH0Jcoj99TUdKJZm1GTZEmgMeJw/bhd1P4I=

Est-ce qu’il se peut que l’installation YunoHost-Apps/framaforms n’ait pas inclus le code javascript, où est-ce que l’erreur serait ailleurs ?

D’avance merci pour l’aide, les pistes… :slight_smile:

Bonjour @195,
je n’ai jamais installé Fforms sur YNH et je ne sais pas si le problème peut venir de là, mais est-ce que tu pourrais essayer de rafraîchir les caches Drupal ?
Ça se passe dans le menu d’administration en haut à gauche de la page : https://framapic.org/64gd6oFZy5td/DQFQ2eq2p5Ne.png.

Si ça ne suffit pas à les installer, est-ce que tu pourrais désactiver l’aggrégation des fichiers JS (aller sur /admin/config/development/performance et décocher la case « Agréger les fichiers JavaScript. »), ça devrait permettre d’y voir plus clair dans quels fichiers sont chargés.

Euh… je ne vois pas comment faire cela ? peux-tu m’en dire plus ? :slight_smile:

Comment arriver à ce menu ?

Je pourrai alors suivre ces conseils :slight_smile: :

Je remarque en plus que l’URL suivante : /sites/default/settings.php retourne un résultat vide :frowning:
Pourquoi, est-ce normal ?

Euh… je ne vois pas comment faire cela ?

C’était le sens de la ligne en dessous ^^
Lorsque tu te connecte au compte administrateur de Framaforms (un compte est créé par défaut lors de l’installation) tu auras accès au menu d’administration, sous forme d’une barre sombre en haut de l’écran. Ma capture d’écran te montre le bouton pour vider les caches sur ce menu (j’avoue, j’ai cadré très serré ^^)

Solution alternative pour faire la même chose :

  1. se connecter en admin
  2. naviguer sur /admin/config/development/performance et cliquer sur « Purger les caches » à partir de là.

Tiens-nous au courant !

Je remarque en plus que l’URL suivante : /sites/default/settings.php retourne un résultat vide :frowning:
Pourquoi, est-ce normal ?

Oui, c’est normal : le fichier est sur ton système, mais il n’est pas accessible directement par le web. La raison est simple : il contient des informations sensibles, notamment les informations de connexion à la BDD, et ça, il vaut mieux ne pas le rendre accessible au tout-venant !

Ce que j’avais pas vraiment compris c’était comment se connecter avec le mot de passe créé lors de l’installation…
Mais j’ai compris : il s’agit du couple « admin / [mot_de_passe] » :slight_smile:
Du coup, j’ai réussi à m’y connecter.

J’ai bien vidé les purges comme indiqué et décoché la case « Agréger les fichiers JavaScript » mais j’ai toujours la mise en forme différente de celle du site de Framaforms (rien n’a été amélioré).

Aussi, j’ai essayé de suivre ce qui est écrit ici : https://framagit.org/framasoft/framaforms/-/wikis/Installing-Framaforms#-and-thats-it- avec l’indication check your installation and if your modules are up to date.

J’obtiens alors la copie d’écran suivante :
https://libre.nohost.me/lufi/r/VikJiOuWXQ#x/tG4/kc3Ntj8y799beOlMv4SwPOkqw6lv+Y/nP7gMw=
et en cliquant sur le lien script de mise à jour de la base de données, j’obtiens la copie d’écran suivante :
https://libre.nohost.me/lufi/r/rwNL81d8sZ#FzT/uweRFl3j/bknQR7v3Qp0J4XXgJs9WHhbyd/MUP0=

Est-ce normal ?

Salut à tous,

Avez-vous pu voir / analyser / comprendre mon dernier message ? Je suis toujours en panne avec ce problème de mise en forme :-/

A toute :slight_smile:

Bonjour @195.

Avez-vous vérifié quel fichiers JS sont chargés à présent ? Je m’explique : les fichiers JS avec des noms systèmes illisibles (ex : js_Cg9_Gdvve1ArwcX9MfznTEtMgePHLiAhUpJ3orZNyD4.js) sont des fichiers « aggrégés », c’est-à-dire produits par Drupal à partir de tous les fichiers Drupal à charger, afin de réduire le nombre de requêtes nécessaires par chargement de page (plus de détails ici). Si on désactive l’aggrégation des fichiers JS (et qu’on vide les caches après), on obtient alors les « vrais » fichiers JS, non-aggrégés.

Vous avez aussi dit que

, est-ce que vous pouvez en dire plus précisément sur ce que vous obtenez à l’affichage, et sur le résultat que vous attendiez ? (Ce également afin que nous puissions identifier les fichiers JS manquants.)

J’obtiens alors la copie d’écran suivante :
https://libre.nohost.me/lufi/r/VikJiOuWXQ#x/tG4/kc3Ntj8y799beOlMv4SwPOkqw6lv+Y/nP7gMw=

Le problème lié au module polling n’est pas nouveau et n’est a priori pas la source du problème.
Nous la règlerons très prochainement.

Bonjour @thelem.

Voilà donc les fichiers JS chargés : https://libre.nohost.me/zerobin/?d26e384737150595#935zN+G/vDfSNC2vuXT34WAiToU1k7IanxqNsDbl/Vk=

Il semble que sur https://framaforms.org il existe oui des fichiers agrégés mais d’autres JS (pas présents apparemment sur mon application Framaforms) tels que : nav.js et bootstrap.min.js.
Le problème vient-il de ces 2 fichiers « manquants » ?

Oui, pour activer ou non le javascript sur une page, j’utilise le très sympa add-on Noscript

En ne pas autorisant le JS du site https://framaforms.org on obtient cela : https://libre.nohost.me/lufi/r/42cAWsAoE5#QeYzNpYxsgyaxy7yJ13DWSH1h4p5aSvfmZ8n5U8czZw=, ce qui semble identique à mon visuel de l’application Framaforms.

Ce qui est attendu c’est la page existante du site de l’asso Framaforms lorsque le javascript est autorisé : visible ici https://framaforms.org (quand JS autorisé).

Merci par avance pour l’aide :slight_smile:

Bonjour @195

effectivement il me semble que votre problème vient du fait que le fichier nav.js n’est pas intégré à votre site : il s’agit d’un fichier propre à Framasoft qui permet d’intégrer une même identité graphique sur tous les services de l’association.

Votre site injecte donc bien les fichiers JS, mais il en manque simplement un : nav.js, ce qui explique qu’il manque des classes CSS, par exemple sur le titre de votre site.
Je ne peux pas vous conseiller d’intégrer la nav de Framasoft : cela reviendrait à réutiliser la charte graphique de l’association, et donc à entretenir la confusion « Framaforms = Framasoft » sur votre instance.

Par ailleurs, en dehors de la page d’accueil, le site devrait se comporter normalement, cas les CSS de Framasoft ne sont pas utilisées.

Si vous souhaitez améliorer l’apparence de votre site, il existe plusieurs solutions :

  1. modifier les CSS du thème « framaforms » directement : à partir du dossier racine de votre site, ceux-ci se trouvent dans sites/all/themes/framaforms/css/. Vous pouvez par exemple y rajouter une class .violet et .vert, pour modifier les couleurs du titre par exemple.
  2. utiliser un autre thème par défaut pour votre site : sur votre site, aller sur urldevotresite/admin/appearance, et sélectionner par exemple le thème « Theme responsive standard » en cliquant sur « Définir par défaut ». Cela devrait modifier l’apparence de votre page d’accueil.

Salut @thelem :
il y a, semble-t-il, un problème avec le Carousel qui ne semble pas fonctionner (par défaut).

En essayant de changer de thème (point 2 de ta contribution, et donc sans modifier les CSS), je remarque que le Carousel ne fonctionne qu’avec le thème Bootstrap. J’ai essayé les thèmes suivants qui ne sont pas opérationnels :

  • Frama 7.41 (pas ok)
  • Framaforms Embed 7.41 (pas ok)
  • Theme responsive standard (impossible de changer de slide)
  • et je crois aussi le Bartik 7.69

Est-ce que cela est normal ? est-ce ce comportement est le comportement « par défaut » lorsque l’on installe l’application ?

D’avance merci pour ton support là-dessus.

Salut @195,
après un peu plus de recherche, je suis à peu près sûr que le problème est que des fichiers CSS et JS de Bootstrap ne sont pas chargés.

Donc :

C’est normal. Le caroussel dépend pour fonctionner de fichiers extérieurs au site, qui ne sont donc pas embarqué directement avec Framaforms. Ils sont chargés sur framaforms.org parce que Framasoft a customisé sa propre instance, mais par défaut ils ne sont pas chargés par ton instance.

Non. Pas intentionnellement en tout cas :stuck_out_tongue:

Les solutions maintenant :

  • je viens d’intégrer les fichiers Bootstrap nécessaires dans le code, ce n’est pas encore à 100% testé mais ce sera bientôt intégré dans le code principal du site.
    Après je répète que «je n’ai jamais installé Fforms sur YNH » : je ne sais pas si à l’installation de Forms par YNH tu obtiens la dernière version du code, ni si l’image est très à jour (la procédure d’installation de Framaforms est en train de changer). Le problème est en passe d’être réparé côté Framaforms… mais pas sûr que l’image YNH suive.
    Dans tous les cas, il y a des chances que ça demande une réinstallation de Framaforms de ta part. Mais il faudra que tu vois ça avec ceux qui gère l’image YNH.

  • si tu veux une solutin rapide : tu peux directement modifier ta page d’accueil en ajoutant les deux lignes de HTML suivantes en haut :

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

Concrètement, ça va aller chercher les fichiers CSS et JS sur les serveurs de Bootstrap, ce qui te donnera donc accès aux fichiers sur ton site.
Mais je me dois te retranscrire les avertissements de mes collègues de Framasoft qui sont opposés à cette méthode : elle peut causer pour la vie privée de tes utilisateurs (ton site utilisera un service tiers, et donc tes utilisateurices transmettront fatalement des informations sensibles audit service), de sensibilité à des aléas du réseau, et si un jour Bootstrap décide d’enlever ces fichiers de ses serveurs, tu n’y auras plus accès.

J’espère que ça t’aidera !