Exemple : Page Blueprints

Les pages Blueprints s'étendent à partir de la page par défaut et vous permettent d'ajouter des options. Fondamentalement, les pages personnalisées peuvent prendre vie en utilisant des plans de page. Avec un plan de page, vous pouvez configurer à 100% le formulaire d'édition d'une page telle qu'elle apparaît dans l'Admin.

Un premier exemple

Si vous souhaitez utiliser le formulaire de page par défaut et ajouter simplement quelques zones de sélection par exemple, vous pouvez étendre la page par défaut.

Cela utilisera le formulaire de page par défaut et ajoutera un champ de texte à l'onglet Avanced, sous la section Overrides :

1  | title: Gallery
2  | extends@:
3  |     type: default
4  |     context: blueprints://pages
5  |
6  | form:
7  |     fields:
8  |        tabs:
9  |           type: tabs
10 |           active: 1
11 | 
12 |           fields:
13 |              advanced:
14 |                 fields:
15 |                    overrides:
16 |                       fields:
17 |                          header.an_example_text_field:
18 |                             type: text
19 |                             label: Add a number
20 |                             default: 5
21 |                             validate:
22 |                                required: true
23 |                                type: int

Cela ajoutera à la place un nouvel onglet, appelé Gallery, avec certains champs.

1  | title: Gallery
2  | '@extends':
3  |     type: default
4  |     context: blueprints://pages
5  | 
6  | form:
7  |     fields:
8  |        tabs:
9  |           type: tabs
10 |           active: 1
11 | 
12 |           fields:
13 |              gallery:
14 |                 type: tab
15 |                 title: Gallery
16 | 
17 |                 fields:
18 |                    header.an_example_text_field:
19 |                       type: text
20 |                       label: Add a number
21 |                       default: 5
22 |                       validate:
23 |                          required: true
24 |                          type: int
25 |
26 |                    header.an_example_select_box:
27 |                       type: select
28 |                       label: Select one of the following
29 |                       default: one
30 |                       options:
31 |                          one: One
32 |                          two: Two
33 |                          three: Three

Les types de champs que vous pouvez ajouter sont répertoriés dans Champs de formulaire disponibles pour une utilisation dans l'administration

Comment nommer les champs

Il est important que les champs utilisent la structure header.*, afin que le contenu du champ soit enregistré dans l'en-tête de page lors de l'enregistrement.

Créer un formulaire de page entièrement personnalisé

Vous pouvez éviter d'étendre le formulaire par défaut et créer un formulaire de page complètement unique.

Par example:

1  | title: Gallery
2  | 
3  | form:
4  |     fields:
5  |        tabs:
6  |           type: tabs
7  |           active: 1
88 | 
9  |           fields:
10 |              gallery:
11 |                 type: tab
12 |                 title: Gallery
13 | 
14 |                 fields:
15 |                    header.an_example_text_field:
16 |                       type: text
17 |                       label: Add a number
18 |                       default: 5
19 |                       validate:
20 |                          required: true
21 |                          type: int
22 | 
23 |                    header.an_example_select_box:
24 |                       type: select
25 |                       label: Select one of the following
26 |                       default: one
27 |                       options:
28 |                          one: One
29 |                          two: Two
30 |                          three: Three
31 | 
32 |                    route:
33 |                       type: parents
34 |                       label: PLUGIN_ADMIN.PARENT
35 |                       classes: fancy

Une note pour le mode expert

Lors de la modification de pages en mode Expert, le Blueprint n'est pas lu et le formulaire de page est le même sur toutes les pages. En effet, en mode Expert, vous modifiez les champs de la page directement dans le champ Frontmatter, et il n'est pas nécessaire d'avoir une présentation personnalisée.

Où mettre les pages Blueprints

Pour que le plugin d'administration récupère les plans et affiche ainsi les nouveaux types de page, vous devez placer les plans au bon endroit.

Dans le dossier User Blueprints

Mettez-les dans user/blueprints/pages/. C'est un bon endroit pour les mettre lorsque vous voulez simplement que vos plans soient présents sur votre site.

Dans le thème

Mettez-les dans user/themes/YOURTHEME/blueprints/. C'est mieux lorsque vous avez également l'intention de diffuser votre thème : le thème fournira les pages blueprints et il sera plus facile à utiliser.

Dans le dossier Données

Si vous utilisez un thème basé sur Gantry5, le meilleur emplacement est user/data/gantry5/themes/YOURTHEME/blueprints/, sinon vos fichiers pourraient être perdus lors d'une mise à jour du thème.

Dans un plugin

Mettez-les dans user/plugins/YOURPLUGIN/blueprints/. C'est l'endroit où les mettre si vous définissez et ajoutez des pages personnalisées dans le plugin.

Ensuite, abonnez-vous à l'événement onGetPageBlueprints et ajoutez-les à Grav. L'exemple suivant ajoute les blueprints du dossier blueprints/.

1  | public static function getSubscribedEvents()
2  | {
3  |     return [
4  |        'onGetPageBlueprints' => ['onGetPageBlueprints', 0]
5  | 
6  |     ];
7  | }
8  | 
9  | public function onGetPageBlueprints($event)
10 | {
11 |     $types = $event->types;
12 |     $types->scanBlueprints('plugins://' . $this->name . '/blueprints');
13 | }