Translations
Info
All page names need to be in English.
en da  de  fr  it  ja  km  nl  ru  zh

Fr:Introduction/Dummies

From TYPO3Wiki
Jump to: navigation, search

Chapter 1. Typo3 pour les Nuls

Ou comment débuter avec l'utilisation

De ce gestionnaire de contenu Open Source

Quand on y connaît pas grand chose

Copyright 2000-2005, Mathieu VIDAL, <mathaaus.typo3@club-internet.fr>

This document is published under the Open Content License

available from http://www.opencontent.org/openpub/

The content of this document is related to TYPO3

- a GNU/GPL CMS/Framework available from www.typo3.org -

Chapter 2. Sommaire

2.1. Introduction

Le but de ce document est de vous permettre une première approche de Typo3, tant au niveau de son installation que de sa prise en main. Si vous êtes déjà allé dans la section « Débutants » du forum de typo3.fr, ce document essaye en faite d'être une synthèse des questions redondantes (et de leurs réponses) qui bien souvent bloquent et refroidissent les débutants lors de leur première approche de Typo3.

Typo3 c'est quoi? Si vous lisez cette documentation, c'est que vous en avez déjà une petite idée. C'est :

  • un gestionnaire de contenu, on dit aussi CMS, pour Content Management System, c'est à dire un système qui sépare le contenu d'un site de sa présentation, ou encore un système qui permet d'avoir « l'habillage » d'un site d'un coté et le contenu qui va apparaître dans ce site de l'autre. Le principal avantage d'un tel système, c'est qu'il permet de rajouter des informations sur un site sans que le rédacteur ait besoin de s'y connaître en HTML ou PHP,
  • open source sous licence GNU/GPL, c'est à dire dont le code source est consultable et modifiable par tout le monde sous certaines conditions. Le principal avantage d'une tel licence c'est que n'importe qui peut apporter sa contribution au projet, ce qui, aujourd'hui, ce traduit par, par exemple, plus de 800 extensions disponibles mises en ligne par de nombreux auteurs différents,
  • créée par un Danois, Kasper Skaarhoj en 1998, qui est maintenant à la tête de l'association qui gère et fait vivre cet outil.

Dans ce document on trouve quoi? Vous avez lu le sommaire, non?

Le premier chapitre court mais important vous permet de réunir l'ensemble des fichiers dont vous aurez besoin tout au long de votre lecture afin que nous puissions travailler avec les mêmes fichiers. Ensuite, nous attaquerons, la description de l'installation avec dans l'ordre celle du serveur Apache/PHP/Mysql sans lequel vous ne pourrez pas aller très loin, suivit par l'installation d'un package de source de Typo3 puis pour finir l'installation des deux outils graphiques utilisés par Typo3 : Imagemagick et gdlib.

Si vous arrivez au bout de ce premier morceau, vous aurez sur votre ordinateur tout ce qu'il vous faut pour « héberger » et réaliser votre premier site en Typo. Un petit bémol cependant, avant d'obtenir les premiers résultats concrets, quelques recherches seront encore nécessaires pour savoir comment fonctionne ce CMS complexe. Ne voulant pas vous laisser ainsi, avec une installation propre mais sans contenu, j'ai ensuite ajouté le chapitre concernant une première approche des contenus et des templates. Associé au paragraphe suivant, concernant l'utilisation des extensions, vous aurez en main les bases du développement sous Typo3.

Le reste du document sera consacré à un ensemble d'informations qui pourront vous servir tout au long du développement de votre site. Vous y trouverez tout d'abord, une méthode pour transférer un site d'une machine (de développement) vers une autre (de production) et une méthode pour réaliser des montées de version puisqu'en moins de deux ans nous sommes passés de la version 3.5 à la 3.8 et que les nouveautés ont été nombreuses, intéressantes et très utiles. Ensuite, j'ai rassemblé un ensemble de liens vers des sites ou des sujets du forum de typo3.fr que j'ai jugé utile de vous signaler en attendant peut être de les introduire et de les détailler directement dans ce document.

Bonne lecture, et bon apprentissage...

2.2. Les fichiers nécessaires

Afin de vous proposer une documentation précise et fonctionnelle, je vais la baser sur une méthode que j'ai eu l'occasion de mettre en pratique à plusieurs reprises. Les différents outils et packages utilisés étant toujours en évolution, j'essaierai de maintenir la documentation à jour le plus souvent possible. Pour cela, j'utiliserai deux voies : la refonte complète d'un paragraphe pour l'adapter à une nouvelle version d'un outil ou l'ajout de remarques permettant de travailler avec une version plus récente d'un outil, tout en conservant toujours la même méthode.

Avant de commencer, il faut connaître les besoins de Typo3 en terme d'installation. Sur le site officiel typo3.org, on ne trouve aucune précision sur les versions des outils à utiliser, cependant après quelques recherches, j'ai pu trouver les informations suivantes:

  • Il vous faut tout d'abord un serveur web, qui est une application qui va répondre aux requêtes d'un navigateur (Internet Explorer, Firefox...) et qui vous permet donc de mettre vos fichiers web (HTML,PHP...) en ligne. Pour Typo3, c'est Apache qui est utilisé en version 1.3.x ou supérieur.
  • Il vous faut ensuite un serveur de base de données qui va vous permettre de stocker des informations de manière structurée à l'aide d'un enchaînement de tables. Typo3 utilise MySQL dans sa version 3.23.x. Pour la version 3.7 de Typo3, on parle de la nécessité d'utiliser une version 4.0.18 ou supérieur, mais l'information n'a pas été confirmée.
  • Il vous faut également un interpréteur PHP, car contrairement au HTML pour lequel c'est le navigateur du client qui interprète le code, pour le PHP c'est le serveur qui doit faire ce travail avant d'envoyer le résultat au navigateur, et il a donc besoin d'un outil spécifique. Typo3 fonctionne avec une version 4.3.x ou supérieur de PHP. Ici aussi, il faut faire attention, car pour l'instant la nouvelle version de PHP, la 5.x, reste à éviter en attendant une confirmation de son bon fonctionnement avec Typo3.
  • Pour finir, il faut encore rajouter deux bibliothèques graphique qui permettront à Typo3 de gérer tout ce qui est manipulation et transformation d'image : Image Magick et gdlib. Pour Image Magick, la version 4.2.9, qui n'est pas la dernière, est la plus recommandée car étant celle qui fonctionne le mieux, et pour gdlib, je n'ai pas trouvé de recommandation ;-)

Maintenant passons aux choses concrètes en rassemblant l'ensemble de ces outils.

La première chose à faire est de télécharger EasyPHP. Vous le trouverez dans sa version 1.7 à l'adresse suivante : http://www.easyphp.org/mirror/easyphp1-7_setup.exe. Il s'agit d'un exécutable pour windows qui permet d'installer facilement un serveur web : Apache (version 1.3.27), un serveur de base de données MySQL (version4.0.15), un moteur de script PHP(version 4.3.3) et un outil de gestion de base de données : PhpMyAdmin (version 2.5.3). Comme vous pouvez le constater en un exécutable, vous avez l'ensemble des outils nécessaires pour votre serveur et dans les bonnes versions.

