Utilisation de TYPO3 pour les petits projets, partie 3 - Extension Blog

Auteurs : Tom Warwick
Traduit par : Léo - W-Seils

Lire l’article complet en version originale

Récapitulatif

Dans la première partie de cette série, nous avons installé TYPO3 et choisi SQLite comme base de données. Nous nous sommes connectés à l'interface d'administration de TYPO3 et avons découvert certaines de ses fonctionnalités.

Dans la deuxième partie, nous avons vu comment créer des pages et du contenu dans TYPO3. Nous avons également installé le package Bootstrap. Nous avons installé l'extension à l'aide de Composer et modifié l'apparence de notre site.

Dans la troisième partie, nous verrons comment installer et configurer l'extension Blog.

Présentation de l'extension Blog

L'extension Blog est une extension TYPO3 autonome qui vous permet de créer et de gérer des articles de blog. Elle est gérée par TYPO3 GmbH et c'est celle que nous utilisons pour alimenter ce blog que vous êtes en train de lire.

Elle dispose d'une bonne documentation et prend en charge la version 13 de TYPO3. Notez que l'extension Blog ne prend actuellement pas en charge les ensembles de sites. La prise en charge de cette fonctionnalité est toutefois prévue pour 2025. Une fois cette prise en charge ajoutée, une partie de ce guide sera mise à jour pour en tenir compte.

Installation de l'extension Blog

composer require t3g/blog

Ensuite, nous devons exécuter une autre commande,

vendor/bin/typo3 extension:setup

Cette commande exécute les migrations de base de données requises pour l'extension Blog.

Configuration automatique ou manuelle

Vous pouvez configurer l'extension Blog de deux manières : vous pouvez utiliser l'assistant de configuration qui créera une instance autonome du blog (vous vous souvenez des pages racines dans la partie 2 ?) ou vous pouvez opter pour la configuration manuelle.

Dans cet exemple, nous allons configurer l'extension manuellement, ce qui signifie que nous devrons créer manuellement des dossiers pour les éléments tels que les articles de blog, les catégories, les balises, etc., puis indiquer à TYPO3 où ils se trouvent dans l'arborescence des pages à l'aide de TypoScript.

Charger l'extension Blog

L'extension est installée, mais nous devons la charger pour notre site :

TypoScript > Page racine > Modifier l'enregistrement TypoScript > Modifier l'ensemble de l'enregistrement TypoScript

Dans l'onglet Options avancées, sélectionnez « TYPO3 Blog : Intégration ».

Enregistrez et quittez.

Stockage et catégorisation des articles de blog

Nous devons ensuite créer plusieurs éléments dans l'arborescence des pages et nous voulons finalement obtenir le résultat suivant :

Nous aurons une page Blog appelée Blog qui utilisera le plugin List et affichera une liste de tous nos articles de blog avec pagination.

Un dossier de données appelé Data, qui contiendra :

  • Articles de blog
  • Catégories
  • Auteurs
  • Commentaires

Deux pages :

  • Catégorie
  • Archive

 

Chacune de ces deux pages contiendra des plugins affichant leur contenu respectif. Par exemple, la page Catégorie contiendra un plugin qui répertorie toutes nos catégories. Et la page Archive contiendra une liste complète de tous les articles de blog regroupés par mois et par année.

L'extension Blog prend également en charge les balises, mais nous ne les utiliserons pas dans cet exemple.

Création de la page Blog

Pour créer une page, accédez à l'arborescence des pages, faites glisser l'icône de la page vers l'arborescence et donnez-lui un nom (Blog).

Une fois la page créée, sélectionnez-la, puis sélectionnez Modifier les propriétés de la page.

Ensuite, dans l'onglet Général, modifiez le type de page en Page de blog. Vous remarquez l'icône rouge sur la nouvelle page de blog ? Cela signifie que la page est désactivée. Pour l'activer, cliquez dessus avec le bouton droit de la souris et sélectionnez Activer.

Création du dossier de données

Faites glisser l'icône du dossier et placez-la en haut/à l'intérieur de la page Blog.

Vous souhaitez que l'icône du dossier soit verte ? Blog > Modifier les propriétés de la page > Comportement > Contient un plugin > Blog.

Création de catégories

Dans le module Liste, sélectionnez le dossier Données, puis Créer un nouvel enregistrement.

Sélectionnez ensuite Catégorie.

Définissez le type d'enregistrement sur Catégorie de blog et donnez-lui un nom.

Création d'un auteur

Comme pour les catégories :

Affichage de la liste > Dossier de données > Créer un nouvel enregistrement > Auteur.

Pour mon site, je n'ai besoin que d'un seul auteur, moi-même. C'est un moyen utile de partager des liens vers vos profils sur les réseaux sociaux et d'ajouter une brève description de vous-même. Tout en bas de ce guide, vous trouverez un excellent exemple de la fonctionnalité Auteur.

Création des pages Catégorie et Archive

