Drupal 8

Drupal 8 Creating custom block from scratch

Drupal 8 Creating custom Block steps

Costume Module file structure (My Drupal version 8.1.2)

drupal 8 custom block structure

1. Create a folder under ‘/modules/’ for this explanation I am creating a ‘sampleblk’ (this is our module folder) folder inside module folder

2. Create module info file ‘sampleblk.info.yml’ inside sampleblk folder

3. Create sampleblk.module inside sampleblk folder

4. Create src folder and create Plugin folder inside ‘src’ and create Block folder inside ‘src\Plugin\’ folder and create SampleblkBlock.php filde (full path : modules\sampleblk\src\Plugin\Block\SampleblkBlock.php)

Here in the comment section adding some annotation @block don’t remove it  it is required. Read more about annotation

  1. ‘id’  = This property in the annotation defines the unique, machine readable ID of your block.

  2. ‘admin_label’  = This annotation defines the human readable name of the block that will be used when displaying your block in the admin interface.

drupal 8 block installation

5. Install the new module from admin

6. clear the cache

7. Add your new block (I am just adding the new block to sidebar)

drupal 8 place block

8. Check the effect

drupal8block

 

Github : https://github.com/bikeshm/drupal-8-block-sample1

Check this post alos : http://wiki.workassis.com/drupal-8-creating-custom-module-from-scratch/

  Like
By bm on June 16, 2016 | Drupal 8 | A comment?

Drupal 8 Creating custom module from scratch

‘Drupal 8 Creating custom module steps

Costume Module file structure (My Drupal version 8.1.2)

drupal 8 custome module structure

1. Create a folder under ‘/modules/’ for this explanation I am creating a ‘example’ (this is our module folder) folder inside module folder

2. Create module info file ‘example.info.yml’ inside example folder

3. Create example.module inside example folder

4. Create example.routing.yml in example folder

The path: ‘/examp’ begin with 2 space catheters. Here we are defining the end point (http://localhost/examp [ I am using ‘localhost’ for development])

5. Create controller:- for creating controller first we need to create an ‘src’ folder inside example folder inside src folder create a ‘Controller’ folder and inside it create ExampleController.php

the controller full path will be like this ‘modules/example/src/Controller/ExampleController.php’

6. Install the new module from admin

drupal 8 module installation

7. Open your favorite internet browser  hit your example URL (in my case :  http://localhost/examp) you can see the generated page

drupal 8 module page

 

GitHub : https://github.com/bikeshm/drupal-8-module-sample1

Check how to create a custom block : http://wiki.workassis.com/drupal-8-creating-custom-block-from-scratch/

 

  Like
By bm on June 15, 2016 | Drupal 8 | A comment?

Drupal 8 custom theme from scratch

Drupal 8 Custom theme folder structure

drupalcustomtheme

Minimum requirement

drupalcustomtheme-min

The theme name info yml file

careful about the spacess

Example 1 :  ‘<space><space><space>example/example-css’  (insted of example-css you can give any name but you need to specify same in theme libraries yml file)

Example 2 : ‘<space><space>header:<space>Header block’ here after ‘:<space>’ space is not mandatory

drupal-8-exampletheme

Keys (ref:-drupal.org)

The following keys provide meta-data about your theme, and define some of the basic functionality.

  • name: Fluffiness (eg:-The Example)
    Required. The human readable name will appear on the Appearance page, where you can activate your theme.
  • description:(eg:- This is sample theme for Drupal 8 🙂 ).
    Required. The description is also displayed on the Appearance page.
  • type: theme
    Required. The type key indicates the type of extension, e.g. module, theme or profile. For themes this should always be set to “theme”.
  • core: 8.x
    Required. The core key specifies the version of Drupal core that your theme is compatible with.
  • The libraries key can be used to add asset libraries — which can contain both CSS and JS assets — to all pages where the theme is active.
  • Regions are declared as children of the regions key. Note that region keys are not preceded by a dash. You are required to have a content region.

Theme name library yml file (Ref : drupal.org)

Here we will define the actual path of the css and java script file

page.html.twig (ref: drupal.org)

Default theme implementation to display a single page

You can see a screenshot.png file in the theme folder (inside example folder) this image is used to display the theme image in admin panel

drupal-8-exampletheme

You can write your own css file and js file, and also you can create your own favicon.ico, logo.png that are i am not adding here .

*Note:- If your file changes (eg:-css and js or other fildes) are not reflecting in browser do clear cache (login to your admin area configuration->Development->Performance->Clear all caches)

 

🙂

  Like
By bm on June 13, 2016 | Drupal 8 | A comment?