Ensuite on récupère les deux bibliothèques graphiques aux adresses suivantes : http://typo3.sunsite.dk/software/windows/imagemagick-win-4.2.9.zip pour Imagemagick 4.2.9 et http://www.boutell.com/gd/http/gd-2.0.15.zip pour gdlib dans sa version 2.0.15.

Pour finir, il ne nous manque plus que nos sources Typo3. Tout d'abord, il faut savoir comment Typo3 est structuré.

Si vous vous rendez sur le site typo3.org à cette adresse : https://typo3.org/download/ vous pouvez constater qu'il vous est proposé 4 packages : Dummy, Quickstart, Testsite et Source dans leur dernière version et au format zip (pour utiliser sous windows) ou tar.gz (pour utiliser sous Linux). Le package Dummy vous permet de commencer un nouveau site à partir d'une base vide (hormis les informations constituants le noyau de Typo) et quelques extensions pré-installées. Le package Quickstart est un site complet associé à la documentation « Débuter avec Typo3 » qui permet aux débutants de prendre en main les fonctionnalités basiques de Typo. Le package Testsite est une seconde étape dans l'apprentissage de Typo par la pratique, puisqu'il s'agit également d'un site complet permettant de tester des fonctions plus avancées que celles trouvées dans le Quickstart. Enfin, le package Source contient les données constituants le noyau de Typo3 car les packages au format tar.gz ne contiennent que les fichiers propres à la structure du site et non pas ceux de l'architecture de Typo3.

Dans cette documentation, j'utilise un package Dummy en version 3.5 que vous trouverez à cette adresse : http://prdownloads.sourceforge.net/typo3/dummy-3.5.0.zip?download.

Vous êtes maintenant parfaitement équipé pour parcourir ce document...

2.3. Installation et configuration d'EasyPHP

Première étape : Installation

Première

Il s'agit d'un exécutable, donc il n'y a pas grand chose à faire :

  • Cliquez sur « Next » sur la page de bienvenue,
  • Acceptez la licence puis cliquez sur « Next »,
  • Ensuite vous arrivez sur cette page et c'est le seul endroit ou votre attention doit être à son maximum :

Intro-dummies-10000000000001F80000018146E22893.png

Afin de supprimer un maximum de problèmes dans votre utilisation de TYPO3, il est très fortement conseillé de choisir un chemin d'accès à easyphp ne contenant ni caractères spéciaux, ni chiffre, ni espace, ni majuscule, à tous les niveaux de l'arborescence, ce qui n'est pas du tout le cas avec le chemin par défaut. Personnellement je l'installe dans C:\easyphp\.

  • Ensuite vous enchaînez les clics notamment quand il demande de créer le répertoire et une fois l'installation lorsque le bouton « Terminer » apparaît.

Une fois l'installation terminée, si vous allez dans votre explorateur de fichier, vous devez avoir cette nouvelle arborescence :

Intro-dummies-1000000000000082000000A57B8BA9EF.png

Le répertoire « www » de l'arborescence d'easyphp est le répertoire partagé, c'est à dire que tout ce qui se trouvera dans ce répertoire sera accessible à partir de votre navigateur internet préféré. S'il s'agit de fichier internet (HTML ou PHP, ils seront interprétés).

Vous pouvez maintenant lancer EasyPHP soit par le menu « Démarrer » soit directement par le easyphp.exe qui se trouve dans le répertoire easyphp. Si tout fonctionne comme il faut, vous devriez avoir un petit E à coté de votre horloge, le point rouge clignotant étant la preuve de son bon fonctionnement :

Intro-dummies-100000000000004B0000001CF2E1ECCA.png

Si vous faites un clic droit sur cet icône, vous accéderez aux fonctions d'EasyPHP, notamment la possibilité d'arrêter, démarrer ou redémarrer le service.

Essayez d'accéder à l'adresse : http://localhost/ dans votre navigateur, vous obtiendrez le résultat suivant, puisque vous n'avez encore aucun fichier en partage.

Intro-dummies-10000000000001FC000000FD0B7923D5.png

Deuxième étape : la configuration de Phpmyadmin

Si vous vous placez dans votre navigateur et que vous tapez : http://localhost/mysql vous devez accéder à PHPmyadmin.

Sur la page d'accueil, un message en rouge vous interpelle vous signalant que vous n'avez pas renseigné la valeur de $cfg['PmaAbsoluteUri'] et que vous n'avez pas de mot de passe ce qui n'est pas très sécurisé. (je n'ai pas le message exact car mon PHPmyadmin est correctement configuré pour le moment).

Première étape, on va rajouter un mot de passe à l'utilisateur par défaut : « root ».

Pour ce faire vous cliquez sur le lien « Privilèges » de la page d'accueil, puis sur « Modifier » de la ligne de l'utilisateur « Root ». En bas de page vous pouvez renseigner un mot de passe (2 fois pour vérifier) puis cliquer sur « Exécuter » pour enregistrer vos modifications.

Deuxième étape, on configure le fichier « config.inc.php » :

  • Vous trouvez ce fichier dans « C:\easyphp\phpmyadmin\ ».
  • Ouvrez le avec un éditeur de texte.
  • A la ligne 39, vous avez « $cfg['PmaAbsoluteUri'] = ''; » à l'intérieur des cotes saisissez l'adresse complète de votre PHPmyadmin, c'est à dire http://localhost/mysql/.
  • A la ligne 79, vous avez « $cfg['Servers'][$i]['auth_type'] = 'config'; », cette variable correspond à la configuration de la méthode d'authentification sous PHPmyadmin. Trois options sont possibles : « config » récupère les infos dans ce même fichier et l'utilisateur n'a pas besoin de s'identifier, « HTTP » permet d'afficher une fenêtre de log à chaque fois que quelqu'un souhaite accéder à PHPmyadmin et « cookie » qui permet une authentification par cookie.
  • Si vous avez choisi « config » à l'étape précédente, vous devez renseigner les variables « $cfg['Servers'][$i]['user'] » et « $cfg['Servers'][$i]['password'] » que vous trouvez respectivement à la ligne 80 et 81. Les valeurs attendues sont « root » et le mot de passe que vous avez saisi à l'étape précédente.
  • Sauvegardez et fermez l'éditeur de texte.

Votre PHP et Mysql sont maintenant correctement installés, on va pouvoir passer à l'installation du package Dummy.

2.4. Installation et configuration du Dummy 3.5.0

Première étape : Installation

Encore une fois l'installation est « on ne peut plus simple », puisqu'il suffit de dézipper le package dans un répertoire placé dans le répertoire « www » d'easyPHP. Comme pour easyPHP, les caractères spéciaux, les chiffres, les majuscules et les espaces sont fortement déconseillés pour le nom du répertoire.

Une fois le dézippage terminé, vous devez avoir une arborescence du genre « www/votrerep/dummy-3.5.0/ » c'est dans ce dernier répertoire que vous trouvez tous les fichiers de typo. Pour optimiser votre installation, il est conseillé de prendre l'ensemble des fichiers contenus dans le répertoire « dummy-3.5.0 » et de les déplacer dans le répertoire « votrerep ».

L'installation est terminée, on va pouvoir passer à la configuration...

Deuxième étape : La configuration

Pour commencer, il faut supprimer une petite sécurité que Kasper glisse dans ces packages et dont je ne connais pas l'utilité. A l'aide d'un éditeur de texte ouvrez le fichier « votrerep/typo3/install/index.php ». A la ligne 39, vous trouverez une ligne commençant par « die("In the main source... », mettez cette ligne en commentaire, sauvegardez puis fermer le fichier.

Vous pouvez maintenant accéder à votre site pour la première fois. Pour ce faire, taper l'adresse suivante dans votre navigateur : http://localhost/votrerep/ vous obtenez l'écran suivant :

Intro-dummies-10000000000001BC00000219C54252F3.png

Dans la case username, il faut saisir le nom de l'utilisateur de Mysql, si vous ne l'avez pas modifié dans le 1, c'est « root »

Dans la case Password, il faut saisir le mot de passe de cet utilisateur que vous avez saisi dans la première étape de la configuration de PHPmyadmin.

Cliquez ensuite sur « Update localconf.php » et vous obtiendrez l'écran suivant :

Intro-dummies-10000000000001AF0000011895771AB6.png

Soit vous sélectionnez une base déjà existante, soit vous indiquez un nouveau nom et Typo se chargera de la créer.

Vous cliquez sur « Update localconf.php » et vous obtenez :

Intro-dummies-10000000000001B100000124F6E17303.png

Il ne vous reste plus qu'à importer le script sql et vous pourrez accéder à votre site typo3 aux adresses suivantes :

Remarques : si vous recommencez l'installation et la configuration dans un nouveau répertoire vous pourrez avoir un 2ème site Typo3.

2.5. Installation et configuration d'Imagemagick et gdlib

Imagemagick

Pour installer imagemagick, il suffit de dézipper le package télécharger dans un repertoire. Encore une fois il est préférable de n'avoir ni caractères spéciaux, ni chiffre, ni espace, ni majuscule dans ce répertoire et dans ses répertoires parents(personnellement je le mets toujours dans c:\imagemagick).

Ensuite on peut passer à la configuration. Dans le backend :

  • cliquez sur le menu Install (1) dans la frame de gauche,
  • par défaut le mot de passe est joh316 (2),

Intro-dummies-32e8fddbed.png

  • sélectionnez le menu 1 basic configuration,

Intro-dummies-100000000000009D000000778B1B2C4B.png

  • descendez quasiment tout en bas à la section "Check Image Magick:",
  • dans le champ (1), saisissez l'adresse de votre imagemagick (moi c'est : C:\imagemagick\),
  • cochez la case si nécessaire (2),
  • cliquez sur send (3).

