Module "Fichiers"

Sommaire

Tout fichier devant apparaître dans une page (par exemple : une image que vous souhaitez accoler à un texte en guise d'illustration ; ou un formulaire que vous souhaitez proposer de télécharger aux internautes) doit préalablement être stocké dans Typo3, sans quoi il ne pourra pas être publié sur votre site.

Le module "Fichiers" est l'espace mis à votre disposition pour effectuer cette opération de stockage. C'est en quelque sorte un disque dur en ligne sur lequel vous pouvez enregistrer tous les fichiers dont avez besoin pour "garnir" les pages de votre site web.

L'espace disponible dans ce module est illimité. En revanche, les fichiers stockés ne peuvent dépasser un poids unitaire de 64 Mo (ce qui représente une valeur considérable pour tout fichier utilisé sur un site web).

Physionomie générale du module

Comme évoqué dans le tutoriel précédent :

L'interface d'administration du module "Fichiers" est découpée en 3 colonnes :

Colonne 1 : Liste des modules d'administration (ici : c'est le module "Fichiers" qui est sélectionné)
Colonne 2 : Arborescence des dossiers contenus dans le module "Fichiers" (ici : c'est le dossier "Equipes_de_recherche" qui est sélectionné)
Colonne 3 : Contenu du dossier sélectionné dans la colonne 2 (ici : on peut voir 2 fichiers PDF)

TYPO3 version 4.5 - Interface de gestion des fichiers

Options présélectionnées :

Dans la colonne 3, on constate que 3 options peuvent être cochées ou non :

Vue avancée

Cette option affiche (à droite de chaque fichier listé dans la colonne 3) un jeu d'icônes permettant d'agir directement sur le fichier en question.

TYPO3 version 4.5 - Vue avancée des fichiers

1. Renommer le fichier
2. Obtenir des informations relatives au fichier (poids, dimensions, etc...)
3. Copier le fichier (pour le dupliquer)
4. Couper le fichier (pour le déplacer dans un autre dossier)

Afficher les miniatures

Cette option permet de visualiser un aperçu (de petite taille) pour tous les fichiers de type "image" (JPEG, PNG, GIF, etc...). Elle permet également de visualiser la page de garde de la plupart des fichiers PDF.

TYPO3 version 4.5 - Affichage des miniatures de fichiers (image ou PDF) — Ici : L'option "Afficher les miniatures" permet de prévisualiser la miniature d'un document appelé GEOTHERMIE_2012.pdf.

Afficher le presse-papiers

Cette option permet de visualiser le presse-papiers du module "Fichiers". Cet outil doit impérativement être affiché si on souhaite déplacer (couper) ou supprimer plusieurs fichiers (voir plus bas "Utiliser le presse-papiers").

TYPO3 version 4.5 - Affichage du presse-papiers

À noter :

Par défaut, le presse-papiers est affiché dans sa version "standard". Il s'agit du presse-papiers normal (qui ne permet de copier ou couper qu'un seul fichier à la fois). Il est toutefois possible de couper plusieurs fichiers à la fois. Il faut alors utiliser l'un des 3 presse-papiers avancés disponibles (presse-papiers N°1, N°2 ou N°3).
Ces 3 options étant particulièrement utiles, il est recommandé de ne pas les décocher.

Rappel - Clic sur un élément : nom vs/ icône

Comme évoqué dans le tutoriel précédent :

1) Un clic sur le nom d'un dossier (dans la 2^ème colonne de l'interface) affichera systématiquement le contenu de ce dossier dans la 3^ème colonne :

TYPO3 version 4.5 - Clic sur le nom d'un dossier

2) Un clic sur l'icône d'un dossier fera apparaître un menu déroulant (dans lequel sont listées toute une série d'actions permettant d'agir directement sur le dossier en question). Par exemple, renommer ou supprimer ce dossier :

TYPO3 version 4.5 - Clic sur l'icône d'un dossier

NB : L'apparition de ce menu contextuel se produit tout aussi bien avec un clic gauche qu'avec un clic droit.

Créer un nouveau dossier

Comme indiqué plus haut, un clic sur le nom d'un dossier (dans la 2ème colonne de l'interface) affiche systématiquement le contenu de ce dossier dans la 3ème colonne.
Ci-dessous, un zoom sur le contenu du dossier "EDD", à savoir 6 fichiers PDF :

