Le Blog de Teamy

En route pour l'école 2.0 avec Microsoft 365 Education

Microsoft 365Microsoft ListsSharePointTeams

Cahier de communications dans Teams


Dans vos classes Teams, l’onglet des publications vous permet un échange constructif et collaboratif avec vos élèves. Mais il est difficile d’utiliser ces publications pour avoir une communication structurée et unidirectionnelle avec vos élèves.

Je vous propose dans cet article de construire un outil qui se rapproche plus d’un cahier de communication que l’on peut trouver dans un journal de classe.

– Les publications sont structurées par date
– Les publications sont liées à une catégorie (Information, Travail, Contrôle, etc …)
– Chaque publication peut avoir des documents en pièce jointes
– Vous pouvez faire évoluer votre publications via des commentaires
– Vous pouvez attirer l’attention de vos élèves en définissant des publications importantes
– La visualisation des publications est conviviale et structurée

Microsoft Lists

Nous allons utiliser Microsoft List pour héberger notre cahier de communication.

Remarque : Pour le nom de la liste, je vous invite dans un premier temps, à y mettre l’intituté de votre classe.
Exemple : JDC – Communications – Classe de SG1A

On va maintenant ajouter quelques colonnes.
Merci de respecter scrupuleusement les noms des colonnes que je propose
On va aussj ajouter une colonne existante dans toute liste, ‘Pièces Jointes’

 

 

Adaptation visuelle de la vue

Pour un rendu propre, nous allons faire quelques adaptations à la vue de cette liste ‘Tous les éléments’
On va jouer avec la colonne ‘Date’

Ne pas oublier de sauvegarder cette vue, avec les adaptations faites.  Au moment de la sauvegarde, on ne change pas le nom de la vue.

On passe maintenant à la mise en forme de la vue, mode avancé

