> For the complete documentation index, see [llms.txt](https://akyos.gitbook.io/book/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://akyos.gitbook.io/book/wordpress/akyos-x-core/attributes.md).

# Attributes

Les attributes de Gutenberg sont des configurations disponibles pour tous les blocs et sont présents sur la droite lorsqu'on sélectionne un bloc dans l'éditeur.

Par défaut un attribute est toujours présent : `Spacing`

Il permet de définir des paddings personnalisés pour chaque bloc.

### Chargement des Attributes

Les attributes affichés sur un bloc sont présents dans l'index `supports` du tableau qui permet la construction du bloc&#x20;

Le script va aller chercher tous les Attributes personnalisés dans un dossier `Attributes` présent dans le dossier `app`

```
├── app
    ├── Attributes
        ├── BackgroundColor.php
```

On récupère tous les Attributes présents dans le dossier `app/Attributes` :&#x20;

```php
foreach ($iteratorTheme as $info) {
    if (preg_match('/\w*[.]php\b/', $info->getFileName())) {
        require_once $info->getPathName();
        $name = explode('.', $info->getFileName());
        $name = 'App\\Attributes\\'.$name[0];
        $attributesTheme[] = $name;
    }
}
```

On les ajoute à chaque bloc pour qu'ils soient disponibles dans le builder :&#x20;

```php
$iterator = (new AttributeUtils())->load();
foreach ($iterator as $name) {
    /** @var Attribute $attrs */
    $attrs = (new $name)->opt();
    $opts['supports'] = array_merge($opts['supports'], $attrs->getAttributeOpt());
}
```

Plus loin, on va récupérer les données générées par ces Attributes et les ajouter à la view :&#x20;

```php
foreach ($iterator as $name) {
    /** @var Attribute $attribute */
    $attribute = (new $name)->setBlock($block)->opt();
    $styles = array_merge($styles, $attribute->getOutputStyle());
    $class = array_merge($class, $attribute->getOutputClass());
}
...
 echo $this->render()->with($values)
                ->with(
                    'styles',
                    !empty($styles) ? $styles : ""
                )
                ->with(
                    'classes',
                    !empty($class) ? $class : ""
                );
```

### Ajouter un Attribute

Un Attribute est une class qui classe qui hérite de la classe `Attributeclass`

Elle possède 2 fonctions qui va permettre de soit générer du style inline ou des classes :&#x20;

`outputClass()` et `outputStyle()`

Dans ces fonctions, on ajoute la logique de l'Attribute, qu'est ce qu'il renvoie en fonction de quoi :&#x20;

```php
// Example Spacing.php
protected function outputStyle(): array
{
    $res = [];

    if (isset($this->block['style']['spacing'])) {
       if (isset($this->block['style']['spacing']['padding']['top'])) {
          $res['--pt'] = $this->block['style']['spacing']['padding']['top'];
       }
       if (isset($this->block['style']['spacing']['padding']['bottom'])) {
          $res['--pb'] = $this->block['style']['spacing']['padding']['bottom'];
       }
    }

    return $res;
}
```

```php
// Example Colors.php
protected function outputClass(): array
{
    $res = [];

    if (isset($this->block['backgroundColor'])) {
        $res[0] = 'bg-color-'.$this->block['backgroundColor'];
    }

    if (isset($this->block['textColor'])) {
        $res[1] = 'color-'.$this->block['textColor'];
    }

    return $res;
}
```
