Création de nouveaux modules EPT

Le module EPT Text contient les dossiers suivants :
/ept_text/config/install — contient les configurations pour le type de paragraphe EPT Text et les instances de champs. D’autres modules EPT peuvent contenir des configurations pour les types de paragraphes et le stockage des champs.
/ept_text/templates — contient le template paragraph--ept-text--default.html.twig pour le paragraphe.
/ept_text/tests — contient des tests pour les modules EPT, actuellement un seul test d’installation.

Et d’autres fichiers standards des modules Drupal : composer.json, ept_text.info.yml, readme.md. Plus de détails sur la création de modules Drupal personnalisés sont disponibles dans la documentation officielle :

https://www.drupal.org/docs/develop/creating-modules

Je vais créer un nouveau module EPT Countdown qui utilisera le plugin JavaScript suivant — FlipDown :

https://github.com/PButcher/flipdown

Toutes les bibliothèques tierces doivent être forkées et hébergées sur Packagist, par exemple :

https://packagist.org/packages/levmyshkin/flexslider

depuis :

https://github.com/levmyshkin/flexslider

Ensuite, Composer pourra les charger comme des bibliothèques classiques depuis Packagist. Ces bibliothèques tierces doivent inclure dans leur composer.json le champ "type": "drupal-library", et elles seront alors installées par défaut dans le dossier /libraries :
https://github.com/levmyshkin/flexslider/blob/master/composer.json

Forkons le dépôt FlipDown sur GitHub.

Il n’est généralement pas recommandé de forker des dépôts au lieu d’utiliser les sources originales. Cependant, je pense que cela facilite l’utilisation des modules EPT sans modifier manuellement composer.json. Imaginez combien il est difficile pour un débutant d’installer Composer, modifier manuellement composer.json et spécifier correctement une URL de dépôt externe. Avoir votre propre bibliothèque sur Packagist simplifie l’installation. Il est donc préférable d’héberger toutes les bibliothèques tierces sur Packagist.

Sur la page GitHub du fork, vous pouvez renommer le dépôt. Le nom doit être simple, sans majuscules ni caractères spéciaux. Les traits d’union (-) et les underscores (_) sont autorisés.

Nous avons maintenant un nouveau dépôt :

https://github.com/levmyshkin/flipdown

Ajoutons un fichier composer.json avec le type "drupal-library" :

git add composer.json
git commit -m 'Ajout du fichier Composer.json'
git push origin master

Le fichier composer.json est disponible ici :

https://github.com/levmyshkin/flipdown/blob/master/composer.json

Si vous vérifiez les tags actuels dans le dépôt, il n’y en aura aucun :

git tag

Je suis généralement la version de la bibliothèque originale. Si la dernière version était 1.4.6, j’augmente la version mineure à 1.4.7. Comme FlipDown n’avait pas de tags, j’ai créé la version 1.0.0 :

git tag 1.0.0
git push origin 1.0.0

Un tag est nécessaire car il contient le composer.json avec le type "library".

Pourquoi ne pas simplement copier la bibliothèque JS dans le module ?

Vous ne pouvez copier que des bibliothèques sous licence GPL. Les bibliothèques JavaScript utilisent généralement la licence MIT. Techniquement, c’est possible, mais les règles de Drupal.org l’interdisent :
https://www.drupal.org/about/licensing

Maintenant, publions la bibliothèque FlipDown sur Packagist :

https://packagist.org/packages/submit

Si vous avez oublié d’ajouter composer.json avec "type": "drupal-library" avant la publication — pas de problème. Il suffit d’ajouter le fichier et de créer un nouveau tag, Packagist récupérera automatiquement les mises à jour.

Voici la page de la bibliothèque sur Packagist :

https://packagist.org/packages/levmyshkin/flipdown

Assurez-vous que la page de la bibliothèque liste le type comme drupal-library.

Revenons maintenant à nos fichiers Drupal et copions le dossier ept_text ; je nommerai le nouveau module ept_countdown :

