Skip to content

Training documents for "Drupal 8 Theming for Drupal 7 Themers"

Notifications You must be signed in to change notification settings

chapter-three/drupal-8-theming

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

98 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Drupal 8 Theming Training

Description

Are you struggling with Drupal 8 theming? New to Drupal or Drupal 8?

Let's take it from the top!

This hands-on training will take you step-by-step through the process of creating a custom theme in Drupal 8. There will also be time for Drupal Q&A.

Along the way, we'll cover:

  • Setting up Your local development environment
  • Working with YAML files
  • Adding assets responsibly
  • Getting, modifying and display Drupal data in the template
  • Cool Twig tips and Tricks
  • Preprocessing template functions and hooks
  • Basic OOPHP principles
  • Kint, theme_debug and other changes to debugging
  • Leveraging new Drupal 8 site building paradigms to make theming easier
  • Where to find help

Notes:

  • All terminal commands are run from the Drupal root.

  • $ indicates a prompt. You do not need to type it into the terminal window.

  • MYDRUPAL refers to the Drupal root directory or base URL.

  • You'll have an easier time if you configure your editor to use spaces instead of tabs.

  • Feel free to ask any of the "Questions you may have ..." someone probably asked the question before!

  • If you're using Lando, composer becomes lando composer, drush becomes lando drush.

  • See a mistake or typo? Submit a pull request on Github!

  • Common hiccups are:

    • Syntax errors
    • Too many or not enough spaces in .yml files
    • Cache not cleared
    • PHP memory limit not high enough (>= 256)
      • settings.php
        • ini_set('memory_limit', '512M');
      • php.ini
        • 'memory_limit' = '512M'

Basic terminal commands used.

Change Directory.

cd

Create File.

touch (new-item on Windows PowerShell)

Create Folder.

mkdir

Move file from one location to another.

mv

Copy file to a new location.

cp (copy on Windows PowerShell)

Final Folder Structure

MYDRUPAL/themes/custom
                    └── acme
                        ├── acme.breakpoints.yml
                        ├── acme.info.yml
                        ├── acme.libraries.yml
                        ├── acme.settings.yml
                        ├── acme.theme
                        ├── css
                        │   ├── css-stuff-print.css
                        │   ├── css-stuff.css
                        │   └── custom-widget.css
                        ├── images
                        │   └── mysvg.svg
                        ├── js
                        │   └── custom-widget.js
                        ├── templates
                        │   ├── block
                        │   │   └── block--system-powered-by-block.html.twig
                        │   ├── html
                        │   │   └── html.html.twig
                        │   ├── node
                        │   │   └── node.html.twig
                        │   └── page
                        │       └── page.html.twig
                        └── theme-settings.php

Exercises

Exercise 1 - Local Setup

Exercise 2 - Add Content

Exercise 3 - Contrib Themes

Exercise 4 - Dot Info File

Exercise 5 - Libraries

Exercise 6 - Intro to Twig

Exercise 7 - Regions

Exercise 8 - Dot Syntax

Exercise 9 - Twig Classes

Exercise 10 - Twig Filters

Exercise 11 - Twig Blocks

Exercise 12 - Include SVG

Exercise 13 - Preprocess Function

Exercise 14 - Template Suggestions

Exercise 15 - Add Classes with PHP

Exercise 16 - Form Alter

Exercise 17 - Responsive Images

Exercise 18 - Custom Theme Settings 1

Exercise 19 - Custom Theme Settings 2

Style Guides for Contributors

Path to files and directories.

MYDRUPAL/themes Path to files and directories.

Name of file or directory

node.html.twig

Code.
 $ cd drupal
Url

http://MYDRUPAL/admin/config

Done ☺

About

Training documents for "Drupal 8 Theming for Drupal 7 Themers"

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages