Étiquette : drupal 8

[Drupal] Perfect views block configuration for multilingual node support
Objectives
- We want to add on a node page layout a block which uses a field from the currently rendered content (node).
- We want this block to be translated the same as the currently rendered entity.
- As a anonymous user, we want it to respect the published settings of the currently rendered entity.
- As an admin, we want to be able to see this block if the content is unpublished.
- We want to support cases when a content is not translated. The default Drupal behaviour is to use the default translation.
Configuration

Configuration screenshot.
- Do not use Published (= Yes) setting.
  
  Views will remove itself results on which you don’t have permission—unless you have disabled access checks in the Query settings parameter of the view. Also, as an admin, you will still be able to see the block if the content is unpublished.
- Set Default translation (= True).
  
  Views will retrieve the default translation, which is the default result when you attempt to go on a node page which has no translation.
- Set Rendering Language to Interface text language selected for page.
  
  Views will attempt to translate the content. If no content translation is found, default translation will be used.
- Contextual filter set to Content: ID with Content ID from URL as default value.
- Hide block if the view output is empty.
  
  No need to keep this block if there is no output (or keep it if you need it anyway).
Additional information
- Tested on Drupal 8.5.5 on simplytest.me.
2018/07/22

[Drupal] Change CKEditor behaviour for line breaks (br or p)

Here is a little code snippet to be added in a .module file.

/**
 * Implements hook_editor_js_settings_alter().
 *
 * {@inheritdoc}
 */
function MODULE_editor_js_settings_alter(array &$settings) {
  foreach ($settings[‘editor’][‘formats’] as $name => $value) {
    // Use <br> instead of <p> on enter.
    // See: https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR.html#property-ENTER_BR.
    // CKEditor natively converts double <br> into <p> on rendering.
    $settings[‘editor’][‘formats’][$name][‘editorSettings’][‘enterMode’] = ‘2’;
  }
}

/**

* Implements hook_editor_js_settings_alter().

* {@inheritdoc}

function MODULE_editor_js_settings_alter(array &$settings) {

foreach ($settings[‘editor’][‘formats’] as $name => $value) {

// Use <br> instead of <p> on enter.

// See: https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR.html#property-ENTER_BR.

// CKEditor natively converts double <br> into <p> on rendering.

$settings[‘editor’][‘formats’][$name][‘editorSettings’][‘enterMode’] = ‘2’;

}

Additional Information

Instructions made on Drupal 8.5.x.
Will break text align buttons in the CKEditor toolbar: Issue on Drupal.org
The default behaviour of CKEditor is the following:
- Enter: inserts a paragraph directly in the WYSIWYG,
- Shift + Enter: inserts a line break.
The new behaviour of CKEditor with the hook will be:
- Enter: inserts a single line break (br),
- 2 × Enter: inserts two line breaks which will be converted into a paragraph when rendered.

2018/05/06

[Drupal] Make the Search API Page search block appear in Bootstrap markup

When using Search API Page, I needed to theme the search form in the bootstrap structure. The cleanest answer I have found is to add some variables to trigger the bootstrap overrides on the search form.

/**
 * Implements hook_form_FORM_ID_alter().
 */