Les étapes suivantes doivent être réalisées :

• Supprimer les configurations dans /config/install — nous en exporterons de nouvelles plus tard.
• Remplacer toutes les occurrences de ept_text par ept_countdown.
• Renommer les fichiers en remplaçant "text" par "countdown".
• Mettre à jour les descriptions du module dans ept_countdown.info.yml et README.md.

Je vais valider chaque étape séparément dans Git, afin que vous puissiez suivre les modifications pas à pas :

git clone https://git.drupalcode.org/project/ept_countdown.git

Nous avons maintenant un modèle pour notre module, et nous pouvons soumettre les modifications sur Drupal.org.

Allons sur le site drupal.org à la page de création de projet :

https://www.drupal.org/node/add

Nous devons ajouter un projet de type Module :

https://www.drupal.org/node/add/project-module

Titre : Extra Paragraph Types (EPT) : Countdown
Type de projet : Projet complet
Nom court : ept_countdown
Statut de maintenance : Maintenu activement
Statut de développement : En cours de développement actif
Catégories du module : Contenu, Affichage du contenu
Écosystème : Extra Paragraph Types (EPT) : Core

Dans le champ Description, j’insère généralement la liste complète des modules EPT disponibles (voir l’exemple Markdown ci-dessus).

Nous avons maintenant une page de projet de module sur Drupal.org :
https://www.drupal.org/project/ept_countdown

Dans l’onglet Contrôle de version, vous trouverez des instructions sur la manière d’ajouter un dépôt distant à votre projet Git local :

https://www.drupal.org/project/ept_countdown/git-instructions

Après le commit initial, vous devez créer une nouvelle branche cohérente avec la version principale des autres modules EPT — actuellement il s’agit de la 1.4.x.

Nous pouvons maintenant commencer à ajouter de nouvelles fonctionnalités à notre module. Le processus est similaire au développement d’un module personnalisé : nous allons créer un type de paragraphe, ajouter des champs, et inclure des ressources CSS/JS.

Installez simplement le module si vous l’avez généré avec Drush.

Tout d’abord, vous devez créer un nouveau type de paragraphe EPT Countdown :

/admin/structure/paragraphs_type/add

Assurez-vous que le nom machine commence par ept_. J’ai pour habitude de commencer le nom du paragraphe par EPT — ainsi le nom machine sera automatiquement formé correctement. Le nom machine doit-il correspondre au nom du module ? Oui, c’est recommandé pour la cohérence et pour éviter les conflits avec d’autres modules EPT. C’est aussi important pour la surcharge des templates dans les modules plutôt que dans les thèmes — voir la fonction ept_core_theme_registry_alter() dans le module ept_core.

Ajoutez maintenant le champ EPT Settings : field_ept_settings — ce champ est requis pour tous les modules EPT :

EPT Settings est un champ partagé du module EPT Core ; il fournit les réglages DOM Box, arrière-plan, espacement et largeur.

Comme nous devons effectuer un compte à rebours jusqu’à une date, ajoutez un champ date/heure :

J’ai ajouté le préfixe ept_ au nom machine, mais ce n’est pas obligatoire. Vous pouvez l’appeler, par exemple, field_countdown_date. Nous avons également les champs body et title par défaut — cela suffit pour le paragraphe countdown.

Pour les modules EPT, nous utilisons généralement des onglets horizontaux dans le formulaire d’édition :

Ce n’est pas obligatoire, mais c’est pratique pour séparer le contenu et les paramètres, surtout lorsqu’il y a beaucoup de réglages.

Le groupe parent doit être défini sur Onglets avec la direction Horizontal et le paramètre Width Breakpoint réglé à 120 (ou toute autre valeur petite) :

Maintenant que nous avons le type de paragraphe, activez le module EPT Countdown pour appliquer les templates :

/admin/modules

Activez le paragraphe EPT Countdown pour le type de contenu souhaité disposant d’un champ paragraphs :

