Illustration des sites clé en main
MEP Aout 2024

Mise en production du 13/08/2024

Mise en production d'évolutions et de correctifs pour les sites clé en main ezplatform (internets et intranets)

Les nouveautés : ajout de widgets dans la barre de menu de l'éditeur de texte

Ces widgets sont accessibles dans les zones de texte riche (Texte, Voir aussi, Contact) dans le menu affiché après avoir cliqué sur le "plus" 

Insertion d'une galerie d'images 

icône plus
widget-galerie.jpg

Après avoir cliqué sur l'icône "Galerie" une fenêtre de configuration s'affiche pour :

widget-galerie-config.jpg
  • Saisir l'url du dossier contenant les images. Pour ce faire sélectionner, dans l'onglet "Media", le folder contenant les images et faire un copier/coller de l'url. Attention supprimer "admin-" dans l'url afin de ne pas être redirigé vers le back-office.
  • Sélectionner la taille d'affichage de l'image qui s'affiche  dans le texte : l'ensemble des images défilera dans une popup et éventuellement saisir une légende pour indiquer que l'image est cliquable
  • Activer ou désactiver le défilement automatique des images et définir sa durée 

 

Un exemple

 

Afficher un texte au format "Plié / Déplié" (texte en accordéon) 

icône plus
widget-menu-depliant.jpg

Une première fenêtre s'ouvre pour saisir le texte qui s'affichera par défaut ou texte replié : ce texte a un format défini qui n'est pas modifiable.

widget-texte-plie.jpg

Après avoir sauvegardé, cliquer sur le crayon sous fond bleu du  widget de type "accordéon" afin de saisir le texte qui s'affichera au format déplié. Ce texte est de type "Texte riche" : vous pouvez le mettre en forme avec les différentes barres de menu.

widget-texte-deplie.jpg

Voir ci-après la restitution en front-office

Pour améliorer la performance de votre site web, vous devez optimiser les images avant de les importer dans la médiathèque. Quelques règles ci-après :

  • Résolution de 72dpi ou 96dpi maxi
  • Taille  de l'image : elle doit correspondre à la taille d’affichage la plus importante sur le site ainsi vous éviter toute déformation / pixellisation. Exemple : pour le bandeau de la page d'accueil
    • largeur : 2000 px pour un affichage desktop
    • hauteur : de 300 à 500 px suivant le format d'affichage prévu
  • Poids de l’image : il doit être, de préférence, inférieur à 300Ko. Pour alléger une image, l’enregistrer pour un affichage web :
    • au format jpg ou jpeg  pour une image plus légère
    • au format png si vous devez gérer la transparence
    • au format gif pour une image animée

Un menu déroulant vous propose plusieurs tailles d'affichage de l'image. Cette taille est fonction du support utilisé (écran desktop, tablette, smarphone)

Exemple : pour un écran 27 pouces

  • Référence : largeur maxi =  600 px -  hauteur maxi = 600 px
  • Small : largeur maxi =  100 px -  hauteur maxi = 100 px
  • Tiny : largeur maxi =  30 px -  hauteur maxi = 30 px
  • Medium : largeur maxi =  200 px -  hauteur maxi = 200 px
  • Large : largeur maxi =  300 px -  hauteur maxi = 300 px
  • Gallery : largeur maxi =  1200 px -  hauteur maxi = 1200 px
  • Original : taille à son format original

Insérer une enquête Limesurvey

Vous pouvez désormais afficher au sein d'une page, un sondage LimeSurvey créé dans les environnements INRAE :  internet (sondages.inrae.fr) ou intranet (sondages.intranet.inrae.fr).

Un sondage créé dans l'espace intranet ne s'affichera pas dans un site internet.

Le widget utilisé est "Inclure un contenu externe

icône plus
icône inclure du contenu externe

4 champs sont à renseigner dans la fenêtre modale qui s'affiche : le titre, les largeur et hauteur de la zone d'affichage et l'url du sondage.

Restitution en front office suivant la configuration de l'enquête Limesurvey

Pour ne pas afficher le bandeau d'entête avec le logo INRAE ainsi que le pied de page de votre questionnaire, sélectionnez le modèle "Template INRAE pour iframe" dans la section "paramètres généraux du questionnaire" de l'interface d'administration de Limesurvey.

Iframe Limesurvey BO

 

Iframe Limesurvey FO (template par défaut "INRAE standard II")
Rendu de l'affichage avec la template par défaut "INRAE Standard II basé sur Fruity"
Iframe Limesurvey FO (template "INRAE pour affichage dans iframe")
Rendu de l'affichage avec la template "INRAE pour affichage dans iframe"