Dans la zone de texte pour le mode avancé, on vient coller le code ci-dessous

				
					{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/view-formatting.schema.json",
    "commandBarProps": {
      "commands": [
        {
          "key": "automate",
          "hide": true
        },
        {
            "key": "export",
            "hide": true
        },
        {
          "key": "alertMe",
          "hide": true
        },
        {
          "key": "manageAlert",
          "hide": true
        },
        {
          "key": "copyLink",
          "hide": true
        },
        {
          "key": "versionHistory",
          "hide": true
        },
        {
          "key": "integrate",
          "hide": true
        }
      ]
    },
    "hideSelection": true,
    "hideColumnHeader": true,
    "rowFormatter": {
      "elmType": "div",
      "style": {
        "vertical-align": "top",
        "padding": "1px",
        "align-items": "normal"
      },
      "attributes": {
        "class": "sp-row-card"
      },
      "children": [
        {
          "elmType": "div",
          "style": {
            "vertical-align": "top",
            "height": "100%",
            "text-align": "left",
            "float": "left",
            "display": "flex",
            "flex-wrap": "wrap",
            "flex-direction": "column",
            "align-items": "center",
            "min-width": "150px",
            "min-height": "50px",
            "border-radius": "2px",
            "margin-bottom": "1px",
            "margin-top": "1px"
          },
          "children": [
            {
              "elmType": "div",
              "style": {
                "font-weight": "bold",
                "font-size": "14px",
                "margin-left": "0px",
                "color": "=if([$Important],'red','')"
              },
              "txtContent": "=[$Sujet]"
            },
            
            {
              "elmType": "div",
              "style": {
                "font-weight": "normal",
                "font-size": "12px",
                "margin-left": "0px"
              },
              "txtContent": "=toLocaleDateString([$Date])"
            },
            {
              "elmType": "div",
              "style": {
                "display": "flex",
                "position": "relative",
                "bottom": "2px",
                "margin-bottom": "1px",
                "vertical-align": "bottom",
                "flex-wrap": "wrap",
                "align-items": "stretch",
                "flex-direction": "row",
                "padding": "5px",
                "margin": "1px",
                "cursor": "pointer"
              },
              "children": [
                {
                  "elmType": "div",
                  "style": {
                    "position": "relative",
                    "height": "36px",
                    "width": "32px"
                  },
                  "customRowAction": {
                    "action": "defaultClick"
                  },
                  "attributes": {
                    "class": "=if([$_CommentCount]>0,'ms-fontColor-themePrimary','ms-fontColor-neutralTertiary')",
                    "title": "Commentaires"
                  },
                  "children": [
                    {
                      "elmType": "div",
                      "style": {
                        "font-size": "24px"
                      },
                      "attributes": {
                        "iconName": "ActionCenter"
                      }
                    },
                    {
                      "elmType": "div",
                      "txtContent": "=if([$_CommentCount],if([$_CommentCount] > 999, '1k+', [$_CommentCount]),0)",
                      "style": {
                        "position": "absolute",
                        "width": "24px",
                        "text-align": "center",
                        "font-size": "12px",
                        "top": "1px"
                      }
                    }
                  ]
                },
                {
                  "elmType": "div",
                  "attributes": {
                    "iconName": "Link",
                    "class": "ms-fontColor-neutralPrimary ms-fontColor-themePrimary--hover",
                    "title": "Pièces Jointes"
                  },
                  "customRowAction": {
                    "action": "defaultClick"
                  },
                  "style": {
                    "text-decoration": "none",
                    "border": "none",
                    "background-color": "transparent",
                    "font-size": "24px",
                    "cursor": "pointer",
                    "display": "=(if([$Attachments]=='1','flex', 'none'))",
                    "flex-grow": "1",
                    "flex": "10%",
                    "flex-direction": "column",
                    "flex-wrap": "nowrap",
                    "text-align": "left"
                  }
                }
              ]
            }
          ]
        },
        {
          "elmType": "div",
          "style": {
            "text-align": "left",
            "border-left": "2px solid rgba(200, 200, 200, 0.5)",
            "padding-left": "2px",
            "vertical-align": "top",
            "padding": "0px",
            "height": "80px",
            "align-items": "left"
          },
          "children": [
            {
              "elmType": "div",
              "style": {
                "font-weight": "normal",
                "cursor": "pointer",
                "font-size": "16px",
                "margin-left": "10px"
              },
              "txtContent": "=[$Title]",
              "customCardProps": {
                "formatter": {
                  "elmType": "div",
                  "style": {
                    "display": "inherit",
                    "width": "900px",
                    "padding-right": "10px"
                  },
                  "children": [
                    {
                      "elmType": "div",
                      "style": {
                        "padding": "10px"
                      },
                      "children": [
                        {
                          "elmType": "div",
                          "style": {
                            "padding": "0px 5px",
                            "display": "inline-block"
                          },
                          "attributes": {
                            "iconName": "ReadingMode",
                            "class": "ms-fontSize-24"
                          }
                        },
                        {
                          "elmType": "div",
                          "txtContent": "=[$Title]",
                          "style": {
                            "padding": "0px 5px 5px 5px",
                            "display": "inline-block",
                            "white-space": "nowrap",
                            "overflow": "hidden",
                            "text-overflow": "ellipsis",
                            "width": "650px"
                          },
                          "attributes": {
                            "class": "ms-fontSize-24 ms-fontWeight-semibold",
                            "title": "[$Title]"
                          }
                        }
                      ]
                    },
                    {
                      "elmType": "div",
                      "children": [
                        {
                          "elmType": "div",
                          "txtContent": "[$Contenu]",
                          "style": {
                            "padding": "0px 10px 10px 5px",
                            "margin-left": "35px",
                            "display": "inline-block",
                            "max-width": "900px",
                            "max-height": "1200px",
                            "overflow": "auto"
                          }
                        }
                      ]
                    }
                  ]
                },
                "openOnEvent": "click",
                "directionalHint": "topCenter",
                "isBeakVisible": true
              }
            },
            {
              "elmType": "div",
              "style": {
                "font-weight": "lighter",
                "font-size": "14px",
                "margin-top": "10px",
                "margin-left": "5px",
                "padding": "0px 10px 10px 5px",
                "max-height": "25px",
                "display": "inline-block",
                "-webkit-line-clamp": "1",
                "-webkit-box-orient": "vertical",
                "overflow": "hidden",
                "width": "900px"
              },
              "txtContent": "=[$Contenu]"
            }
          ]
        }
      ]
    }
  }
				
			

Adaptation des formulaires de la liste

Nos élèves auront un accès en lecture à cette liste, mais pour des questions visuelles, je ne souhaite pas qu’ils puissent lire les données brutes de mes communications. Nous allons donc opérer quelques modifications sur les formulaires d’affichages de SharePoint

En cliquant sur le bouton ‘Nouveau’ de la liste, on fait appraitre le formulaire de création de cette liste.

Modifier les colonnes