Voici le résultat sur la page :

Nous pouvons maintenant connecter une bibliothèque tierce. Nous avons déjà la bibliothèque levmyshkin/flipdown listée dans composer.json, mais comme il s’agit d’un module personnalisé, nous devons installer la bibliothèque manuellement via Composer :

composer require levmyshkin/flipdown

La bibliothèque sera automatiquement installée dans le dossier /libraries :

Créez maintenant le fichier ept_countdown.libraries.yml et enregistrez les bibliothèques CSS/JS de FlipDown ainsi qu’un fichier JS personnalisé ept_flipdown/js/ept_countdown.js, où le plugin FlipDown sera initialisé plus tard :

ept_countdown.libraries.yml :

ept_countdown:
  css:
    component:
      /libraries/flipdown/dist/flipdown.min.css: { minified: true }
  js:
    /libraries/flipdown/dist/flipdown.min.js: { minified: true }
    js/ept_countdown.js: {}
  dependencies:
    - core/once
    - core/drupalSettings

Pour les fichiers dans le dossier /libraries, nous utilisons des chemins absolus commençant par un slash.

js/ept_countdown.js :

(function ($, Drupal) {

  /**
   * Comportement EBT Countdown.
   */
  Drupal.behaviors.eptCountDown = {
    attach: function (context, settings) {

    }
  };

})(jQuery, Drupal);

Nous devons également attacher la bibliothèque ept_countdown dans les templates de paragraphe. N’oubliez pas que nous avons deux templates :

{{ attach_library('ept_countdown/ept_countdown') }}

Videz le cache et vérifiez que les fichiers JavaScript sont chargés sur la page :

Nous transmettrons la date de PHP vers JavaScript via drupalSettings. C’est pourquoi nous avons étendu le fichier ept_countdown.libraries.yml en ajoutant les dépendances suivantes :

  dependencies:
    - core/once
    - core/drupalSettings

Dans les modules EPT, les paramètres par défaut ne sont pas transmis à JavaScript. Pour activer cela, nous devons surcharger la classe du widget de champ EptSettingsDefaultWidget :

Fichier : ept_countdown/src/Plugin/Field/FieldWidget/EptSettingsCountDownWidget.php

<?php

namespace Drupal\ept_countdown\Plugin\Field\FieldWidget;

use Drupal\Core\Field\FieldItemListInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\ept_core\Plugin\Field\FieldWidget\EptSettingsDefaultWidget;

/**
 * Implémentation du plugin pour le widget 'ept_settings_countdown'.
 *
 * @FieldWidget(
 *   id = "ept_settings_countdown",
 *   label = @Translation("Paramètres EPT Countdown"),
 *   field_types = {
 *     "ept_settings"
 *   }
 * )
 */
class EptSettingsCountDownWidget extends EptSettingsDefaultWidget {

  public function formElement(FieldItemListInterface $items, $delta, array $element, array &$form, FormStateInterface $form_state) {
    $element = parent::formElement($items, $delta, $element, $form, $form_state);

    $element['ept_settings']['pass_options_to_javascript'] = [
      '#type' => 'hidden',
      '#value' => TRUE,
    ];

    $element['ept_settings']['color_theme'] = [
      '#title' => $this->t('Thème de couleur'),
      '#type' => 'radios',
      '#options' => [
        'dark' => $this->t('Sombre'),
        'light' => $this->t('Clair'),
      ],
      '#default_value' => $items[$delta]->ept_settings['color_theme'] ?? 'dark',
      '#description' => $this->t('Sélectionnez le thème de couleur pour le compte à rebours'),
      '#weight' => '3',
    ];

    $element['ept_settings']['styles'] = [
      '#title' => $this->t('Styles'),
      '#type' => 'radios',
      '#options' => [
        'default' => $this->t('Par défaut'),
        'new_year' => $this->t('Nouvel An'),
      ],
      '#default_value' => $items[$delta]->ept_settings['styles'] ?? 'default',
      '#description' => $this->t('Sélectionnez un style spécial pour le compte à rebours'),
      '#weight' => '4',
    ];

    $element['ept_settings']['heading_days'] = [
      '#title' => $this->t('Titre Jours'),
      '#type' => 'textfield',
      '#default_value' => $items[$delta]->ept_settings['heading_days'] ?? $this->t('Jours'),
      '#description' => $this->t('En-tête pour le compteur de jours'),
      '#weight' => '5',
    ];

    $element['ept_settings']['heading_hours'] = [
      '#title' => $this->t('Titre Heures'),
      '#type' => 'textfield',
      '#default_value' => $items[$delta]->ept_settings['heading_hours'] ?? $this->t('Heures'),
      '#description' => $this->t('En-tête pour le compteur d’heures'),
      '#weight' => '6',
    ];

    $element['ept_settings']['heading_minutes'] = [
      '#title' => $this->t('Titre Minutes'),
      '#type' => 'textfield',
      '#default_value' => $items[$delta]->ept_settings['heading_minutes'] ?? $this->t('Minutes'),
      '#description' => $this->t('En-tête pour le compteur de minutes'),
      '#weight' => '7',
    ];

    $element['ept_settings']['heading_seconds'] = [
      '#title' => $this->t('Titre Secondes'),
      '#type' => 'textfield',
      '#default_value' => $items[$delta]->ept_settings['heading_seconds'] ?? $this->t('Secondes'),
      '#description' => $this->t('En-tête pour le compteur de secondes'),
      '#weight' => '8',
    ];

    return $element;
  }

  public function massageFormValues(array $values, array $form, FormStateInterface $form_state) {
    foreach ($values as &$value) {
      $value += ['ept_settings' => []];
    }
    return $values;
  }
}

Nous pouvons maintenant sélectionner notre widget pour le champ EPT Settings :

Chemin : /admin/structure/paragraphs_type/ept_countdown/form-display

Enregistrez le paragraphe et vérifiez les variables JavaScript via drupalSettings. Maintenant, tous les paramètres d’EPT Settings sont transmis au script :

À la fin de la clé paragraph-id-* se trouve l’ID unique du paragraphe, ce qui permet d’identifier le paragraphe correspondant.

Le plugin FlipDown possède un paramètre de thème (clair/sombre). Nous le transmettons en utilisant le champ color_theme dans le widget EptSettingsCountDownWidget :

$element['ept_settings']['color_theme'] = [
  '#title' => $this->t('Thème de couleur'),
  '#type' => 'radios',
  '#options' => [
    'dark' => $this->t('Sombre'),
    'light' => $this->t('Clair'),
  ],
  '#default_value' => $items[$delta]->ept_settings['color_theme'] ?? 'dark',
  '#description' => $this->t('Sélectionnez le thème de couleur pour le compte à rebours'),
  '#weight' => '3',
];

La valeur du thème peut maintenant être récupérée en JavaScript via drupalSettings et utilisée pour appliquer le style approprié :

Nous avons déjà transmis les paramètres du paragraphe à JavaScript via drupalSettings. Maintenant, nous devons aussi transmettre la valeur de la date depuis le champ Date. Pour cela, créez une <div> vide dans le template avec un attribut data-date qui stocke la valeur du timestamp. Utilisez paragraph.id() pour attribuer un ID unique au paragraphe :

Fichier : paragraph--ept-countdown--default.html.twig

  <div
    class="ept-countdown-date ept-countdown-inline-block flipdown"
    id="paragraph-id-{{ paragraph.id() }}"
    data-date="{{ content.field_ept_countdown_date[0]['#attributes']['datetime']|date('U') }}">
  </div>

Si vous ne savez pas où est stockée la valeur de la date, utilisez le module Twig Debugger et insérez {{ dump(content.field_ept_countdown_date) }} dans le template.

Le filtre date('U') convertit la date au format timestamp Unix.