function MYMODULE_form_search_api_page_block_form_alter(&$form, FormStateInterface $form_state, $form_id) {
  // We need this to make our search_api_page_block_form rendered in the bootstrap fashion
  // This code was inspired by \Drupal\bootstrap\Plugin\Form\SearchBlockForm
  $form[‘actions’][‘submit’][‘#icon_only’] = true;
  $form[‘keys’][‘#input_group_button’] = true;
}

/**

* Implements hook_form_FORM_ID_alter().

function MYMODULE_form_search_api_page_block_form_alter(&$form, FormStateInterface $form_state, $form_id) {

// We need this to make our search_api_page_block_form rendered in the bootstrap fashion

// This code was inspired by \Drupal\bootstrap\Plugin\Form\SearchBlockForm

$form[‘actions’][‘submit’][‘#icon_only’] = true;

$form[‘keys’][‘#input_group_button’] = true;

}

Additional Information

Instructions made on Drupal 8.3.x (probably, haha).

2018/01/28

[Drupal] Use admin_block and admin_block_content templates

This article is about the default admin_page, admin_block and admin_block_content templates which serves as the base of the content display on some system configuration pages such as the one on this image:

Screenshot of the configuration page on a Drupal 8 website

The code

<?php

namespace Drupal\your_module\Controller;

use Drupal;
use Drupal\Core\Controller\ControllerBase;
use Drupal\Core\Url;

class YourModuleController extends ControllerBase {

  protected $database;

  function content() {
    // Render array to return
    $mainRenderArray = [];

    // admin_page style (half width)
    $mainRenderArray[] = [
      ‘#theme’ => ‘admin_page’,
      ‘#blocks’ => [
        // Array of admin_block
        [
          ‘title’ => $this->t(‘A block, on the left’),
          ‘position’ => ‘left’,
          ‘content’ => [
            ‘#theme’ => ‘admin_block_content’,
            ‘#content’ => [
              [
                ‘title’ => ‘Do something’,
                ‘url’ => Url::fromRoute(‘your_module.some.example.route’),
                ‘description’ => $this->t(‘This will link to a route.’)
              ],
              [
                ‘title’ => ‘Navigate to a nice blog’,
                ‘url’ => Url::fromUri(‘https://blog.dakwamine.fr’),
                ‘description’ => $this->t(‘This will link to a URI, external in this case.’)
              ],
              [
                ‘title’ => ‘Go to contents page’,
                ‘url’ => Url::fromUri(‘internal:/admin/content’),
                ‘description’ => $this->t(‘Also works for internal URI.’)
              ]
            ]
          ]
        ],
        [
          ‘title’ => $this->t(‘Another block, on the right’),
          ‘position’ => ‘right’,
          ‘content’ => [
            ‘#theme’ => ‘admin_block_content’,
            ‘#content’ => [
              [
                ‘title’ => ‘Another link to a route’,
                ‘url’ => Url::fromRoute(‘your_module.another.route’),
                ‘description’ => $this->t(‘Yup.’)
              ],
              [
                ‘title’ => ‘Website example link’,
                ‘url’ => Url::fromUri(‘https://website.example’),
                ‘description’ => $this->t(‘Goes on website.example.’)
              ],
            ]
          ]
        ]
      ],
    ];

    // admin_block style (full width)
    $mainRenderArray[] = [
      ‘#theme’ => ‘admin_block’,
      ‘#block’ => [
        ‘title’ => $this->t(‘Full width block’),
        ‘content’ => [
          ‘#theme’ => ‘admin_block_content’,
          ‘#content’ => [
            [
              ‘title’ => ‘Another link’,
              ‘url’ => Url::fromUri(‘internal:/admin/people’),
              ‘description’ => $this->t(‘A link to the people page.’)
            ],
            [
              ‘title’ => ‘Another link again’,
              ‘url’ => Url::fromUri(‘https://website.example’),
              ‘description’ => $this->t(‘Goes on website.example.’)
            ],
          ]
        ],
      ],
    ];

    return $mainRenderArray;
  }

}

<?php

namespace Drupal\your_module\Controller;

use Drupal;

use Drupal\Core\Controller\ControllerBase;

use Drupal\Core\Url;

class YourModuleController extends ControllerBase {

protected $database;

function content() {

// Render array to return

$mainRenderArray = [];

// admin_page style (half width)

$mainRenderArray[] = [

‘#theme’ => ‘admin_page’,

‘#blocks’ => [

// Array of admin_block

[

‘title’ => $this->t(‘A block, on the left’),

‘position’ => ‘left’,

‘content’ => [

‘#theme’ => ‘admin_block_content’,

‘#content’ => [

[

‘title’ => ‘Do something’,

‘url’ => Url::fromRoute(‘your_module.some.example.route’),

‘description’ => $this->t(‘This will link to a route.’)

[

‘title’ => ‘Navigate to a nice blog’,

‘url’ => Url::fromUri(‘https://blog.dakwamine.fr’),

‘description’ => $this->t(‘This will link to a URI, external in this case.’)

[

‘title’ => ‘Go to contents page’,

‘url’ => Url::fromUri(‘internal:/admin/content’),

‘description’ => $this->t(‘Also works for internal URI.’)

]

[

‘title’ => $this->t(‘Another block, on the right’),

‘position’ => ‘right’,

‘content’ => [

‘#theme’ => ‘admin_block_content’,

‘#content’ => [

[

‘title’ => ‘Another link to a route’,

‘url’ => Url::fromRoute(‘your_module.another.route’),

‘description’ => $this->t(‘Yup.’)

[

‘title’ => ‘Website example link’,

‘url’ => Url::fromUri(‘https://website.example’),

‘description’ => $this->t(‘Goes on website.example.’)

]

];

// admin_block style (full width)

$mainRenderArray[] = [

‘#theme’ => ‘admin_block’,

‘#block’ => [

‘title’ => $this->t(‘Full width block’),

‘content’ => [

‘#theme’ => ‘admin_block_content’,

‘#content’ => [

[

‘title’ => ‘Another link’,

‘url’ => Url::fromUri(‘internal:/admin/people’),

‘description’ => $this->t(‘A link to the people page.’)

[

‘title’ => ‘Another link again’,

‘url’ => Url::fromUri(‘https://website.example’),

‘description’ => $this->t(‘Goes on website.example.’)

]

];

return $mainRenderArray;

}

Explanation

If you use admin_page, you will be able to define the column in which the blocks dwell: left or right.

If you use directly admin_block, there is only a single block and it will span over the full width of the region.

So all in all, here is a pseudo hierarchy to better understand how it works:

(render array base)
│
├── admin_page
│   └── admin_block  <== Half width
│       └── admin_block_content
│
└── admin_block  <== Full width
    └── admin_block_content

(render array base)

│

├── admin_page

│ └── admin_block <== Half width

│ └── admin_block_content

│

└── admin_block <== Full width

└── admin_block_content

2017/04/02

[Drupal] Base hook schema example to put in .install

Introduction

Delighted

hook_schema is one of those methods where you are happy to have a usable documentation on the api website. It is pretty much self-explanatory and you don’t have to look for hours on third parties websites to get some usable information. 🙂

hook_schema on api.drupal.org and don’t forget to select your Drupal version!
$DRUPAL_ROOT\core\lib\Drupal\Core\Database\database.api.php: another file which describes the Database API array structure!
Schema Reference on drupal.org for D7. Yeah, there is no D8 version of the docs… Hopefully, nothing has changed between D7 and D8.

After some research, I found the files which are responsible for schema to SQL statement conversion:

File location	Method name
$DRUPAL_ROOT\core\includes\schema.inc	drupal_install_schema (8.2.x)
$DRUPAL_ROOT\core\includes\database.inc (deprecated)	db_create_table (8.2.x) (deprecated)
$DRUPAL_ROOT\core\lib\Drupal\Core\Database\Schema.php	protected createTable (8.2.x)
$DRUPAL_ROOT\core\lib\Drupal\Core\Database\Driver\{mysql,sqlite,pgsql}\Schema.php	mysql: protected createTableSql (8.2.x) sqlite: protected createTableSql (8.2.x) pgsql: protected createTableSql (8.2.x)
$DRUPAL_ROOT\core\lib\Drupal\Core\Database\Driver\{mysql,sqlite,pgsql}\Schema.php	mysql: protected createFieldSql (8.2.x) sqlite: protected createFieldSql (8.2.x) pgsql: protected createFieldSql (8.2.x)

The code

<?php

/**
 * Implements hook_schema().
 */
function my_module_schema() {
  $schema[‘my_module_history’] = [
    ‘description’ => ‘Stores the history of content views blablabla.’,
    ‘fields’ => [
      ‘uid’ => [
        ‘description’ => ‘User id.’,
        ‘type’ => ‘int’,
        ‘length’ => 10,
        ‘unsigned’ => true,
        ‘not null’ => true
      ],
      ‘content_id’=> [
        ‘description’ => ‘Id of the content.’,
        ‘type’ => ‘int’,
        ‘length’ => 11,
        ‘not null’ => true
      ],
      ‘access_time’=> [
        ‘description’ => ‘Access timestamp.’,
        ‘type’ => ‘int’,
        ‘length’ => 10,
        ‘unsigned’ => true,
        ‘not null’ => true
      ]
    ]
  ];
  
  return $schema;
}

<?php

/**

* Implements hook_schema().

function my_module_schema() {

$schema[‘my_module_history’] = [

‘description’ => ‘Stores the history of content views blablabla.’,

‘fields’ => [

‘uid’ => [

‘description’ => ‘User id.’,

‘type’ => ‘int’,

‘length’ => 10,

‘unsigned’ => true,

‘not null’ => true

‘content_id’=> [

‘description’ => ‘Id of the content.’,

‘type’ => ‘int’,

‘length’ => 11,

‘not null’ => true

‘access_time’=> [

‘description’ => ‘Access timestamp.’,

‘type’ => ‘int’,

‘length’ => 10,

‘unsigned’ => true,

‘not null’ => true

]

];

return $schema;

}

2017/02/21

[Drupal] Table render array example structure

Result

The code

  public function controllerCallbackExample() {
    return [
      ‘#type’ => ‘table’,
      ‘#caption’ => ‘This is a caption. Use a translated string here.’,
      ‘#header’ => [
        ‘Header 1’, ‘Header 2’, ‘Header 3’, ‘Header 4’
      ],
      ‘#rows’ => [
        [
          ‘Row 1 Cell 1’, ‘Row 1 Cell 2’, ‘Row 1 Cell 3’, [‘data’ => ‘Row 1 Cell 4’]
        ],
        [
          ‘class’ => [‘second-row-class’, ‘may contain spaces but dont use them’],
          ‘data’ => [
            ‘Row 2 Cell 1’,
            [
              ‘data’ => ‘Row 2 Cell 2’
            ],
            [
              ‘colspan’ => 2,
              ‘data’ => ‘Row 3 Cell 3 & 4’,
              ‘style’ => ‘background-color: pink; text-align: center’
            ]
          ],
          ‘style’ => ‘font-weight: bold’
        ],
        [
          ‘data’ => [
            ‘Row 3 Cell 1’, ‘Row 3 Cell 2’, ‘Row 3 Cell 3’, ‘Row 3 Cell 4’
          ],
          ‘no_striping’ => FALSE // Not working in 8.2.x, may be fixed later
        ]
      ],
      ‘#footer’ => [
        [
          ‘data’ => [
            ‘Footer 1’,
            [
              ‘colspan’ => 2,
              ‘data’ => ‘Footer 2 with colspan = 2’,
              ‘style’ => ‘text-align: inherit’
            ],
            [
              ‘data’ => ‘Footer 4’,
              ‘style’ => ‘text-align: inherit’
            ]
          ],
          ‘style’ => ‘text-align: center’
        ],
        [
          [
            ‘colspan’ => 4,
            ‘class’ => ‘second-footer-row’,
            ‘data’ => ‘Another Footer Line’,
            ‘style’ => [‘background-color: purple;’, ‘text-align: center;’, ‘color: white;’]
          ]
        ]
      ]
    ];
  }

public function controllerCallbackExample() {

return [

‘#type’ => ‘table’,

‘#caption’ => ‘This is a caption. Use a translated string here.’,

‘#header’ => [

‘Header 1’, ‘Header 2’, ‘Header 3’, ‘Header 4’

‘#rows’ => [

[

‘Row 1 Cell 1’, ‘Row 1 Cell 2’, ‘Row 1 Cell 3’, [‘data’ => ‘Row 1 Cell 4’]

[

‘class’ => [‘second-row-class’, ‘may contain spaces but dont use them’],

‘data’ => [

‘Row 2 Cell 1’,

[

‘data’ => ‘Row 2 Cell 2’

[

‘colspan’ => 2,

‘data’ => ‘Row 3 Cell 3 & 4’,

‘style’ => ‘background-color: pink; text-align: center’

]

‘style’ => ‘font-weight: bold’

[

‘data’ => [

‘Row 3 Cell 1’, ‘Row 3 Cell 2’, ‘Row 3 Cell 3’, ‘Row 3 Cell 4’

‘no_striping’ => FALSE // Not working in 8.2.x, may be fixed later

]

‘#footer’ => [

[

‘data’ => [

‘Footer 1’,

[

‘colspan’ => 2,

‘data’ => ‘Footer 2 with colspan = 2’,

‘style’ => ‘text-align: inherit’

[

‘data’ => ‘Footer 4’,

‘style’ => ‘text-align: inherit’

]

‘style’ => ‘text-align: center’

[

‘colspan’ => 4,

‘class’ => ‘second-footer-row’,

‘data’ => ‘Another Footer Line’,

‘style’ => [‘background-color: purple;’, ‘text-align: center;’, ‘color: white;’]

]

];

}

Additional Information

Tested to work on Drupal 8.2.x.
For some reason, no_striping doesn’t work as expected in 8.2.x (it is ignored).
The script which handles the render array conversion to twig ready variables is located here: core\includes\theme.inc.
The twig template which renders the table on the default theme is here: core\themes\classy\templates\dataset\table.html.twig.

2017/02/19

Étiquette : drupal 8

[Drupal] Perfect views block configuration for multilingual node support

Objectives

Configuration

Additional information

[Drupal] Change CKEditor behaviour for line breaks (br or p)

Additional Information

[Drupal] Make the Search API Page search block appear in Bootstrap markup

Additional Information

[Drupal] Use admin_block and admin_block_content templates

The code

Explanation

[Drupal] Base hook schema example to put in .install

Introduction

The code

[Drupal] Table render array example structure

Result

The code

Additional Information