Pour afficher un sondage créé dans un environnement hors INRAE, veuillez déclarer un ticket Ariane.

Visualiser un document PDF dans une page du site

Tout fichier pdf présent dans l'onglet "Média" du site peut être affiché au sein d'une page.

 Le widget utilisé est "Inclure un contenu externe

icône plus
icône inclure du contenu externe

4 champs sont à renseigner dans la fenêtre modale qui s'affiche : le titre, les largeur et hauteur de la zone d'affichage et l'url fichier pdf à visualiser.

Récupération de l'url du fichier : sélectionner, dans l'onglet "Media", le fichier pdf et faire un copier/coller de l'url. Attention supprimer "admin-" dans l'url afin de ne pas être redirigé vers le back-office.

 

Intégrer dans une zone texte 2 ou 3 colonnes 

icône plus
widget-colonnes.jpg

Une fenêtre avec un menu déroulant vous permet de choisir le type d'affichage : 2 ou 3 colonnes. Après avoir sauvegardé votre choix le widget "Colonnes" s'affiche.

1e cas : pas de texte mis en forme dans chaque colonne

  • pour activer la saisie du texte cliquer sur l'icône "crayon" sur fond bleu
  • chaque paragraphe de texte va se positionner dans une colonne

En back-office

bo-colonne-texte-brut

À noter : au sein d'un paragraphe, vous pouvez insérer un lien, appliquer un style (gras, italique, souligné, exposant...)

En front-office

fo-colonne-texte-brut

2e cas : mise en forme dans chaque colonne

  • dans le widget "Colonnes" créé (sélection de 2 ou 3 colonnes), cliquer sur l'icône "crayon" sur fond bleu
  • créer un nouveau widget de type colonne et cette fois-ci sélectionner "Désactivé" dans le menu déroulant
  • dans le nouveau widget créé vous pouvez saisir du texte mis en forme : plusieurs paragraphes, format de titre, insertion d'image... : ce contenu s'affichera dans une colonne
  • renouveler l'opération dans le widget d'origine

Restitutions

En back-office

bo-colonne-texte formate

En front-office

fo-colonne-texte formate

Les évolutions

  • Ajout des  champs 'Chapeau' et 'Image - Vignette' pour les contenus de type formulaires ("Form") afin d'améliorer leur affichage en vue réduite. Attention : pour les formulaires existants, renseigner ces champs car le texte du descriptif, initialement affiché au format réduit, ne paraitra plus
    Le texte du champ "Description" apparait en en-tête du formulaire à renseigner
fo-champs-intrecalaires-form
  • Ajout des champs "Titre" (format H3) et "Texte d'information" (texte brut) dans les formulaires : ces deux champs vous permettent de partitionner votre formulaire
    Exemple de restitution :

     
  • Possibilité pour les rédacteurs de créer des objets 'Portrait' et 'Personnes'
  • Les images 'Vignette' des articles, événement, formulaire et dossiers affichés dans format "List" sont désormais cliquables
  • Nombre d'images affichés dans les diaporamas augmenté de 25 à 9999
  • Suppression de la date pour les formats "List" des articles, formulaires et des dossiers
  • Possibilité d'ouvrir le lien d'un objet de type 'Logo image' dans le même onglet ou dans un nouvel onglet
  • Partage de page web : ajout d'un nouveau bouton de partage regroupant Facebook, LinkedIn, X et envoi de mail pour les sites internet. En intranet seul l'envoi de mail est affiché.
  • Révision du filtre par date de début/fin sur la page actualités

 

Les correctifs

  • Affichage du captcha des formulaires : suppression du cache des pages contenant un captcha pour assurer une visibilité correcte de celui-ci
  • Suppression, en back-office, du champ "Période de visibilité" (date début/fin), issu de la version précédente (ezpublish), sur le type de contenu "- Article"
  • Suppression, en back-office, dans les formulaires de saisie des articles, dossiers et rubriques, du champ "Copyright de l'image" devenu inutile : le copyright est un attribut du fichier Image 
  • Conversion des objets de type "images" dans les sites migrés (issus de la version ezpublish) en "- images" afin d'harmoniser ce type de contenu et de corriger les droits des gestionnaires sur toutes les images
  • Amélioration de la fluidité lorsqu'on fait défiler les sous-éléments d'une page : seul l'affichage de cette partie est actualisé au lieu de recharger la page entière
  • Remplacement du nom affiché dans le sujet du mail de confirmation d'inscription aux actualités : l'identifiant du site va s'afficher