0

I'm working on a custom module that has a block. This block has a form in configuration where user input the relative data, so far it works its saving the data and it display it but without a template (twig). I'm trying to display it through a twig but haven't being possible.

I've read a lot of documentation but haven't been able to make it work. Not really sure what's the problem or what I'm missing.

UPDATE: I forgot to clarify, that I was able to make it work with a twig template when the template was located at the templates directory of the main theme, what I'm trying to achieve is to make it work when the html.twig file is at the modules directory (modules/custom/onyx_experiencia/templates)

This is the structure of my module

module
------custom
------------onyx_experiencia
----------------------------onyx_experiencia.info.yml
----------------------------onyx_experiencia.libraries.yml
----------------------------onyx_experiencia.module
----------------------------css
-------------------------------onyx_serv_css.css
----------------------------templates
-------------------------------------onyx-experiencia.html.twig
----------------------------src
-------------------------------Plugin
-------------------------------------Block
------------------------------------------onyx_experiencia.php

onyx_experiencia.info.yml

name: Onyx Servicios
description: Block de Servicios de OnyxGroup
core: 8.x
package: Custom
dependencies:
- block
type: module

onyx_experiencia.libraries.yml

onyx-experiencia-style:
  version: 1.x
  css:
    theme:
      css/onyx_serv_css.css: {}

onyx_experiencia.module

<?php
/**
 * Implements hook_theme().
 */
function onyx_experiencia_theme() {
  return [
    'onyx-experiencia' => [
      'variables' => [
        'CardTitle' => NULL,
      ],
    ],
  ];
}

onyx_experiencia.php

<?php

namespace Drupal\onyx_experiencia\Plugin\Block;



use Drupal\Core\Block\BlockBase;
use Drupal\Core\Block\BlockPluginInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\file\Entity\File;
use Druap\image\Entity\ImageStyle;



/**
 * Provides a 'Onyx' Block.
 *
 * @Block(
 *   id = "onyx_experiencia",
 *   admin_label = @Translation("Servicios OnyxGroup"),
 *   category = @Translation("Servicios OnyxGroup"),
 * )
 */
class onyx_experiencia extends BlockBase implements BlockPluginInterface {

 /**
   * {@inheritdoc}
   */  
  public function build() {
    $config = $this->getConfiguration();
    $build = array();

    if (!empty($config['card_title'])) {
      $name = $config['card_title'];
    }
    else {
      $name = $this->t('Onyx Group Card');
    }

    if (!empty($config['card_text'])) {
      $cardText = $config['card_text'];
    }
    else {
      $cardText = $this->t('A service of Onyx Group');
    }

    //$build[]['#attached']['library'][] = 'onyx_experiencia/onyx_serv_css';
    $build = array(
    '#theme' => 'onyx-experiencia',
    );

    $build['CardTitle'] = array(
            '#prefix' => '',
            '#markup' => $name,
            '#suffix' => '',
        );

    $build['CardText'] = array(
            '#prefix' => '',
            '#markup' => $cardText,
            '#suffix' => '',
        );

    $cardImage = $this->configuration['card_image'];
    if (!empty($cardImage[0])) {
        if ($file = File::load($cardImage[0])) {
            $build['CardImg'] = array(
                '#theme' => 'image_style',
                '#style_name' => 'medium',
                '#uri' => $file->getFileUri(),
            );
        }
    }

    $cardLink = $this->configuration['card_link'];
    $build['CardLink'] = array(
        '#markup' => $cardLink,
    );

    return $build;

  }

 /**
   * {@inheritdoc}
   */
  public function blockForm($form, FormStateInterface $form_state) {
    $form = parent::blockForm($form, $form_state);

    $config = $this->getConfiguration();

    $form['card_title'] = [
      '#type' => 'textfield',
      '#title' => $this->t('Card Title'),
      '#description' => $this->t('Type title of the service card.'),
      '#default_value' => isset($config['card_title']) ? $config['card_title'] : '',
    ];

    $form['card_text'] = [
      '#type' => 'textarea',
      '#title' => $this->t('Card Text'),
      '#format' => 'full_html',
      '#description' => $this->t('Type the list of the services.'),
      '#default_value' => isset($config['card_text']) ? $config['card_text'] : '',
    ];

    $form['card_image'] = [
        '#type' => 'managed_file',
        '#title' => t('Card image background'),
        '#upload_validators' => array(
            'file_validate_extensions' => array('gif png jpg jpeg'),
            'file_validate_size' => array(25600000),
        ),
        '#theme' => 'image_widget',
        '#preview_imgage_style' => 'medium',
        '#upload_location' => 'private://card_service_img',
        '#progress_message' => 'One moment while we save your file...',
        '#default_value' => isset($this->configuration['card_image']) ? $this->configuration['card_image'] : '',
        '#required' => TRUE,
    ];

    $form['card_link'] = [
        '#title' => t('Type card link. Example: /erp_cloud'),
        '#type' => 'url',
        '#default_value' => isset($this->configuration['card_link']) ? $this->configuration['card_link'] : '',

    ];

    return $form;
  }

 /**
   * Custom submit actions
   */
  public function custom_submit_form($form, FormStateInterface $form_state) {
    $values = $form_state->getValues();
    //Perform the required actions
  }

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

      $cardImage = $form_state->getValue('card_image');
      if ($cardImage != $this->configuration['card_image']) {
          if (!empty($cardImage[0])) {
              $file = File::load($cardImage[0]);
              $file->setPermanent();
              $file->save;
          }
      }

    $this->configuration['card_title'] = $form_state->getValue('card_title');
    $this->configuration['card_text'] = $form_state->getValue('card_text');
    $this->configuration['card_image'] = $form_state->getValue('card_image');
    $this->configuration['card_link'] = $form_state->getValue('card_link');
  }

}

onyx_experiencia.html.twig

{#
/**
 * @file
 * Profile for onyx_experiencia block.
 */
#}
{{ attach_library('onyx_experiencia/onyx_serv_css')}}

<div class="cardTitle">
 {{form.CardTitle}}
</div>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.