Incluez maintenant le JavaScript personnalisé et initialisez le plugin FlipDown :

Fichier : /ept_countdown/js/ept_countdown.js

(function ($, Drupal) {

  /**
   * Comportement EPT Countdown.
   */
  Drupal.behaviors.eptCountDown = {
    attach: function (context, settings) {
      var countdowns = once('ept-countdown-paragraph', '.ept-countdown-date', context);
      countdowns.forEach(function(countdown) {
        var eptOptions = drupalSettings['eptCountdown'][countdown.getAttribute('id')];
        var countdownTimestamp = parseInt(countdown.getAttribute('data-date'));
        var countdownId = countdown.getAttribute('id');

        new FlipDown(countdownTimestamp, countdownId, {
          theme: eptOptions['options']['color_theme'],
        }).start();
      });
    }
  };

})(jQuery, Drupal);

N’oubliez pas de vider le cache pour appliquer les modifications. Après cela, le plugin FlipDown devrait s’afficher correctement sur la page :

Comme nous pouvons le voir, même les styles FlipDown par défaut ne s’affichent pas parfaitement — par exemple, sur bureau, les chiffres apparaissent sur deux lignes. Mais nous pouvons facilement corriger cela avec des styles personnalisés. Il suffit de copier les fichiers gulpfile.js et package.json depuis le module EPT Counter ou le module EPT Core Kickstarter.

gulpfile.js :

// Chargement des plugins
var gulp = require('gulp'),
    sass = require('gulp-dart-scss'),
    postcss = require("gulp-postcss"),
    autoprefixer = require("autoprefixer"),
    cssnano = require("cssnano"),
    notify = require('gulp-notify'),
    sassUnicode = require('gulp-sass-unicode');

var config = {
  scssSrc: 'scss/*.scss',
  allScss: 'scss/**/*.scss',
  cssDest: 'css/',
  allJs: 'assets/js/**/*.js',
  allImgs: 'assets/img/**/*'
};

function style() {
  return gulp.src(config.allScss)
    .pipe(sass())
    .pipe(sassUnicode())
    .pipe(postcss([autoprefixer()]))
    .pipe(gulp.dest(config.cssDest));
}

exports.style = style;

function watch(){
  gulp.watch('scss/**/*.scss', style)
}

exports.watch = watch;

package.json :

{
  "name": "ept_styles",
  "version": "1.0.0",
  "description": "Run npm install and then gulp watch",
  "main": "gulpfile.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "devDependencies": {
    "autoprefixer": "^10.2.5",
    "cssnano": "^5.0.2",
    "gulp": "^4.0.2",
    "gulp-dart-scss": "^1.1.0",
    "gulp-notify": "^4.0.0",
    "gulp-postcss": "^9.0.0",
    "gulp-sass-unicode": "^1.0.5",
    "gulp-sourcemaps": "^3.0.0"
  },
  "dependencies": {
    "cucumber": "*",
    "postcss": "^8.2.13"
  }
}

Le fichier package-lock.json sera généré automatiquement après avoir exécuté :

npm install

Puis vous pouvez démarrer la tâche Gulp avec :

gulp watch

Ajoutez maintenant un fichier SCSS :

/ept_countdown/scss/flipdown.scss

.flipdown {
  width: 580px;
}

Le fichier flipdown.css sera automatiquement compilé depuis flipdown.scss. Incluez-le dans ept_countdown.libraries.yml :

ept_countdown:
  css:
    component:
      /libraries/flipdown/dist/flipdown.min.css: { minified: true }
      css/flipdown.css: {}

Videz le cache et vérifiez le résultat :

L’affichage est maintenant nettement amélioré !

Puis-je utiliser du CSS classique au lieu de compiler du SCSS ?

Oui, vous pouvez. Mais la plupart des développeurs préfèrent écrire du SCSS car c’est plus pratique et évolutif.

Le plugin FlipDown prend en charge les paramètres theme et headings, que nous pouvons utiliser pour personnaliser l’affichage. Nous avons déjà créé un widget de champ personnalisé EptSettingsCountDownWidget, et nous allons maintenant y ajouter les champs correspondants.

Fichier : /ept_countdown/src/Plugin/Field/FieldWidget/EptSettingsCountDownWidget.php

public function formElement(FieldItemListInterface $items, $delta, array $element, array &$form, FormStateInterface $form_state) {
  $element = parent::formElement($items, $delta, $element, $form, $form_state);

  $element['ept_settings']['pass_options_to_javascript'] = [
    '#type' => 'hidden',
    '#value' => TRUE,
  ];

  $element['ept_settings']['color_theme'] = [
    '#title' => $this->t('Thème de couleur'),
    '#type' => 'radios',
    '#options' => ['dark' => $this->t('Sombre'), 'light' => $this->t('Clair')],
    '#default_value' => $items[$delta]->ept_settings['color_theme'] ?? 'dark',
    '#description' => $this->t('Sélectionnez le thème de couleur pour le compte à rebours'),
    '#weight' => '3',
  ];

  $element['ept_settings']['styles'] = [
    '#title' => $this->t('Styles'),
    '#type' => 'radios',
    '#options' => ['default' => $this->t('Par défaut'), 'new_year' => $this->t('Nouvel An')],
    '#default_value' => $items[$delta]->ept_settings['styles'] ?? 'default',
    '#description' => $this->t('Sélectionnez un style spécial pour le compte à rebours'),
    '#weight' => '4',
  ];

  $element['ept_settings']['heading_days'] = [
    '#title' => $this->t('Titre Jours'),
    '#type' => 'textfield',
    '#default_value' => $items[$delta]->ept_settings['heading_days'] ?? $this->t('Jours'),
    '#description' => $this->t('En-tête pour le compteur de jours'),
    '#weight' => '5',
  ];

  $element['ept_settings']['heading_hours'] = [
    '#title' => $this->t('Titre Heures'),
    '#type' => 'textfield',
    '#default_value' => $items[$delta]->ept_settings['heading_hours'] ?? $this->t('Heures'),
    '#description' => $this->t('En-tête pour le compteur d’heures'),
    '#weight' => '6',
  ];

  $element['ept_settings']['heading_minutes'] = [
    '#title' => $this->t('Titre Minutes'),
    '#type' => 'textfield',
    '#default_value' => $items[$delta]->ept_settings['heading_minutes'] ?? $this->t('Minutes'),
    '#description' => $this->t('En-tête pour le compteur de minutes'),
    '#weight' => '7',
  ];

  $element['ept_settings']['heading_seconds'] = [
    '#title' => $this->t('Titre Secondes'),
    '#type' => 'textfield',
    '#default_value' => $items[$delta]->ept_settings['heading_seconds'] ?? $this->t('Secondes'),
    '#description' => $this->t('En-tête pour le compteur de secondes'),
    '#weight' => '8',
  ];

  return $element;
}

Nous pouvons maintenant utiliser les titres et le thème dans le template. L’ID de l’élément suit le modèle paragraph-id-{{ paragraph.id() }}, ce qui nous permet de récupérer les données depuis drupalSettings :

new FlipDown(countdownTimestamp, countdownId, {
  theme: eptOptions['options']['color_theme'],
  headings: [
    eptOptions['options']['heading_days'],
    eptOptions['options']['heading_hours'],
    eptOptions['options']['heading_minutes'],
    eptOptions['options']['heading_seconds'],
  ],
}).start();

De plus, nous utilisons la valeur styles des paramètres pour attribuer dynamiquement des styles dans le template :