Il est possible de créer un sous-dossier à l'intérieur du dossier dont on en train d'inspecter le contenu. Pour ce faire, il suffit de cliquer sur l'icône représentant un "+" vert : tout en haut de l'interface (plus précisément, à gauche de la barre noire qui surplombe la 3^ème colonne de l'interface).

Un clic sur ce bouton fera apparaître la page ci-dessous :

TYPO3 version 4.5 - Créer un nouveau dossier

Cette page affiche deux champs à renseigner. Ici, seul le premier champ est à prendre en compte : vous pouvez faire abstraction du deuxième ("Créer un nouveau fichier texte") qui ne vous sera d'aucune utilité dans la gestion de votre site. Saisissez le nom du dossier que vous souhaitez créer dans ce champ, puis validez en cliquant sur le bouton "Créer des dossiers".

NB : On retrouve cette même fonctionnalité de création d'un nouveau dossier depuis la 2^ème colonne (arborescence), en faisant apparaitre le menu contextuel du dossier dans lequel on veut créer un nouveau sous-dossier (clic sur l'icône devant le dossier) puis en sélectionnant "Nouveau".

TYPO3 version 4.5 - Nouveau dossier créé !

Votre dossier (ici "Mon_nouveau_dossier") apparaît alors à la fois :

dans l'arborescence de la 2^ème colonne (à l'endroit où vous l'avez créé)
dans la 3^ème colonne (puisqu'il fait désormais partie des éléments contenus dans le dossier "EDD")

À noter :

Même si le nom qui a été saisi dans le champ à renseigner était "Mon nouveau dossier" (à savoir trois mots séparés par deux espaces), le nom définitif du dossier créé est "Mon_nouveau_dossier". Ainsi, les espaces ont été remplacés par le caractère "_" (caractère nommé underscore). En réalité, pour des raisons techniques, Typo3 renomme systématiquement les dossiers qui contiennent des caractères susceptibles de poser problème dans une URL (i.e. l'adresse d'une page internet ou d'un fichier téléchargeable sur un site internet). En effet, certains caractères ne peuvent jamais être utilisés dans une URL. Typo3 les remplacera alors en se basant sur la table de correspondance suivante, en les standardisant :

espace " " -> underscore_
caractère accentué -> caractère équivalent sans accent (par exemple : ù -> u ; ç -> c ; ñ -> n)
tout caractère ne pouvant être standardisé (par exemple : &, %, # -> underscore_ )

Créer plusieurs dossiers à la fois

Il est également possible de créer plusieurs dossiers d'un coup. La procédure à suivre est à peu de choses près la même. On commence donc, de la même manière, par cliquer sur l'icône représentant un "+" vert, tout en haut de l'interface (à gauche de la barre noire qui surplombe la 3^ème colonne de l'interface).

Un clic sur ce bouton fera apparaître la page décrite plus haut. On veillera cette fois à utiliser le menu déroulant qui se trouve à côte de la mention "Nombre de dossiers". Celui-ci permet de créer jusqu'à 10 dossiers à volée.

TYPO3 version 4.5 - Création de plusieurs dossiers

Une fois le nombre de dossiers à créer sélectionné, il suffit de nommer chacun des dossiers en utilisant le champ adéquat :

Il ne reste alors plus qu'à valider en cliquant sur le bouton "Créer des dossiers".

Renommer, déplacer ou supprimer un dossier

À présent que vous disposez d'un nouveau dossier, vous pouvez (comme cela a déjà été expliqué) :

visualiser son contenu en cliquant sur l'intitulé du dossier dans la 2^ème colonne

TYPO3 version 4.5 - Nouveau dossier créé et contenu vide

NB : Sans surprise, ce dossier est vierge de tout contenu. Il vient en effet d'être créé et aucun fichier n'y a encore été déposé. C'est la raison pour laquelle aucun élément n'est listé dans la 3^ème colonne.

faire apparaître un menu déroulant (dans lequel sont listées toute une série d'actions permettant d'agir directement sur ce dossier) en cliquant sur son icône dans la 2^ème colonne

TYPO3 version 4.5 - Un clic sur l'icône laisse apparaître le menu contextuel du dossier

En l'occurrence, nous allons voir ici les différentes options de ce menu contextuel, qui permet de :

renommer un dossier
copier un dossier (mais cela n'a aucun intérêt puisque lorsqu'un fichier est stocké sur le serveur de fichiers Typo3, il n'a pas besoin d'être dupliqué sur ce même serveur !)
couper (= déplacer) un dossier
supprimer un dossier

Renommer un dossier

Parmi les options offertes dans ce menu, il est notamment possible de renommer votre dossier. Un clic sur cette option fera apparaître la page ci-dessous :

TYPO3 version 4.5 - Renommage d'un dossier

Saisissez le nouveau nom que vous souhaitez donner à votre dossier puis cliquez sur sur le bouton "Renommer" pour valider l'opération. Le nom du dossier est alors modifié dans l'arborescence (2^ème colonne) :

TYPO3 version 4.5 - Le dossier est renommé dans l'arborescence

À noter :

Les règles de nommage énoncées plus haut s'appliquent également lorsque vous changez manuellement le nom d'un dossier. Ainsi, il est impossible d'avoir le dernier avec Typo3. Si un ou plusieurs caractère(s) ne conviennent pas, ils seront systématiquement remplacés en se basant sur la table de correspondance suivante :

espace " " -> underscore_
caractère accentué -> caractère équivalent sans accent (par exemple : ù -> u ; ç -> c ; ñ -> n)
tout caractère ne pouvant être standardisé (par exemple : &, %, # -> underscore_ )

Déplacer un dossier ("Couper")

Pour déplacer un dossier, il faut alors utiliser l'option "Couper" dans le menu contextuel.
Une fois le dossier sélectionné comme "Couper", un clic sur l'icône du dossier DANS lequel on souhaite déplacer le nouveau dossier (par exemple : dossier parent "ICube") propose une nouvelle option : "Coller dans"

Un clic sur cette option "Coller dans" permet alors de déplacer le dossier à la racine du dossier mère "ICube". Le nouveau dossier s'intègre alors parmi les autres, au premier niveau d'arborescence :

TYPO3 version 4.5 - Dossier déplacé dans l'arborescence

Supprimer un dossier

De la même manière qu'un dossier peut être déplacé (coupé), il peut également être supprimé en sélectionnant l'option adéquate dans le menu contextuel (dans l'arborescence, clic sur l'icône devant le nom du dossier).

TYPO3 version 4.5 - Menu contextuel d'un dossier

NB : Un dossier contenant des fichiers ne peut pas être supprimé (en effet, en tant qu'éditeur de vos pages web, vous n'êtes pas autorisé à supprimer des éléments de manière récursive). Il faudra donc le vider au préalable sinon vous verrez apparaître le message ci-dessous. Plus loin dans ce tutoriel, nous verrons comment supprimer massivement des fichiers.

TYPO3 version 4.5 - Impossible de supprimer un dossier non vide !

ATTENTION :

toute action de suppression sur le serveur de fichiers est irréversible !
dans certains cas, toute action de déplacement ou de suppression d'un dossier (ou d'un fichier) peut avoir des conséquences sur votre site !

Déposer un ou plusieurs fichier(s) dans un dossier

À présent que nous savons créer des dossiers (et les renommer, déplacer, supprimer), voyons comment les utiliser pour stocker des fichiers (que nous réutiliserons ultérieurement pour garnir le contenu d'une page).

Typo3 utilise le terme « Envoyer des fichiers ». En ce sens, il faut bien comprendre « Envoyer des fichiers depuis votre ordinateur vers le serveur de fichiers Typo3 ». En effet, si l’on souhaite faire appel à un fichier (.pdf, .doc, .xls, fichiers images…) depuis une page web, il faut au préalable que ce fichier soit stocké quelque part en ligne.

Pour déposer un fichier dans Typo3, cliquez sur l'icône en haut à gauche dans la troisième colonne (celle qui présente le contenu) :

TYPO3 version 4.5 - Envoyer un fichier (= déposer un fichier sur Typo3)

NB : On retrouve également cette icône dans le menu contextuel d’un dossier !

Après un clic sur l’icône, deux cas de figure s’offrent à vous, selon la configuration de votre navigateur :

Celui-ci dispose du plugin Flash et propose une fenêtre qui ressemble à cela :

TYPO3 version 4.5 - Envoyer un fichier avec le plugin Flash

Le plugin Flash permet de charger un grand nombre de fichiers de manière plus aisée (Sélectionner les fichiers > sélection multiples de vos fichiers sur l'ordinateur en utilisant CTRL + clic)

Celui-ci ne dispose pas du plugin Flash et propose une fenêtre qui ressemble à cela :

TYPO3 version 4.5 - Envoyer un fichier sans le plugin Flash

Cette option convient pour déposer un ou deux fichiers sur votre serveur Typo3, mais l’opération devient vite fastidieuse si vous devez charger plus de 10 fichiers (exemple : galerie photo contenant 20 ou 30 photos), car vous devrez cliquer sur « Parcourir » puis sélectionner vos fichiers autant de fois qu'il y a de fichiers à déposer !

À noter :

Le plugin Flash manquant de stabilité dans un navigateur, il est courant que celui-ci génère des lenteurs voire des arrêts complets du navigateur (« Mozilla Firefox ne répond plus ») et il est donc conseillé de ne pas l’activer, ou de sélectionner l’option de votre navigateur permettant de l’activer au besoin seulement.
Si vous n’avez que des dépôts ponctuels d’un ou deux fichiers, vous pouvez également configurer votre compte utilisateur Typo3 de manière à ce qu’il n’utilise jamais le plugin Flash pour gérer les dépôts de fichiers :

Configuration utilisateur > Édition et fonctions avancées > décocher « Activer le Flash uploader (nécessite Flash 9 +) »

Renommer, déplacer ou supprimer un fichier

Comme pour renommer, déplacer ou supprimer un dossier (étape vue précédemment), il est possible de renommer, déplacer ou supprimer un fichier grâce à l’option dédiée, que l’on retrouve soit dans le menu contextuel en cliquant sur l’icône devant le fichier, soit sur la ligne dudit fichier (bouton disponible si la case « Vue avancée » en bas de votre liste de fichier est activée) :

TYPO3 version 4.5 - Renommer, déplacer (couper) ou supprimer un fichier

Renommer un fichier

Après avoir sélectionné l'option, on retrouve le champ habituel pour renommer un élément dans Typo3 :

À noter :

Plus il y aura de fichiers dans votre dossier, plus il est préférable de les nommer correctement. Cela permet :

de retrouver plus facilement un fichier dans l’arborescence lorsqu’on cherche à l’appeler sur l’une des pages du site
d’effectuer plus facilement des « nettoyages de printemps » parmi votre arborescence de fichiers lorsque ceux-ci deviennent obsolètes

Exemple : dans un dossier « Actualités & agenda », nommer par le même préfixe des fichiers relatifs à un même événement permet de s’y retrouver facilement (ils seront classés par ordre alphabétique dans la fenêtre permettant d’appeler ces fichiers sur vos pages) :

2018-11-05_conference-affiche.jpg
2018-11-05_conference-bulletin-inscription.doc
2018-11-05_conference-programme.pdf

Conseil :

Commencer le nommage par l’année puis le mois puis le jour (format AAAA-MM-JJ) permet de s’y retrouver facilement et de savoir si un fichier a toujours vocation à rester sur le serveur ou s'il peut être supprimé !

Déplacer (couper) un fichier

Comme pour déplacer un dossier (étape vue précédemment), il est possible de déplacer un fichier d’un dossier à l’autre, grâce à l’option dédiée, que l’on retrouve soit dans le menu contextuel en cliquant sur l’icône devant le fichier, soit sur la ligne dudit fichier.
Une fois le fichier sélectionné, celui-ci apparaît dans le presse-papiers pour mémoire :

TYPO3 version 4.5 - Le fichier est sélectionné pour être coupé (déplacé)

TYPO3 version 4.5 - Déplacer le fichier dans un autre dossier

Tout comme pour la gestion des dossiers, copier un fichier n’a pas d’utilité : il est déjà déposé sur votre serveur et sa copie génèrerait un doublon ! Ainsi si le fichier devait être mis à jour sur le serveur, il faudrait le remplacer à deux endroits !

Supprimer un fichier

Comme pour supprimer un dossier (étape vue précédemment), il est possible de supprimer un fichier grâce à l’option dédiée, que l’on retrouve dans le menu contextuel uniquement (le raccourci n’apparait pas dans la ligne du fichier pour éviter toute mauvaise manipulation, l'action de suppression étant irréversible).

L'action de suppression d'un fichier (sur le serveur TYPO3) est irréversible !

Écraser un fichier

Si vous souhaitez remplacer un fichier déjà présent sur le serveur, vous pouvez écraser l’ancienne version, à la seule condition que votre nouveau fichier dispose exactement du même intitulé que l’ancien fichier à remplacer.

Pour ce faire, cliquez sur l’icône « Envoyer un fichier » puis :

si le plugin Flash est activé, pensez à cocher la case "Écraser le fichier" AVANT d'aller sélectionner votre fichier dans l'ordinateur :

TYPO3 version 4.5 - Écraser un fichier avec le plugin Flash

si le plugin Flash n'est pas activé, pensez à cocher la case "Écraser le fichier", avant ou après avoir sélectionné votre fichier :

TYPO3 version 4.5 - Écraser un fichier sans le plugin Flash

Si le fichier existe déjà mais que la case "Écraser le fichier" n'a pas été coché, votre fichier va être dupliqué sur le serveur en rajoutant un _01 dans l'intitulé de votre fichier (exemple : intitule_du_fichier_01.pdf).
Si votre nouvelle version de fichier ne dispose pas du même intitulé ou s'il n'est pas déposé au même endroit que l'ancien fichier, vous aurez donc créé un doublon, et vous devrez recréer les liens vers le bon fichier depuis vos pages web.

Remplacement d'un fichier : subtilité d'une grande importance !

Si vous écrasez un fichier et que celui-ci est appelé sur l'une de vos pages, la modification sera prise en compte OU NON sur vos pages, selon la manière dont vous appelez votre fichier :

si vous appelez votre fichier depuis un bout de texte (en faisant un lien sur un mot ou sur une phrase par exemple), le fichier écrasé sera automatiquement mis à jour sur vos pages.
si vous appelez votre fichier depuis un bloc "Lien vers des fichiers", le fichier écrasé n'aura pas été mis à jour sur vos pages, il faudra nécessairement rééditer le lien depuis le bloc en question.

Utiliser le presse-papiers

Comme dans un environnement numérique habituel, vous pouvez utiliser un presse-papiers virtuel pour garder en mémoire (temporaire) des éléments à copier (dupliquer) ou couper (déplacer).

Ainsi, le presse-papiers de Typo3 affiche une case à cocher à côté de chacun de vos fichiers pour vous permettre des sélections multiples pour copier, couper ou supprimer plusieurs fichiers. En cliquant sur l'intitulé "Presse-papiers n°1", vous verrez apparaître cette case à cocher sur chaque ligne correspondant à un fichier, ainsi que plusieurs nouveaux boutons.

Sélectionner plusieurs fichiers

Une fois le presse-papier activé, vous pouvez :

sélectionner les cases des fichiers souhaités,
utiliser le bouton "Sélectionner tout/rien" pour sélectionner tous les fichiers du dossier (il est également possible de sélectionner tous les fichiers d’un dossier et de désélectionner ensuite certains d’entre eux).

Déplacer plusieurs fichiers

Une fois la sélection faite, utilisez le bouton "Transférer les fichiers sélectionnés dans le presse-papiers", ils apparaitront alors dans le presse-papiers n°1 en bas de la page, et juste au dessus de cette liste de fichiers dans le presse-papiers s'affiche par défaut l'option "Déplacer les éléments".

En allant ensuite dans un autre dossier où les fichiers doivent être déplacés, un bouton "Coller le contenu du presse-papiers" apparait en haut de la même colonne, il suffit de cliquer dessus pour déplacer les fichiers.

Supprimer plusieurs fichiers

Une fois vos fichiers sélectionnés (pas encore déplacés dans le presse-papiers), utilisez le bouton « Supprimer la sélection » en haut de la colonne.

Précautions à observer en cas de renommage, de déplacement ou de suppression d'un fichier

Selon la manière dont vous appelez votre fichier à l'intérieur du site, il faut être attentif aux manipulations sur ce fichier :

si le fichier est appelé depuis un bout de texte (en faisant un lien sur un mot ou une phrase par exemple), le renommage (du fichier ou du dossier qui le contient), le déplacement (dans un autre dossier) ou la suppression du fichier génèreront un lien mort sur votre page web : en effet, en passant par un lien depuis un bloc de texte, le lien créé reprend le chemin d'accès au fichier. Il faudra donc recréer votre lien si vous renommez, déplacez ou supprimez votre fichier.
si le fichier est appelé depuis un bloc "Lien vers des fichiers", ces manipulations n'auront pas d'impact sur votre page web : en effet, en passant par un bloc "Lien vers des fichiers", votre fichier est automatiquement copié dans un dossier du serveur auquel vous n'avez pas accès. Cette copie perdure tant que vous ne rééditez pas ce bloc "Lien vers des fichiers".