Ensuite, je dois créer deux Pages de type Page de blog (comme nous l'avons fait précédemment pour la page Blog parent). L'une s'appelle Catégorie et l'autre Archive.

Indiquer à l'extension Blog où tout est stocké

Nous avons maintenant une page Blog parent qui affichera la liste de nos articles de blog les plus récents. Nous avons un dossier dédié qui contient une liste des catégories de blog, des auteurs et des articles de blog. Et enfin, nous avons deux pages de blog, l'une pour afficher nos catégories et l'autre pour afficher les anciens articles de blog.

Nous devons maintenant indiquer à l'extension Blog où nous stockons nos articles de blog, catégories, auteurs, commentaires, etc.

Nous devons ajouter une petite quantité de TypoScript qui indique à l'extension Blog où nous stockons les éléments. Chacune des options ci-dessous renvoie à un numéro. Ces numéros sont des identifiants de page. Chaque élément que vous voyez dans l'arborescence des pages a un ID. Par exemple, la page racine de mon arborescence de pages a l'ID 1. Pour connaître l'ID de page d'un élément de l'arborescence, il suffit de passer le curseur sur l'icône d'une page individuelle.

TypoScript > Page racine > Modifier l'enregistrement TypoScript > Modifier l'ensemble de l'enregistrement TypoScript

Dans l'onglet Général, nous devons ajouter les éléments suivants au champ Constante :

#ID de page pour l'affichage de la liste (page du blog)
plugin.tx_blog.settings.blogUid = 53
#ID de page pour le dossier de données où sont stockés les articles du blog
plugin.tx_blog.settings.storagePid = 54
#ID de page pour le dossier de données où sont stockées les catégories
plugin.tx_blog.settings.categoryUid = 54
#ID de page pour le dossier de données où sont stockés les auteurs
plugin.tx_blog.settings.authorUid = 54
#ID de page pour la page d'archives
plugin.tx_blog.settings.archiveUid = 59

Articles de blog

Pour créer votre premier article de blog, faites glisser l'icône Article de blog dans votre dossier de données et donnez-lui un nom.

Une fois que vous avez ajouté votre article de blog, vous pouvez commencer à y ajouter des métadonnées et surtout, à ajouter le contenu réel de votre blog.

Métadonnées du blog

Sélectionnez un article de blog, puis sélectionnez Modifier les métadonnées de l'article

Général

Dans l'onglet Général, vous pouvez modifier le titre de l'article de blog. Si vous modifiez le titre, n'oubliez pas de recharger le segment URL.

SEO et réseaux sociaux

Les onglets SEO et Réseaux sociaux sont assez explicites. Dans ces onglets respectifs, vous pouvez ajouter des informations pour les moteurs de recherche et les plateformes de réseaux sociaux.

Blog

L'onglet Blog est, sans surprise, l'onglet le plus utile. À partir de là, nous pouvons :

  • définir une date de publication
  • ajouter une image en vedette / d'arrière-plan
  • définir une date d'archivage
  • ajouter des balises si elles sont configurées

Nous pouvons également :

  • Attribuer un auteur ou même plusieurs auteurs
  • Activer ou désactiver les commentaires
  • Ajouter des commentaires à un article de blog

Plugins ! Et beaucoup d'autres encore

Nous sommes maintenant prêts à afficher les articles de blog sur la page d'accueil de notre site. Les extensions TYPO3, comme l'extension Blog, contiennent souvent un certain nombre de plugins différents qui effectuent des tâches spécifiques.

Le plugin que nous utiliserons dépendra de la manière dont nous voulons afficher nos blogs. Par exemple, si nous voulons uniquement afficher nos trois articles les plus récents sur la page d'accueil, nous utiliserons probablement le plugin Latest. Sur la page Archive, nous utiliserons le plugin Archive.

Pour ajouter un plugin à une page : Module de page > Page choisie > Créer un nouveau contenu > Blog

Plugin Latest Posts

Sur la page d'accueil, je souhaite afficher les trois articles de blog les plus récents. Le plugin Latest posts est idéal pour cela. Sélectionnez le plugin Latest posts et ajoutez-le à la page.

Dans l'onglet Plugin, nous n'avons pas besoin de spécifier un dossier de stockage, car nous l'avons déjà fait précédemment lorsque nous avons ajouté nos constantes TypoScript.

Par défaut, le plugin Latest affichera les trois derniers articles de blog. Pour modifier cette valeur, ajoutez ceci à vos constantes TypoScript et définissez une nouvelle limite :

plugin.tx_blog.settings.latestPosts.limit = 6

Plugin List

Sur notre page Blog, nous voulons répertorier nos articles de blog. Pour cela, nous allons utiliser le plugin List. Par défaut, le plugin List affiche dix articles par page avec pagination.

Plugin Archive & Category

Vous vous souvenez des pages de blog Archive et Category que nous avons créées précédemment ? Nous devons ajouter des plugins à chacune de ces pages à l'aide des plugins Archive et List by category.

Tout est fait

Et c'est tout pour ce guide en trois parties. Dans la première partie, nous avons vu comment installer TYPO3 v13 avec SQLite. Dans la partie 2, nous avons installé et configuré l'extension Bootstrap afin de personnaliser le thème de notre site et d'utiliser les éléments de contenu étendus livrés avec l'extension.

Do you want to publish
a guest blog post?

 

Contact us

Do you want to publish
your own case study?

 

Get in touch