Typo recharge la même page, si vous redescendez à la section "Check Image Magick:", il doit y avoir un tableau qui confirme que imagemagick a été trouvé avec le numéro de version (ici 4.2.9) (4). Si c'est le cas, il ne vous reste plus qu'à descendre tout en bas et cliquer sur "Update localconf.php".

Intro-dummies-10000000000001BE0000013DFEE55DAB.png

Pour vérifier le bon fonctionnement, vous revenez au menu du menu « Install », vous sélectionnez "3:Image Processing" puis vous descendez tout en bas de la page chargée et vous cliquez sur "3: Scaling images".

Si vous obtenez des images du christ comme celles qui suivent, c'est gagné!

Intro-dummies-10000000000001B7000001162833A5CC.png

GDLib et Freetype

Pour installer gdlib, il suffit de dézipper le package télécharger dans un repertoire. Encore une fois il est préférable de n'avoir ni caractères spéciaux, ni chiffre, ni espace, ni majuscule dans ce répertoire et dans ses répertoires parents(personnellement je le mets toujours dans [/cgi-bin/olink?sysid= c:\gdlib]).

Ensuite on peut passer à la configuration :

  • Faites un clic droit sur l'icone d'Easyphp (à coté de l'horloge),Intro-dummies-10000000000000E5000000BC22E8184B.png
  • Dans configuration sélectionnez « extension php »,
  • Dans la fenêtre qui apparait sélectionnez « php_gd2 » (1) et appliquez (2),

Intro-dummies-10000000000000D500000156C181F3C9.png

Intro-dummies-10000000000001B6000001D8F47665BA.png

  • Dans le backend, allez dans le menu « Install » puis « 4: All Configuration » et cochez « gdlib », « gdlib_png » et « gdlib_2 ». Le faite de cocher la case « gdlib_png » va vous permettre de générer des images en png notamment pour les menus. Cependant ce paramètrage créer des warnings dans l'arborescence en backend quand vous avez un objet (une page) caché. Ces warnings ne sont pas graves, juste un peu embétant. Une solution est en cours de recherche...
  • Toujours dans ce menu, le champ « TTFdpi » doit être à 72, passez le à 96,
  • Sauvegardez.

Intro-dummies-10000000000001B8000000AAA33428A9.pngIntro-dummies-10000000000001BE00000128BCA74CE0.png

Pour vérifier le bon fonctionnement de Gdlib et Freetype, allez dans le menu « Basic Configuration » et vérifiez que tout est au vert et au jaune (l'image de test de Freetype est du texte rouge sur fond jaune ) dans la section Gdlib.

2.6. Quelques corrections à faire

Ces deux corrections ne sont à faire que si vous travaillez avec un package Typo3 en version 3.5. En effet, à partir de la 3.6 des conditions, pour corriger ces bugs, ont été rajoutées. Ca sert à ça les montées de version ;-).

Import d'extension

Lors de vos imports d'extensions, via le module de gestion des extensions, vous devriez avoir ce message d'erreur :

Intro-dummies-280d472297.png

N'ayant pas trouvé le pourquoi du problème (même si j'ai une piste dans la doc d'installe sous IIS), je passe directement la ligne concernée en commentaire avant même de faire mon premier import. Pour ce faire vous ouvrez le fichier concerné dans votre éditeur de texte préféré et vous mettez la ligne 2647 en commentaire (grâce à la syntaxe //).

Module Phpmyadmin dans typo

Si vous tentez d'accéder au module phpmyadmin vous allez tomber sur ce message d'erreur suivi d'un phpinfo.

Intro-dummies-b74084687e.png

Pour éviter ce problème il faut procéder en 2 temps:

  • dans le répertoire : typo3\ext\phpmyadmin\modsub\, renommez le repertoire "phpMyAdmin-2.4.0-rc1" en supprimant les majuscules ( personnellement je supprime également le -2.4.0-rc1 pour obtenir « phpmyadmin »),
  • dans le répertoire : typo3\ext\phpmyadmin\modsub, éditez le fichier conf.php en remplaçant à la ligne 9 le 'phpmyadmin-2.4.0-rc1' par le nom du répertoire que vous venez de modifier (pour moi c'est « phpmyadmin »).

Normalement vous pouvez maintenant accéder au module PhpMyAdmin sans aucun problème.

2.7. Premier pas avec les contenus et les templates

Votre premier contenu sur votre site

  • dans le backend, cliquez sur « page » (1) dans la colonne de gauche,
  • cliquez sur le planisphère à coté de Blank DUMMY (2) puis sur « New » (3) dans la colonne du milieu,

Intro-dummies-100000000000017F0000006A646CC7DE.png

  • sélectionnez « page inside » dans la colonne de droite,
  • décochez la case « Hide page » (1), indiquez un titre dans le champ « Pagetitle » (2) puis sauvegardez (3),

Intro-dummies-0298fd482e.png

  • si vous développez Blank DUMMY (2) dans la colonne du milieu une page avec votre titre doit apparaître, cliquez sur le titre (3),
  • cliquez sur le bouton « Create page content » (4) dans la colonne de droite, puis sélectionnez « Regular text element »,

Intro-dummies-eb01a6541b.png

  • dans le formulaire qui s'ouvre remplissez le champ « header » (1) avec le titre de votre contenu et le grand champ « text » avec un petit texte (2), puis sauvegardez en haut ou en bas du formulaire (3),

Intro-dummies-10000000000001FC000000F7457051E3.png

  • si vous cliquez sur l'icône à coté de votre page et sur « show » vous obtiendrez une page avec une erreur, fermez la et repassez sur le backend,
  • dans la colonne de gauche cliquez sur « template » (1), dans la colonne du milieu sur le titre de votre page (2) et enfin dans la colonne de droite sur le bouton « Create template for a new site » (3),

Intro-dummies-d611af05b4.png

  • vous arrivez sur un tableau de 6 lignes, 2 colonnes contenant les lignes « title », « sitetitle »..., si ce n'est pas le cas dans le menu déroulant en haut à droite sélectionnez « Info/Modify » (1),

Intro-dummies-10000000000001E1000001025BE945CB.png

  • cliquez sur « Click here to edit whole template record » (2 image au dessus), et remplacez le code du champ setup (1 image en dessous) par le code suivant :

# Default PAGE object:

page = PAGE

page.typeNum = 0

page.10 <styles.content.get

  • plus bas dans le formulaire, dans le champ « Include static » (2 image en dessous), sélectionnez « content (default) » dans la colonne de droite (dernier de la liste) puis sauvegardez le formulaire,

Intro-dummies-10000000000001E4000001B33B7528D4.png

  • ouvrez un nouveau navigateur, tapez l'adresse http://localhost/votrerep et si tout c'est bien passer le texte saisi précédemment apparaît sur le site,
  • pour modifier ce contenu il suffit de cliquer sur page (1) dans la colonne de gauche du backend, puis sur le titre de votre page (2) dans la colonne du milieu et enfin sur le petit crayon (3) ou sur le bouton « Edit in Rich text Editor » (3). Je vous laisse maintenant vous balader pour découvrir toute la puissance de typo3...

Intro-dummies-7dab8ed0ce.png

Votre premier site avec un template existant

Pour cette section on va repartir du site que vous avez créé au paragraphe précedent, la différence va se faire au niveau de la création du template et au niveau du nombre de page du site.

  • La première étape va consister à supprimer le template dont on n'a plus besoin, cliquez sur « List »(1) puis sur le titre de votre page(2). Cochez la case « Extended view »(3), cliquez sur la poubelle de la ligne de votre template(4) et confirmez la suppression de l'enregistrement,

Intro-dummies-e30d33ce8d.png

  • Cliquez sur « Template »(1), puis sur le titre de votre page(2). Dans le menu déroulant de la frame de droite, sélectionnez « Template; GLÜCK »(3) puis cliquez sur le bouton « Create template for a new site »(4), et confirmez la création,

Intro-dummies-51b185a1c9.png

  • Allez en frontend, votre site existe et il a un template.

Avant de faire quelques modifications sur le template, on va enrichir le site afin que vous vous rendiez compte que ce template contient aussi des menus.

  • Cliquez sur « Functions »(1), puis sur le titre de votre page(2). Dans la frame de droite (qui vous propose de créer de multiples pages) insérez au moins deux noms de pages (3) avant de cliquer sur le bouton « Create pages »(4) et de confirmer la création de ces pages,

Intro-dummies-54c8f36cf8.png

  • On va maintenant recommencer l'opération mais cette fois-ci pour la première page que vous venez d'ajouter. Cliquez sur « Functions », puis sur la petite croix à gauche de votre page initiale, puis sur le titre de votre première sous pages. Ajoutez quelques noms de page puis cliquez sur le bouton « Create pages » et confirmez la création,

Intro-dummies-f410289f6e.png

Retournez sur le frontend, vous avez maintenant un menu à gauche et si vous cliquez sur la première ligne de ce menu, le sous-menu apparaîtra dans la colonne de droite. Lorsque vous passez d'un page à l'autre, vous n'avez aucune information qui apparaît dans la partie centrale, c'est tout simplement car vos nouvelles pages ne contiennent pas de contenu. Pour en rajouter, il vous suffit de réutiliser la même méthode que celle utilisée pour ajouter un texte sur la premiére page de votre site, vu dans le paragraphe précédent.

Si vous souhaitez un peu personnaliser ce template, rien de plus simple. Cliquez sur « Template »(1), puis sur le titre de votre page contenant le template (la première)(2). Dans le menu déroulant en haut à droite sélectionnez « Constant editor »(3), puis dans celui central sélectionnez « Basic »(4).

Intro-dummies-528b8c47c6.png

Vous avez fait apparaître l'ensemble des paramètres de votre template. Je ne donnerai pas d'explication sur chaque paramètre car les chiffres blancs sur fond rouge (1) renvoient en bas de page où vous trouverez le template et des explications. Un seul petit truc, cependant, pour modifier un paramètre si sa valeur par défaut ne vous convient pas(2), vous devez d'abord cocher la case du paramètre en question (3) puis cliquez sur « Update »(4). Renseignez ensuite le champ qui est apparu avec la valeur souhaitée avant de cliquer à nouveau sur le bouton « Update »(4).

Votre premier site avec un template maison

Comme pour le paragraphe précédent, il faut commencer par supprimer le template existant. Je vous laisse remonter jusqu'au détail de cette manipulation.

L'étape suivante va être la création d'un template HTML qui va servir de base au template de votre site. Je vous en propose un ultra simple afin de le mettre en pratique rapidement. Ensuite vos aptitudes au HTML feront la différence, si vous voulez un peu l'étoffer.

  • Créer un fichier « montemplate.html » et insérer le code suivant à l'intérieur :
<html>
   <head>
      <title>Typo3 pour les nuls</title>
   </head>
   <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
      <!--###DOCUMENT_BODY###-->
         <table width='80%' border='0' align='center'>
            <tr bgcolor='#7093DB' align='center'>
               <td colspan='2'>###MENU_NIVEAU1###</td>
            </tr>
            <tr>
               <td bgcolor='#8F8FBD' width='25%'>###MENU_NIVEAU2###</td>
               <td>
                  <table width='100%' cellpadding='10' border='0'>
                     <tr>
                        <td><!--###MON_CONTENU### debut-->Il y a un problème sur le site, contacté le webmestre<!--###MON_CONTENU### fin--></td>
                     </tr>
                 </table>
               </td>
	    </tr>   
         </table>
      <!--###DOCUMENT_BODY###-->
   </body>
</html>
      1. MENU_NIVEAU1### et ###MENU_NIVEAU2### sont des marqueurs, ils seront remplacés par du code grâce au typoscript.
      1. MON_CONTENU### et une sous-parties avec un début et une fin, grâce au typoscript on remplacera toute ce qui se trouve entre la balise de début et celle de fin, les balises comprises. Si le typoscript devait ne pas fonctionner alors le message « Il y a un problème... » apparaîtra sur le site.
  • Il faut maintenant uploader le fichier sur le serveur pour cela, placez-vous en backend, cliquez sur « Filelist » (1) puis sur l'icône associé au répertoire « fileadmin » (2) et enfin sur « upload Files » (3).

Intro-dummies-100000000000013C0000009770AEE2B8.png

  • Dans le formulaire qui est apparu dans la partie de droite, récupérer votre fichier html grâce au bouton « Parcourir... » (1) puis cliquez sur le bouton « Upload file » (3).

Intro-dummies-10000000000001640000009AB88F980F.png

Votre template HTML est maintenant en place sur votre serveur, on va donc pouvoir passer au typoscript. Dans un premier temps, nous allons construire nos deux objets menu (niveau 1 et niveau 2) puis nous construirons le template typoscript principal de notre site.

  • Pour stocker nos TS, on va utiliser un « sysfolder » ou « dossier système ». Cliquez sur page (1), puis sur l'icône de votre page principale (2) puis sur « New » (3), et enfin sur « Page (after) » (4),

Intro-dummies-63737ff7b1.png

  • Dans le formulaire qui apparaît, sélectionnez « sysfolder » (1) dans le champ type puis saisissez un titre (2) avant de sauvegarder (3).

Intro-dummies-100000000000012E000000A6F62B189E.png

Passons maintenant à la construction de notre menu de niveau 1 qui sera horizontal et de type GMENU c'est à dire que chaque lien vers une page sera une image générée automatiquement par Typo3.

  • Cliquez sur « List » (1), sur l'icône de votre « sysfolder » (2), sur « News » (3) puis dans la liste séléctionnez « Template » (4),

Intro-dummies-10000000000001ED000000A2BECE14B3.png

  • Dans le formulaire qui apparaît, indiquez un titre (« TS du menu niveau 1 » par exemple). Dans la zone de texte « Constants » saisissez le code suivant :

# cat=Menu niveau1/color/a; type=color; label=Couleur de fond: Couleur de la zone contenant le menu

couleurfond= #CCCCCC

# cat=Menu niveau1/color/b; type=color; label=Couleur de fond 2: Seconde couleur de la zone contenant le menu

couleurfond2= #EEEEEE
# cat=Menu niveau1/color/c; type=color; label=Couleur RO : Couleur pour le rollover (quand la souris passe sur le menu)
couleurRO=#FF0000
# cat=Menu niveau1/color/d; type=color; label=Couleur de fond: Couleur du texte dans le menu
couleurtexte=#FFFFFF
* Dans la zone de texte « Setup » saisissez le code suivant :
temp.menu_niveau1 = HMENU
temp.menu_niveau1.1 = GMENU
temp.menu_niveau1.1.NO {
XY = [10.w]+20,20
backColor = |*| {$couleurfond} || {$couleurfond2} |*|
10 = TEXT
10.text.field = title
10.offset = 0,13
10.align = center
}
temp.menu_niveau1.1.RO < temp.menu_niveau1.1.NO
temp.menu_niveau1.1.RO = 1
temp.menu_niveau1.1.RO {
backColor = {$couleurRO}
10.fontColor = {$couleurtexte}
}

Ces deux scripts correspondent à du typoscript. Pour mieux comprendre ce langage, il faudra étudier les documents « Typoscript par l'exemple » et « TSref » (regardez dans la section « Continuer à lire des documentations » pour avoir plus d'informations).

Une petite remarque cependant que vous ne trouverez pas dans ces documents concernant la fonction des lignes débutants par « # » dans la partie « constants ». Ces lignes permettent de faire apparaître vos constantes dans le « constant editor » qui offre une interface plus visuel et plus agréable pour modifier leur valeur plutôt que de rentrer dans le code.

  • Cliquez sur « template » (1), puis sur votre page principale (2) et dans le menu déroulant en haut à droite séléctionnez « Constant editor » (3) et enfin « menu niveau 1 » (4) dans le nouveau menu déroulant,

Intro-dummies-9048d42250.png # cat=Menu niveau1(1)/color(2)/a; type=color(3); label=Couleur de fond(4): Couleur de la zone contenant le menu (5)

couleurfond(6)= #CCCCCC(7)

La valeur de type (3) va déterminer la façon dont la constante pourra être modifiée et les valeurs qu'elle pourra avoir. Ici on a le type « color » donc on a une représentation de la couleur sélectionnée et si on modifie ce champ, on aura le choix entre un menu déroulant de couleurs pré-définies et un champ de texte libre qui attendra une valeur de la forme #RRGGBB.

Comme nous avons procédé pour le premier menu, nous allons maintenant construire le menu de niveau 2. Cette fois-ci ça sera un TMENU, c'est à dire que chaque lien sera un texte sur lequel Typo aura automatiquement rajouté la balise <A> pour pointer sur la bonne page. Reprenez le même enchainement de manipulation que pour le premier menu, sauf que pour le titre vous indiquez « TS du menu niveau 2 » que dans le champ « constants » vous ne saisissez rien et dans le champ setup vous saisissez :

temp.menu_niveau2 = HMENU
temp.menu_niveau2.entryLevel = 1
temp.menu_niveau2.1 = TMENU
temp.menu_niveau2.1.NO {
linkWrap = <B>|</B><BR>
}

Faisons un point de la situation. Ce que nous avons pour le moment, c'est :

  • un template HTML sur notre serveur avec des marqueurs et des sous-parties,
  • un objet typoscript pour définir notre menu de niveau 1,
  • un objet typoscript pour définir notre menu de niveau 2,
  • une arborescence qui définit le site.

Mais tous ces objets ne sont pas liés et si vous affichez votre site vous aurez une erreur « No template found ». Ce que nous allons donc faire maintenant c'est définir un template principal qui permettra de relier tous ces éléments ensemble afin d'avoir à nouveau un site dynamique affiché.

  • Cliquez sur « template » (1), sur le titre de votre page principale (2) puis sur « Create template for a new site » (3),

Intro-dummies-a88f5c9dfe.png

  • Assurez vous d'être dans dans le mode « Info/modify » (1) puis cliquez sur « Click here to edit whole template record » (2),

Intro-dummies-10000000000001D7000000DED5B91487.png

  • Dans le formulaire qui apparaît, saisissez un titre.
  • Dans la zone setup recopiez le code suivant :

# Default PAGE object:

page = PAGE
page.typeNum = 0
#page.includeCSS.file1 = monpath/monfichier.css
page.10 = TEMPLATE
page.10 {
template = FILE
template.file = fileadmin/montemplate.html
workOnSubpart = DOCUMENT_BODY
marks.MENU_NIVEAU1 < temp.menu_niveau1
marks.MENU_NIVEAU2 < temp.menu_niveau2
subparts.MON_CONTENU < styles.content.get
}
  • Assurez vous que les casses « Clear constants », « Clear setup » et « Rootlevel » sont cochées,
  • Sélectionnez « Content (default) » dans la liste de la zone « Include static »,
  • Dans la zone « Include basis template », cliquez sur l'icône pour rechercher un template (1), puis dans la popup qui s'est ouverte sur le sysfolder contenant vos menus (2), et enfin sur le « plus » gauche du menu de niveau 1 (3) et sur le titre du menu de niveau 2 (4). (Quand vous cliquez sur le plus le template est inclus dans la liste mais la popup reste ouverte, quand vous cliquez sur le titre, le template est inclus et la popup se ferme).

Intro-dummies-100000000000017E000000F5C3DD3C22.png

  • Sauvegardez. Votre site est prêt.

Remarque sur le typoscript de la zone setup :

Les lignes commençant par un « # » sont des commentaires, elles ne sont donc pas interprétées par Typo3. Je vous ai rajouté la ligne « page.includeCSS.file1 = monpath/monfichier.css » qui vous permez si vous le souhaitez de rajouter une feuille de style dans votre site grâce au typoscript. Il faut bien sur remplacer « monpath » et « monfichier » par les noms correspondants à votre fichier.

2.8. Premier pas avec les extensions

Trouver des extensions

La meilleure adresse (il me semble que c'est la seule officielle), c'est bien sur www.typo3.org, et plus précisément dans « l'extension repository » : https://typo3.org/1420.html

A cette adresse, vous arriverez sur une page dont l'en-tête est la suivante :

Intro-dummies-1d4ecc2d22.png

Cette en-tête se divise en trois zones, un menu (1), le moteur de recherche (2) et une première liste d'extensions (3).

Cette première liste correspond aux extensions qui ont été créées ou modifiées ces 20 derniers jours. Le message entre parenthèses (4) indique que les versions de développement ne sont pas référencées sur cette page.

Une extension a un numéro de version sous la forme X.Y.Z :

    • X correspond à une nouvelle version (en général tant qu'une extension est en version beta, on a X=0),
    • Y correspond à une nouvelle sous-version,
    • Z correspond à une nouvelle version de développement ou de travail, elle n'apporte en général pas beaucoup de nouveauté.

Grâce au reste du menu (1), on a accès respectivement à un classement sur la catégorie des extensions, une liste des extensions les plus téléchargées, une liste d'extensions validées (je sais pas par qui et il y en a pas beaucoup), une classement par type (stable, béta...) et enfin la liste entière des extensions classées par catégorie et ordre alphabéthique sur le titre.

Les types correspondent à la stabilité de l'extension, mais il faut se méfier car il est déterminé par l'auteur au moment de la configuration de son extension dans le repository.

Enfin il existe encore deux autres sortes d'extensions qui ne sont pas visibles ici :

  • les extensions réservées aux membres de typo3.org ( l'inscription est libre d'accès ),
  • la multitude d'extensions qui sont développées à titre personnelle et qui ne sont pas mises en ligne car souvent trop spécifiques à un projet donné.

Sélectionner, télécharger et installer une extension

La meilleure façon de sélectionner l'extension qui correspond à un besoin c'est d'utiliser le moteur de recherche, qui recherche les mots clefs dans le titre, la description et « l'extension key ».

Une fois la recherche lancée, le moteur retourne la liste des extensions correspondantes sous forme de tableau rempli d'informations :

Intro-dummies-da83f3c725.png

On y trouve le nom (1), l'extension key (2), le type (3), l'icône de vérification (4) (la il n'est pas vérifié comme la plupart des extensions), l'auteur (5), la catégorie technique (6), la version (7) (la signification est expliquée au paragraphe précédent), l'état des downloads (8) avec le total depuis le début et le total depuis la dernière mise à jour, la date de la dernière mise à jour (9), les changements apportés par la dernière version (10), la description de la fonction de l'extension (11) et enfin les principaux paragraphes de la documentation associée, si elle existe (12).

Une fois l'extension trouvée, il existe deux méthodes pour la rapatrier sur son propre site : tout à partir du backend, ou une première partie sur le site typo3.org puis une seconde dans le backend.

Première méthode

La première méthode, via le backend, nécessite une configuration initiale dans le menu « Ext Gestion »(1). Sélectionnez le menu « Settings » (2) dans le menu déroulant, et dans le formulaire qui apparaît saisissez votre login (3) et password (4) de votre compte typo3.org (et oui, il faut que vous ayez créé un compte sous typo3.org). Le champ « Enter default upload password » (5) ne sert que pour l'upload d'extension, donc il n'est pas nécessaire de le remplir. Et enfin, sauvegardez ses données (6).

Intro-dummies-7d22408c69.png

Une fois cette première opération effectuée, il faut aller dans le menu « Ext Gestion » (1) puis « Import extensions from online repository » (2). Si l'opération précédente s'est bien passée, vous devez voir apparaître votre login. Cliquez sur « Connect to online repository » (3) , attendez, et la liste des extensions disponibles dans le repository apparaît. Il vous suffit ensuite de repérer votre extension (elles sont classées par catégorie puis par nom) et de cliquer dessus.

Intro-dummies-f5acf19a8d.png

Deuxième méthode

Pour la seconde méthode, il faut aller sur www.typo3.org. Une fois l'extension trouvée, il suffit de cliquer sur son nom puis sur le lien « détail » qui est dans le menu qui est apparu sous le nom de l'extension. Sur l'écran suivant, on a une liste d'information concernant l'extension et au bas de cette page, on trouve un lien « Download compressed extension .T3X file » qui permet de rapatrier l'extension au format t3x sur son poste.

Intro-dummies-10000000000001580000004F2630B8C7.pngIntro-dummies-100000000000019C00000043DC9CD118.png

Ensuite dans le backend, il faut aller dans le menu « Ext Gestion » (1) puis dans le menu « Import extensions from online repository » (2) et la section « UPLOAD EXTENSION FILE DIRECTLY (.T3X): » , il faut cliquer sur « Parcourir... » (3) pour sélectionner le t3x, puis sur le bouton « Upload extension file » (4). En principe, un écran vous confirme le succés de l'opération.

Intro-dummies-c7ca495632.pngIntro-dummies-e1d38f41ff.png

Conclusion

A partir de la, quelque soit la méthode choisie pour télécharger l'extension, la méthode à suivre et la même pour l'installer sur le site. Dans le menu « Ext Gestion » (1), il faut sélectionner « Available extension to install », repérer l'extension qui vient d'être télécharger et cliquer sur le plus blanc sur rond gris (2) pour l'installer. Une nouvelle fenêtre s'ouvre et détaille les modifications qui vont être apportées notamment si une table est modifiée (3) ou créée (4). Il vous suffit de cliquer sur « Make update » en bas de page, pour confirmer l'installation.

Intro-dummies-ec9a96ed2a.pngIntro-dummies-be05cdcec1.png

Une fois l'installation terminée, il ne vous reste plus qu'à utiliser et configurer l'extension et la, tout dépend de son type (frontend plugin, backend modul...). Pour cette partie, les possibilités sont telles qu'on ne peut pas décrire de méthode unique, il faut en général se reporter à la documentation associée à l'extension et si elle n'existe pas, il faut avoir assez de bouteille pour savoir comment se comporte les extensions de ce type. Après, il vous restera toujours l'option du forum de typo3.fr. :o)

Supprimer une extension

Comme on vient de le voir, il existe 3 niveaux d'installation : rapatrier l'extension sur le serveur, installer l'extension pour qu'elle soit accessible dans le site et enfin créer un contenu contenant cette extension.

Remarque : cette dernière étape n'existe que pour les extensions de type « frontend ».

Pour supprimer une extension « proprement », il va donc falloir reprendre ces 3 étapes en sens inverse. En fonction du besoin de suppression, on enchainera ou non les différentes étapes.

Si vous souhaitez supprimer une extension de type « frontend », la première opération consiste à supprimer tous les contenus y faisant référence dans votre site. Pour cela, il suffit d'ouvrir chacun de ces contenus et de cliquer sur la poubelle à coté des boutons de sauvegarde (1).

Intro-dummies-ac3ae29c0d.png

Si vous vous arrétez la : votre extension n'apparait plus dans le frontend, mais elle est toujours ajoutable sur le site en créant un nouveau contenu de type « Insert plugin ».

La seconde étape consiste à désinstaller l'extension en passant par le menu « Ext Gestion » (1) puis « Loaded extensions » (2). Cliquez sur le moins blanc sur rond vert (3) sur la ligne de votre extension, puis sur le bouton « Remove extension » (1 seconde image) pour confirmer la suppression.

Intro-dummies-d9d223867a.pngIntro-dummies-dbe050b414.png

Si vous vous arrétez la : votre extension n'est plus accessible pour être installée dans un contenu mais elle est toujours présente sur le serveur.

La troisième et dernière étape est la suppression de l'extension du serveur. Cliquez sur « Ext Gestion », « Available Extensions to install » puis sur le titre de votre extension. Dans le menu déroulant en haut à droite sélectionner « Backup/Delete » puis cliquez sur « DELETE EXTENSION FROM SERVER » (1) dans la section « DELETE ».

Remarque au passage : c'est également sur cette page que vous pourrez créer les fichiers compressés (.t3x) de vos extensions dans la section « Backup » (2).

Intro-dummies-5e4b22d0dc.png

Si vous vous arrétez la : votre extension n'est plus sur le serveur, la seule façon de l'utiliser à nouveau est de la télécharger à nouveau depuis le site typo3.org, ou à partir du .t3x correspondant, si vous l'avez gardé quelque part sur votre serveur.

2.9. Transférer un site

Avant tout chose, une petite explication sur la structure de Typo3. Son fonctionnement est basé sur la combinaison d'une base mysql qui permet de gérer les objets utilisés en backend et en frontend, et sur un framework de classes PHP qui sert à utiliser et gérer l'ensemble de ces données. Concrètement, on peut dire que la base permet de gérer le contenu (c'est pour ça qu'on parle de « gestionnaire de contenu ») et les classes permettent plutôt de gérer l'affichage de ce contenu (on pourrait dire qu'elles constituent le « gestionnaire d'affichage »).

L'ensemble des classes se divise en deux grandes catégories. Un premier ensemble de classe permet de faire fonctionner Typo (afficher le backend, gérer la base mysql...) et constitue donc ce qu'on peut appeler le « noyau » de Typo. Tandis que le second ensemble est plus spécifique à chaque site et lui permet d'avoir son comportement propre. Ce dernier se résume surtout aux extensions que chaque utilisateur installe sur son site.

Une fois cette architecture assimilée, on comprend mieux pourquoi le transfert d'un site va se faire en deux étapes : le transfert de la base puis le transfert des classes PHP.

Transfert de la base MySQL

Pour effectuer ce transfert, on va se servir de l'outil mis à disposition par Typo, c'est à dire PHPmyAdmin (1). Pour lancer l'export, il suffit de cliquer sur l'onglet correspondant (2) dans la partie supérieure de la page :

Intro-dummies-f8bd0ce2ae.png

Dans la nouvelle fenêtre qui apparaît, il suffit de sélectionner toutes les tables (1), puis l'option « Structure and data » (2), et enfin il faut cocher les cases « Add 'drop table » et « Complete inserts » (3) avant de lancer l'export en appuyant sur « Go » (4).

Intro-dummies-b9e4abc625.png

Le script sql correspondant à votre base est ainsi généré dans la fenêtre. Pour le récupérer, un « Ctrl+A » vous permet de sélectionner tout le texte et à l'aide d'un copier/coller vous le sauvegarder en utilisant votre éditeur de texte. Pour la suite de la procédure, on va considérer que ce script à été sauvegardé dans le fichier « mabase.sql ».

L'étape suivante va consister à déposer notre fichier au bon endroit de l'arborescence afin qu'il soit utilisable au moment de l'installation en 3 étapes.

Pour commencer, il nous faut l'arborescence. Pour cela, il faut installer un package sur votre serveur cible. On peut par exemple « poser » un package dummy en suivant les instructions du paragraphe « Première étape : Installation ».

Ensuite, dans cette arborescence que vous venez d'installer, si vous ouvrez le répertoire typo3conf (1), vous pouvez voir le fichier « database.sql » (3). Il correspond au script qui permet par défaut de créer les tables « systèmes » de Typo3 (c'est à dire les tables minimum au bon fonctionnement de typo), tables que l'on retrouve également dans le fichier « mabase.sql » (2) puisqu'on a importé toute la base. Il suffit donc de placer notre fichier à cet endroit pour qu'il soit accessible par la suite.

Intro-dummies-10000000000001C200000086BA48625F.png

Pour en finir avec le transfert de la base, il ne reste plus qu'à exécuter votre script sql via l'installation en trois étapes. Lors des deux premières étapes, il n'y a pas de changement. Une seule remarque, si vous pouvez conserver le même username et password, ainsi que le même nom de base sur vos deux serveurs (ancien + nouveau), c'est préférable comme nous pourrons le voir par la suite. Lors de l'étape 3, qui correspond à l'import de la base, vous avez à présent dans le menu déroulant, le choix entre le fichier « database.sql » et « mabase.sql ». Sélectionnez le fichier « mabase.sql » et cliquez sur le bouton « Import database ».

Remarque : Selon l'importance de votre site original, cette exécution peut prendre plus ou moins de temps et faire échouer l'importation à cause d'un dépassement du temps maximum d'exécution de script. Si cela se produit vous avez deux autres solutions afin d'importer votre base:

  • Augmenter ce temps maximum, dans votre fichier php.ini en modifiant la valeur du paramètre « max_execution_time »,
  • Importer le fichier « database.sql » lors de l'installation en 3 étapes et ensuite mettre à jour les tables systèmes avec votre script et importer les autres tables via le phpMyAdmin de votre nouveau serveur.

Transfert des fichiers

Maintenant que votre base a été importée, il ne vous reste plus qu'à importer les fichiers spécifiques à votre site, les autres ayant déjà été copiés au moment du dézippage du package dummy.

Avant tout chose, si vous voulez éviter les éventuels problèmes, je vous conseille de copier les répertoires : « fileadmin », « typo3conf », « typo3temp » et « uploads » de votre nouveau site dans un coin de votre disque dur. Ils correspondent à ceux que vous venez de dézipper du package mais les avoir à disposition peut s'avérer pratique en cas d'échec de l'import des fichiers.

En ce qui concerne le transfert de fichiers, il n'y a rien de plus simple, vous devez juste copier les répertoires « fileadmin », « typo3temp », « uploads » et « typo3conf/ext » de votre ancien site vers votre nouveau site.

Si pour une raison quelconques vous avez du modifier un des fichiers du noyau de Typo (c'est à dire se trouvant dans un des répertoires « systèmes »), n'oubliez pas de transférer spécifiquement ce fichier afin de ne pas perdre le traitement que vous aviez mis en place.

Le dernier point à traiter est l'ensemble des fichiers qui se trouvent dans le répertoire « typo3conf » autres que le répertoire « ext » notamment le fichier « localconf.php ». Pour ceux-ci, il existe deux possibilités :

  • soit votre nouveau serveur est similaire à l'ancien au niveau de la configuration mysql (même username, password, host, nom de base et répertoire pour imagemagick et gdlib) dans ce cas vous pouvez transférer l'ensemble de ces fichiers,
  • soit votre nouveau serveur est différent de l'ancien et dans ce cas il est préférable de « re-générer » ces fichiers en passant par le backend et en allant dans le menu « ext gestion » pour ré-installer vos extensions à partir du menu « Available extensions to install » et en allant dans le menu « Installation » pour re-configurer Imagemagick et gdlib.

Votre site est maintenant transférer, il ne vous reste plus qu'à vérifier que tout s'est bien passé en frontend et en backend au niveau du menu installation, de l'arborescence de votre site, de l'installation des extensions et du typoscript.

2.10. Que faire ensuite

Continuer à lire des documentations

Ce document vous permet une première prise de contact avec Typo3, mais il vous reste encore beaucoup de chemin à parcourir avant de pouvoir considérer le connaître. Voici une sélection de documents intéressants à lire pour continuer l'exploration:

Titre

Description

Langue

Importance

Débuter avec Typo3

Tutorial qui permet une visite complète en backend et frontend du site présent dans le package quickstart

Français

Indispensable pour le débutant afin de se familiariser un maximum avec les manipulations de bases disponibles dans typo3.

Typoscript par l'exemple

Série d'exercices pour prendre en main le TS

Français

Indispensable pour avoir un premier contact très pratique avec le typoscript. Si vous suivez et faites tous les exercices vous devriez avoir compris la logique « particulière » du TS à la fin de la lecture.

Modern Template Building

Tutorial pour la mise en place d'un gabarit HTML pour un site en Typo3

Français/Anglais

Indispensable pour savoir comment mettre en place un template pour votre site sans utiliser templaVoila.

Futuristic template building

Tutorial pour la prise en main de la construction de site avec TemplaVoila

Anglais

Indispensable si vous souhaitez utiliser templaVoila dans votre site

Manuel du rédacteur

Cette documentation est orientée utilisateur, plus que webmestre ou développeur.

Français

Une lecture de ce document permet d'avoir une idée de comment les utilisateurs appréhenderont Typo3 de leur côté ce qui peut être intéressant pour adapter la logique projet et le développement

TSref

Référence de tous les objets, propriétés et paramètres typoscript

Anglais

Une lecture approfondi n'est pas nécessaire, mais cette documentation sert souvent dés que vous commencez à faire du TS et que vous souhaitez avoir des informations ou des propriétés sur du TS précis.

TYPO3 Core API

Ce document est le plus complet sur Typo3, il regorge d'informations utiles sur l'API

Anglais

Il faut au moins l'avoir lu une fois quand on veut développer des extensions. Ensuite, il faut suffisamment bien le connaître pour pouvoir revenir pécher des informations à tout moment lors d'un développement.

Inside TYPO3

Ce document est une explication sur la structure et l'architecture de Typo3

Anglais

La lecture de ce document n'est pas indispensable mais vous y trouverez surement des informations interessantes.

Vous trouverez tous ses documents au format sxw (open office) et pdf sur www.typo3.org dans la section « Documentation » puis dans le sous-menu « Matrix »

Visiter d'autres sites intéressants

  • Un bon tutorial pour faire une première extension à l'aide du kickstarter :

http://www.mcuniverse.com/Form_Ext_Tutorial.766.0.html

  • Pour les développements d'extensions plus poussés, cette documentation dans son paragraphe 4 référence toutes les options disponibles pour configurer le formulaire de saisie d'enregistrement en backend :https://docs.typo3.org/typo3cms/CoreApiReference/
  • Deux fois la même adresse pour une explication de la gestion du multilangue dans un site Typo 3 :

https://typo3.org/1220.0.html

https://typo3.org/documentation/tips-tricks/multi-language-sites-in-typo3/

2.11. Trucs et astuces extraient du forum

Dans cette section, vous trouverez une liste de besoins et/ou questions avec leurs solutions sous forme de lien vers des sujets du forum du site typo3.fr. L'enchaînement des réponses n'est pas toujours des plus clair, mais j'ai essayé de ne référencer que les sujets apportant une réelle solution aux problèmes rencontrés. L'avenir de l'ensemble des ces liens est de se retrouver rédiger dans la présente documentation agrémenté de capture d'écran et de quelques précisions quand ça sera possible... Mais ça prend tu temps, donc ça sera fait petit à petit...

Description

Lien

Bug/Configuration : Les frontends users ne sont pas reconnus par la login box

Lien

Configuration : le RTE

Lien

Configuration : Permettre à un utilisateur BE de voir et modifier plus de 20 tables

Lien

Configuration : Site multilangue

Lien

Configuration : Taille maximum des fichiers uploadés

Lien

Extension : Gérer les constantes TS du backend à la classe PHP

Lien

Extension : première approche du codage

Lien

Extension CHC Forum : Tutorial d'installation

Lien

Extension Index Search : Installation et configuration

Lien

Extension Newloginbox : Bug avec typo3 en version 3.6

Lien

Erreur code 145 : warning concernant « cache_pages.MYI »

Lien

Menu : Calage du menu niveau 2 par rapport au niveau 1 pour les menus déroulants

Lien

Menu : Code pour un menu déroulant à 3 niveaux

Lien

Menu : Fil d'ariane (Menu > Sous-menu > Sous-sous-menu)

Lien

Menu : GMENU_LAYERS à trois niveaux

Lien

Menu : TMENU_LAYERS multicouleurs

Lien

Migration 3.5 -> 3.6.2

Lien

Migration vers 3.7

LienLien

Typoscript : Eviter que les contenus d'une colonne s'enchaînent l'un en dessous de l'autre

Lien

Typoscript : Gestion d'un if par rapport à un point de l'arborescence

Lien

Typoscript : Sélectionner un contenu précis dans une des 4 colonnes

Lien

Si un lien ne fonctionne plus ou si vous voulez me soumettre un sujet, n'hésitez pas... mon mail est sur la première page de cette documentation.

2.12. Conclusion

Cette documentation est maintenant terminée, j'espère qu'elle pourra vous aider dans votre première installation de Typo3 sous easyPHP et Windows 2000 et dans vos premiers pas dans l'utilisation de cet excellent CMS.

La prochaine fois que j'installerai une nouvelle machine de travaille, j'essaierai de suivre cette documentation afin d'en trouver les failles et de l'améliorer en rajoutant encore quelques copies d'écran.

Une dernière chose, j'ai voulu mettre ce tutorial à disposition rapidement, et je n'aurais peut être pas le temps de corriger les fautes d'orthographes et les fautes de français (sûrement toutes liées à mon inexpérience dans l'utilisation d'Open Office) immédiatement. :o)

Liste des restes à faire

  • Compléter les informations manquantes ou incomplètes,
  • Ajouter des remarques sur les problèmes rencontrés et les solutions trouvées lors des différentes étapes,
  • Revoir le français et l'orthographe,
  • Attendre vos retours pour améliorer le contenu,
  • Ajouter d'autres adresses utiles pour débuter,
  • Ajouter une section : mon premier site avec template et menu... (template de base ou template maison),
  • Ajouter une section : migration 3.5->3.6->3.7,
  • Ajouter une section : Que faire ensuite...
  • Mettre à jour la liste des restes à faire.