Drupal 8: Crear un bloque con un listado de nodos (parte 1)
El desarrollo de modulo ha cambiado mucho en Drupal 8, ahora ya no es como antes, que todo se hacia en el mimodulo.info y mimodulo.module, ahora debemos estructurar nuestro modulo de una manera concreta para que Drupal localice todo.
 
Este articulo es el primero de una pequeña serie, en el que crearemos un modulo, que nos servirá como aprendizaje he intentara abarcar cosas como creación de un bloque configurable, por lo tanto se usaran formularios, uso de EntityQuery para consultas a la base de datos, carga de nodos, cache…
 
El modulo lo que hará sera crear un bloque, con un formulario de configuración, en el cual podremos especificar de que tipo de contenido serán los nodos que mostraremos, la cantidad, y el titulo que tendrá la lista. Luego mostraremos los nodos en un listado con un theme y si estamos en una pagina de un nodo, y se esta visualizando un nodo que también esta en la lista, ese nodo quedara resaltado.
 
Creamos el módulo
 
Es recomendable disponer de Drupal console (ya se publico como instalarlo) ya que el módulo y su estructura básica la crearemos con el. Lo primero que vamos a hacer es crear el módulo, para ello vamos a utilizar el comando generate:module de Drupal console:
 
$ drupal generate:module

// Welcome to the Drupal module generator
Enter the new module name:
> drupblock
Enter the module machine name [drupblock]:
>
Enter the module Path [/modules/custom]:
>
Enter module description [My Awesome Module]:
>                      
Enter package name [Custom]:
>
Enter Drupal Core version [8.x]:
>
Do you want to generate a .module file (yes/no) [no]:
> yes
Define module as feature (yes/no) [no]:
>
Do you want to add a composer.json file to your module (yes/no) [yes]:
>
Would you like to add module dependencies (yes/no) [no]:
>
Do you confirm generation? (yes/no) [yes]:
>
Generated or updated files
Site path: /drupal-8.0.4
1 - modules/custom/drupblock/drupblock.info.yml
2 - modules/custom/drupblock/drupblock.module
3 - modules/custom/drupblock/composer.json
 
Vamos contestando a las preguntas que nos haga, yo he dejado todas por defecto, excepto la de generar el archivo .module, a la cual le he contestado que si.
 
Creamos el bloque
 
Ahora que tenemos el modulo creado, vamos a crear el bloque, para ello utilizamos el comando generate:plugin:block y vamos respondiendo a las preguntas que nos plantee:
 
$ drupal generate:plugin:block

// Welcome to the Drupal Plugin Block generator
Enter the module name [admin_toolbar]:
> drupblock
Plugin class name [DefaultBlock]:
>
Plugin label [Default block]:
>
Plugin id [default_block]:
>
Theme region to render Plugin Block [ ]:
>
Do you want to load services from the container (yes/no) [no]:
>

You can add input fields to create special configurations in the block.
This is optional, press enter to continue
Do you want to generate a form structure? (yes/no) [yes]:
> no
Do you confirm generation? (yes/no) [yes]:
>

Generated or updated files
Site path: /Users/borja/Sites/devdesktop/drupal-8.0.4
1 - modules/custom/drupblock/src/Plugin/Block/DefaultBlock.php

Rebuilding cache(s), wait a moment please.
                                                                                

[OK] Done clearing cache(s).                                                   
                                                                                
 
Ahora tendremos creada la clase para el bloque en src/Plugin/Block/DefaultBlock.php
 
Añadimos los métodos
 
Dentro de la clase, de momento únicamente tenemos la definición de la misma, y el metodo build. Vamos a añadirle los siguientes métodos a la clase:
 
/**
 * {@inheritdoc}
 */
 public function blockForm($form, FormStateInterface $form_state) {}

 /**
 * {@inheritdoc}
 */
 public function blockSubmit($form, FormStateInterface $form_state) {}

 /**
 * {@inheritdoc}
 */
 public function defaultConfiguration() {}
 
Y al inicio de la clase, debemos añadir un nuevo use si el IDE que estemos utilizando no lo hace automáticamente cuando creamos los métodos blockForm y blockSubmit:
 
use Drupal\Core\Form\FormStateInterface;
 
Añadimos el formulario de configuración
 
Con esto ya tenemos creada la estructura básica del block que vamos a crear. Ahora vamos a añadir el formulario de configuración para el bloque. Para ello tenemos que editar el método blockForm y dejarlo de la siguiente manera:
 
[…]
use Drupal\node\Entity\NodeType;
[…]
 
/**
 * {@inheritdoc}
 */
 public function blockForm($form, FormStateInterface $form_state){

   $list['blank'] = '----';
   $types = NodeType::loadMultiple();
   foreach($types as $key => $type ) {
     $list[$key] = $type->get(‘name');
   }

   $form['node_block_types'] = array(
     '#type' => 'select',
     '#title' => t('Select the node type'),
     '#default_value' => $this->configuration['content_type'],
     '#options' => $list,
   );

   $form['node_block_number'] = array(
     '#type' => 'textfield',
     '#title' => t('Select the number of node to show, default 20'),
     '#default_value' => $this->configuration['number_nodes'],
   );

   $form['node_block_title'] = array(
     '#type' => 'textfield',
     '#title' => t('Select the title of the list'),
     '#default_value' => $this->configuration['block_title'],
   );

   return $form;

  }
 
Si venimos de Drupal 7, se nos hará muy familiar, ya que la api de formularios casi no ha cambiado, en este método, lo primero que hacemos, es crear un array para almacenar los tipos de contenido que vamos a obtener a continuación para añadirlos como opciones de selección al formulario. A continuación obtenemos todos los tipos de contenido disponibles, y en el for lo que hacemos es recoger los tipos con su clave y titulo, y añadirlos al array. Por ultimo creamos los campos para el formulario de configuración.
 
Ahora nos falta guardar el submit del formulario para poder obtener mas tarde esos datos de nuevo, pero para poder guardarlos, primero necesitamos especificar la configuración de este bloque, esto se hace desde el método defaultConfiguration:
 
/**
 * {@inheritdoc}
 */
public function defaultConfiguration() {
   return array(
     'block_title' => 'Block title',
     'number_nodes' => 20,
     'content_type' => 'blank',
   );
}
 
Lo que hacemos es crear un array asociativo con los valores por defecto que vamos a usar.
 
Y por ultimo vamos a crear el submit del formulario, debemos editar el método blockSubmit.
 
/**
 * {@inheritdoc}
 */
public function blockSubmit($form, FormStateInterface $form_state) {
   $this->configuration['block_title']  = $form_state->getValue('node_block_title');
   $this->configuration['number_nodes'] = $form_state->getValue('node_block_number');
   $this->configuration['content_type'] = $form_state->getValue('node_block_types');
}
 
En el submit utilizamos $this->configuration[‘block_title] para hacer referencia a la key ‘block_title’ que se definió en el array del método “defaultConfiguracion”.
 
Activamos el módulo
 
Con todo esto, ya podemos activar el modulo y añadir el bloque desde Estructura -> Diseño de bloques.
 
 
Al configurarlo nos apareceran las opciones que hemos añadido al crear el formulario.
 
 
De momento esto es todo, tenemos el bloque creado, de momento solamente imprime una cadena de texto que se define a través de codigo.
 
 
En la siguiente parte veremos como crear un theme en twig para poder darle un estilo a la salida de nuestro bloque y como cargar los nodos y hacer una consulta con EntityQuery.
 
 
Total de votos: 79

Entradas relacionadas

Comentarios (0)

Deja un comentario