Monday 11 March 2019

Drupal 8 custom Block

Create Custom Block Programmatically in Drupal 8

Create custom module as mentioned in Create Custom module
In Drupal 7, to create custom block, need hooks hook_block_info(), hook_block_view() in .module file. 
Drupal 7 Module file: 
<?php
/**
 * Implements hook_block_info()
 **/
function mymodule_block_info()
{
  $blocks['welcome'] = array(  'info' => t('Welcome'), );
  return $blocks; }
}
/**
 * Implements hook_block_view()
 **/
function mymodule_block_view($delta = '')
{
  $block = array();    switch ($delta)
  {
      case 'welcome':  $block['subject'] = t('Welcome'); $block['content']
      = array( $block['content'] = 'Welcome to Lotus website!', );
      break;
    }
    return $block;
}

In Drupal 8
  • Blocks are instances of block plugin.
  • Drupal block manager scans modules to check class that having @Block annotation with id, admin_label properties to define custom block.
  • Use Plugins API to declare a block and add a class to define the content.
Create folder as below:
custom_module > src > Plugin > Block
Now create a file HelloBlock.php file which having HelloBlock class. 
Class name must be same as filename.
Content in HelloBlock.php file is as below
<?php

/**
 * @file
 * This file contains \Drupal\example\Plugin\Block\HelloBlock
 */

namespace Drupal\firstcustommodule\Plugin\Block;

use Drupal\Core\Block\BlockBase;

/**
 * Provides a 'Hello' block.
 *
 * @Block(
 *   id = "hello_block",
 *   admin_label = @Translation("Hello Block")
 * )
 */
class HelloBlock extends BlockBase {
/*
   * {@inheritdoc}
   */
  public function build() {
    return array(
      '#markup' => $this->t('The hello message is!'),
    );
  }
}

In above code, class HelloBlock is extending BlockBase class which is included in this file by "use" statement (use Drupal\Core\Block\BlockBase).
Before statement "class HelloBlock extends BlockBase", there is a comment section. This comment section is having "annotations meta data"
Drupal block manager scans classes in modules to check @Block annotation that further create custom block with id, admin_label property.

Now save file and clear cache.

To see custom block go to Structure > Block layout. Now suppose, I have to show this block in content region.
Then go to content region > click on "Place Block" button. after clicking this button, a pop up will appear which is having this created custom block as shown in screenshot. Now select created custom block and place this block by clicking "Place Block" button. Now after clicking this button "configure block" form will start to appear as shown in another screenshot.

This form having following options which we have to configure.
Title: This can be edited and can be set to display or not when this block is displayable. 
NOTE -> Custom block machine name can not be changed.
Now in visibility configuration
  • Content Type -> In this you can set that this block will be visible to which content type.
  • Pages -> In this you can set, that this block is visible to which page like for front page (<front>), for internal page (node/12)
  • Roles -> This will restrict to display this block to specific roles
Now in region configuration, select in which region this block has to display.
After save block, you will be redirected to block layout page. Now Save blocks on the block layout page.

This created custom block will start to appear on pages as per configuration done in visibility and region settings.
This block is showing Title as configured.
Description is markup set in code above.










No comments:

Post a Comment