{%
  set classes = [
    'paragraph',
    'ept-paragraph',
    'ept-paragraph-countdown',
    'paragraph--type--' ~ paragraph.bundle|clean_class,
    'ept-paragraph--type--' ~ paragraph.bundle|clean_class,
    view_mode ? 'paragraph--view-mode--' ~ view_mode|clean_class,
    not paragraph.isPublished() ? 'paragraph--unpublished',
    'paragraph-id-' ~ paragraph.id(),
    content.field_ept_settings['#object'].field_ept_settings.ept_settings.styles,
    content.field_ept_settings['#object'].field_ept_settings.ept_settings.color_theme,
  ]
%}

Attachez les styles new_year conditionnellement si le style correspondant est sélectionné :

{% if content.field_ept_settings['#object'].field_ept_settings.ept_settings.styles == 'new_year' %}
  {{ attach_library('ept_countdown/new_year') }}
{% endif %}

ept_countdown.libraries.yml :

new_year:
  css:
    component:
      css/new-year.css: {}

/ept_countdown/scss/new-year.scss :

.ept-paragraph-countdown.new_year {
  background: url(../img/snowflakes.webp) center center repeat;
}

Résultat :

Vous pouvez ajouter autant de styles personnalisés que vous voulez pour les modules EPT nouveaux ou existants. Vous pouvez également proposer vos styles en créant un ticket sur Drupal.org :

https://www.drupal.org/project/issues/ept_core

Nous avons terminé d’ajouter des fonctionnalités à EPT Countdown. Il est maintenant temps d’exporter les configurations et de préparer le module pour sa publication sur Drupal.org.

Toutes les configurations liées au paragraphe EPT Countdown doivent être copiées dans le dossier /ept_countdown/config/install.

Si le module a été généré avec Drush, vous devez réexporter les configurations pour vous assurer que tous les réglages des champs et des types de paragraphes sont à jour.

Ensuite, vous pouvez activer le module sur la page Étendre — /admin/modules. Toutes les configurations de paragraphes et de champs pour EPT Countdown seront automatiquement installées depuis /config/install :

Il n’est pas nécessaire d’inclure les fichiers de configuration language.*, car le module Langue peut être désactivé sur certains sites.

Je copie habituellement tous les fichiers YAML requis et m’assure qu’ils sont placés sous config/install :

Avant de valider, assurez-vous de supprimer les uuid et les hashes des fichiers YAML :

Si votre module dépend d’autres modules Drupal (par exemple datetime), assurez-vous de les lister comme dépendances dans le fichier .info.yml :

/ept_countdown/ept_countdown.info.yml :

dependencies:
  - drupal:datetime

Votre module est maintenant prêt à être téléversé et publié sur Drupal.org.

Nous avons déjà créé un nouveau projet sur Drupal.org :

https://www.drupal.org/project/ept_countdown

La branche principale sélectionnée est 1.4.x, afin de rester cohérent avec les autres modules de l’écosystème EPT :

Toutes les versions commenceront désormais à partir de la version 1.4.0 :

git tag 1.4.0
git push origin 1.4.0

Vous pouvez également créer des versions préliminaires telles que -alpha ou -beta avant de publier la version stable 1.4.0.

Vous devez attendre 10 jours après la création du projet avant que le module puisse être inclus dans le programme Security Advisory Coverage :

Vous pouvez maintenant tester le nouveau module sur différents types de contenu, vérifier le comportement de FlipDown, les réglages de thème et les titres. Si nécessaire, déposez des rapports de bugs et publiez des correctifs.

Si vous avez généré le module EPT avec Drush, le fichier README.md devrait déjà être créé automatiquement.

Quoi qu’il en soit, n’oubliez pas d’inclure un fichier README.md dans votre module. C’est un fichier important qui contient la description du module, ses exigences, les étapes d’installation et les instructions d’utilisation. Vous pouvez consulter un exemple dans un autre module EPT :

https://www.drupal.org/project/ept_slideshow

Merci d’utiliser les modules EPT ! Vous pouvez toujours poser des questions ou partager vos idées :

• Créer un ticket sur Drupal.org
• Contacter le développeur du module EPT
• Envoyer un message sur LinkedIn