Skip to main content

WE HAVE A TIMEOUT HERE!

We are currently experiencing technical difficulties. Click here for more information…

Creating A Drupal 8 Theme

Gym Short

Creating A Drupal 8 Theme will show you how to take your existing static website and convert it into a dynamic theme for Drupal 8. Couple your existing knowledge of HTML and CSS with the easy to use TWIG templating engine to create fast, secure, and flexible themes for the Drupal CMS. No PHP required!

About This Course

This course will teach you how to install Drupal 8 locally and dive into the essential components of a Drupal 8 theme. Specifically, you will learn the following: How to register a theme with Drupal 8, how to integrate Bootstrap into a theme, how to use the TWIG templating engine to define and customize Drupal components and how to import pre-existing assets including images and CSS styles.

Course Outline

  • Chapter 1: Introduction to Drupal 8 Themes

    The first step in creating a custom theme is to set up a local development environment for Drupal on your system. In order to do this you will learn how to install Aquia's Dev Desktop and be up and running in approximately 5 minutes.

  • Chapter 2: How to Import an Existing Site and Create a New One

    Dive deeper into Aquia's Dev Desktop and learn how to import an existing Drupal site as needed. Additionally, learn how to start a Drupal 8 site from scratch if you do not have pre-existing content.

  • Chapter 3: Drupal 8 and the Theming Layer

    Review how Drupal 8 works and how a page is structured. You will survey some of the components you will be configuring for your theme including pages, regions, blocks, nodes, and fields.

  • Chapter 4: Starting Your Theme

    Learn how to create the file and folder structure required to register a theme with Drupal 8. Additionally you will learn how to integrate Bootstrap in order to give yourself basic responsive layout and simple styles for your text.

  • Chapter 5: Hello TWIG

    Learn the fundamentals of using TWIG, the templating engine for Drupal 8. You will discover how to print variables, how to loop through items, and how to comment your code.

  • Chapter 6: Tweaking TWIG

    In this chapter you will learn how to optimize your default TWIG files for local development purposes. Specifically, you will discover how to work with the cache settings in order to make your life easier!

  • Chapter 7: Creating Custom Templates

    In this chapter you will examine some of the default content types created with a clean Drupal install and then learn how to customize the block layout. Specifically you will learn how to remove a sidebar and customize the header of your theme using TWIG.

  • Chapter 8: Adding Assets and Style

    Give your theme some substance and style by importing images and stylesheets for a custom page template. Additionally, dig a bit deeper into TWIG logic by exploring variables and creating some page logic using an "if/else" statement.

  • Chapter 9: Custom Templates For Specific Page Types

    Learn how to add articles and basic pages in Drupal and then configure those templates accordingly with TWIG.

  • Chapter 10: Getting Twiggy With It

    Apply a few finishing touches to your theme, review what you have learned and get some resources for learning more about TWIG and Drupal 8.

Prerequisites

  • Basic to Intermediate competency with HTML and CSS
  • Knowledge of inspecting code with browser developer tools is highly recommended, although not mandatory
  • This course assumes introductory-level experience with any version of Drupal

Software Requirements

  • Mac or Windows desktop or laptop
  • Acquia Dev Desktop
  • A text editor built for HTML/CSS (We suggest Atom, it’s free, and available for Mac, Windows, and Linux)
  • Google Chrome web browser

This Course is For

  • Developers
  • Designers with coding chops
  • Drupal 8 beginners

Meet the Instructor

Glenn Hodgkinson

Glenn Hodgkinson

Glenn is an open-source web developer with over 15 years experience and has been a co-author to several Digital Classroom books. He has worked on projects for enterprise-level clients such as Google, Microsoft, and Nikon, as well as contributed to projects for local non-profit organizations.

Glenn currently teaches Drupal, WordPress, HTML5, and UX design workshops at the American Graphics Institute. He is also the Senior Technical Lead at Thinkbean, a certified Drupal development company located in Boston, MA.

Enroll