
Upgrade Your Drupal Skills
We trained 1,000+ Drupal Developers over the last decade.
See Advanced Courses NAH, I know EnoughDrupal 8: Creating custom contact us block with form field
The \u2018category\u2019 defines the package for your custom block.
<\/p>\n\t<\/li>\n<\/ul>
Plugin API<\/strong><\/p>\n\n
In Drupal 8 Plugin allow our module to provide additional functionality by reusing the code & implement the interface with different functionality. In Drupal every block consists of the same parts, label, content, and various settings related to visibility and cachability. How that label and content is generated is different varies from one module to another.<\/p>\n\n
The plugin system has three base elements:<\/p>\n\n
Plugin Types:<\/strong> Is the controlling class that defines how the plugins of this type will be discovered and instantiated. The type will describe the central purpose of all plugins of that type; e.g. blocks, etc.<\/p>\n\n
Plugin Discovery:<\/strong> is the process of finding plugins within the available code base that qualify for use within this particular plugin type's use case.<\/p>\n\n
Plugin Factory:<\/strong> The Factory is responsible for instantiating the specific plugin(s) chosen for a given use case.<\/p>\n\n
In this Custom block i\u2019m going to add some fields(org name\/ org location\/ email id\/ phone\/ address). i\u2019m saving theses values to my block configuration page. and also validating one of the field (org name) should not be numeric.<\/p>\n\n
\nclass ContactBlock extends BlockBase\n\n\/**\n\n\u00a0\u00a0* {@inheritdoc}\n\n\u00a0*\/\n\n\u00a0public function blockForm($form, FormStateInterface $form_state) {\n\n\u00a0\u00a0\u00a0 $form = parent::blockForm($form, $form_state);\n\n\n\u00a0\u00a0\u00a0 \/\/ Retrieve existing configuration for this block.\n\n\u00a0\u00a0\u00a0 $config = $this->getConfiguration();\n\n\u00a0\u00a0\u00a0 \/\/ Add a form field to the existing block configuration form.\n\n\u00a0\u00a0\u00a0 $form['org_name'] = array(\n\n\u00a0\u00a0\u00a0\u00a0 '#type' => 'textfield',\n\n\u00a0\u00a0\u00a0\u00a0 '#title' => t('Organization:'),\n\n\u00a0\u00a0\u00a0\u00a0 '#default_value' => isset($config['org_name'])? $config['org_name'] : '',\n\n\u00a0\u00a0\u00a0 );\n\n\u00a0\u00a0\u00a0 $form['org_loca'] = array(\n\n\u00a0\u00a0\u00a0\u00a0 '#type' => 'textfield',\n\n\u00a0\u00a0\u00a0\u00a0 '#title' => t('Location:'),\n\n\u00a0\u00a0\u00a0\u00a0 '#default_value' => isset($config['org_loca'])? $config['org_loca'] : '',\n\n\u00a0\u00a0\u00a0 );\n\n\u00a0\u00a0\u00a0 $form['org_mail'] = array(\n\n\u00a0\u00a0\u00a0\u00a0 '#type' => 'email',\n\n\u00a0\u00a0\u00a0\u00a0 '#title'=> t('Email ID:'),\n\n\u00a0\u00a0\u00a0\u00a0 '#default_value' => isset($config['org_mail'])? $config['org_mail'] : '',\n\n\u00a0\u00a0\u00a0 );\n\n\u00a0\u00a0\u00a0 $form['org_phn'] = array(\n\n\u00a0\u00a0\u00a0\u00a0 '#type' => 'number',\n\n\u00a0\u00a0\u00a0\u00a0 '#title'=> t('Contact:'),\n\n\u00a0\u00a0\u00a0\u00a0 '#default_value' => isset($config['org_phn'])? $config['org_phn'] : '',\n\n\u00a0\u00a0\u00a0 );\n\n\u00a0\u00a0\u00a0 $form['org_add'] = array(\n\n\u00a0\u00a0\u00a0\u00a0 '#type' => 'textfield',\n\n\u00a0\u00a0\u00a0\u00a0 '#title'=> t('Address:'),\n\n\u00a0\u00a0\u00a0\u00a0 '#default_value' => isset($config['org_add'])? $config['org_add'] : '',\n\n\u00a0\u00a0\u00a0 );\n\n\u00a0\u00a0\u00a0 return $form;\n\n\u00a0}\n\n\n<\/pre>\n\n
\u00a0<\/p>\n\n
Defines a base block implementation that most blocks plugins will extend.<\/p>\n\n
This class provides the generic block configuration form, default block settings, and handling for general user-defined block visibility settings.<\/p>\n\n
$form = parent::blockForm($form, $form_state);<\/p>\n\n
\u00a0<\/p>\n\n
It creates a form array and get all the data from the parent method.<\/p>\n\n
\n\u00a0\/**\n\n\u00a0\u00a0* {@inheritdoc}\n\n\u00a0\u00a0*\/\n\n\u00a0public function setConfigurationValue($key, $value) {\n\n\u00a0\u00a0\u00a0 $this->configuration[$key] = $value;\n\n\u00a0}\n\n<\/pre>\n\n
\u00a0<\/p>\n\n
saves the block configuration data.<\/p>\n\n
\n\n\/**\n\n\u00a0\u00a0* {@inheritdoc}\n\n\u00a0\u00a0*\/\n\npublic function blockSubmit($form, FormStateInterface $form_state) {\n\n\u00a0 \u00a0..Code comes here...\n\n}\n<\/pre>\n\n
\u00a0<\/p>\n\n
Process the block's submission handling if no errors occurred.<\/p>\n\n
\n\n\/**\n\n\u00a0\u00a0* {@inheritdoc}\n\n\u00a0\u00a0*\/\n\n\u00a0public function build() {\n\n\u00a0\u00a0\u00a0 $config = $this->getConfiguration();\n\n}\n\nGet the block configuration.\n\/** \u00a0\u00a0\n\u00a0 * {@inheritdoc} \u00a0\u00a0\n\u00a0 *\/ \u00a0\npublic function blockValidate($form, FormStateInterface $form_state) \n\u00a0 {\n \u00a0 \u00a0 \u00a0 \u00a0 \u00a0...code comes here... \n\u00a0 }\n\/**\n\n\u00a0\u00a0* {@inheritdoc}\n\n\u00a0\u00a0*\/\n\n\u00a0public function blockValidate($form, FormStateInterface $form_state) {\n\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0...code comes here...\n\n}\n<\/pre>\n\n
To add validation for a specific block type, override BlockBase::blockValidate().<\/p>\n\n
Once we have done with block build, block form, save configuration, get configuration, validate and submit. we will find our custom block to be listed in our block listing page.<\/p>\n\n
Below is the Block form layout of our custom Block module<\/p>\n\n
\u00a0<\/p>\n\n<\/p>\n\n
After filling up all the detail save the block. and our custom block start displaying in the specified region.<\/p>\n\n<\/p>\n\n
\u00a0<\/p>\n\n
GIt Source code:<\/strong> https:\/\/github.com\/xaiwant\/D8custom-block-with-field-data<\/a><\/p>\n","meta_tags":"{\"description\":\"Before we jump into the custom block writing. I would like to go through the blocker, which came to my learning. Hope it would be clear and simplest way to explain.\",\"keywords\":\"rupal 8, Custom Block, Plugin API, Annotations based plugin\"}","author":"Jaywant.Topno","image":" http:\/\/cms.valuebound.com\/sites\/default\/files\/default_images\/bg-header-small-5.jpg\n","module_link":"","created":"22 December, 2015"}]
About Drupal Sun
Drupal Sun is an Evolving Web project. It allows you to:
- Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
- Facet based on tags, author, or feed
- Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
- View the entire article text inline, or in the context of the site where it was created
See the blog post at Evolving Web
