Guides

Not sure where to start? Our guides walk you through different skillsets and topics, like Site Building, Theming, and Module Development.

Get started
Showing 1-20 of 34 results
Theming

Introduction to jQuery Series

Course
Theming
13 tutorials
Introduction to jQuery Free
What Is jQuery? Free
Introduction to Firebug
Overview of jQuery Concepts
Using jQuery Selectors
jQuery Effects and Animations
jQuery Events
Adding jQuery Scripts
DOM Manipulation with jQuery
DOM Traversing with jQuery
Implementing AJAX with jQuery
Using jQuery Plugins
Introduction to jQuery Review
Site Building

Views UI: Query, List, and Display Content

Course
Site Building, Theming
Drupal 8, 9, 10, and 11
16 tutorials
Set up Demo Site with Views and Content Free
Add a REST Endpoint with Views Free
Overview: Filter Criteria in Views Free
Add Filter Criteria to a View
Overview: Exposed Filter Criteria in Views
Expose Filter Criteria to Users in Views
Overview: Sort Criteria in Views
Add Sort Criteria to a View
Overview: Exposed Sort Criteria in Views
Expose Sort Criteria to Users in Views
Overview: Relationships in Views Free
Add a Relationship to a View
Overview: Contextual Filters in Views
Create a Page with a Contextual Filter
Overview: Theming Views Free
Override a View's Wrapper Template
Module Development

Chapter 13: Collaborate with the Community

Course
Module Development, Community
Drupal 8, 9, 10, and 11
2 tutorials
Concept: Using and Improving Contributed Modules Free
Concept: Contributing Your Custom Modules
Module Development

Chapter 14: Final Thoughts

Course
Module Development, Community
Drupal 8, 9, 10, and 11
1 tutorials
Learning More and Getting Support Free
Theming

Get Started Using React and Drupal Together

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
14 tutorials
Introduction to React and Drupal Free
React Basics
Decoupled vs. Progressively Decoupled
Connect React to a Drupal Theme or Module Free
Create a React Component
Add Webpack and React Fast Refresh to a Drupal Theme
Retrieve Data from an API with React
Use React to List Content from Drupal
Create, Update, and Delete Drupal Content with JavaScript
Build an Interface to Edit Nodes with React
Create a Fully Decoupled React Application Free
Use create-react-app to Start a Decoupled React Application
Make API Requests with OAuth
Use Fetch and OAuth to Make Authenticated Requests
Theming

Output Themeable Content in Drupal

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
10 tutorials
Output Plain Text and Simple HTML Markup
Use #prefix and #suffix Properties to Wrap an Element
Use Render Element Types in a Render Array
Output a List of Items
Output a Table
Output Content with a Template File
Add Classes and HTML Attributes to Render Arrays
Generate URLs and Output Links
Get Information about the Current User
Use #access to Show/Hide Elements in a Render Array
Theming

Using JavaScript in Drupal

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
10 tutorials
Overview: JavaScript in Drupal
Load JavaScript in Drupal with Drupal.behaviors
Wrap Your Custom JavaScript in a Closure
Use Server-Side Settings with drupalSettings
String Manipulation in JavaScript
Use Drupal.theme for HTML Markup in JavaScript
Standardize Your JavaScript with ESLint
Modernizr.js in a Theme or Module
Underscore.js in a Theme or Module
Backbone.js in a Theme or Module
Module Development

Internationalization (i18n) in Drupal

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
3 tutorials
Make Strings Translatable
Use Drupal.t() for Translatable Strings in JavaScript
Make Your Theme Translatable
Theming

Themes in Drupal

Course
Theming
Drupal 8, 9, 10, and 11
7 tutorials
What Is a Theme? Free
Download, Install, and Uninstall Themes Free
Theme Settings Overview
Change Theme Settings
Add a Screenshot to Your Theme
Core Themes: Bartik Free
Core Themes: Stark Free
Theming

Creating Themes in Drupal

Course
Theming
Drupal 8, 9, 10, and 11
10 tutorials
Structure of a Theme
Start a New Theme with Starterkit
Describe Your Theme with an Info File
Theme Inheritance with Base Themes
Drupal Base Themes: Stable and Classy
Use a Base Theme
Regions
Add Regions to a Theme
Fast by Default
Configure Your Environment for Theme Development
Theming

Template Files in Drupal Themes

Course
Theming
Drupal 8, 9, 10, and 11
6 tutorials
What Are Template Files?
Override a Template File
Determine the Base Name of a Template
Inspect Variables Available in a Template
Overview: Theming Views Free
Override a View's Wrapper Template
Theming

Using Twig in Drupal Templates

Course
Theming
Drupal 8, 9, 10, and 11
10 tutorials
Twig in Drupal
Twig Syntax Delimiters
Arrays and Objects in Twig
Loops and Iterators in Twig
Print Values from a Field with a For Loop
Twig Filters and Functions
Whitespace Control with Twig
Classes and Attributes in Twig Templates
Create Links with Twig in a Template File
Twig Template Inheritance
Theming

Asset Libraries in Drupal

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
4 tutorials
What Are Asset Libraries?
Define an Asset Library
Attach an Asset Library
Extend or Alter Existing CSS and JavaScript Asset Libraries
Theming

Preprocess Functions in Drupal Themes

Course
Theming
Drupal 8, 9, 10, and 11
4 tutorials
Add Logic with THEMENAME.theme
What Are Preprocess Functions?
Change Variables with Preprocess Functions
Add Variables to a Template File
Theming

Theme Hook Suggestions for Drupal Templates

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
2 tutorials
Discover Existing Theme Hook Suggestions
Add New Theme Hook Suggestions
Theming

Hands-On Theming Exercises for Drupal

Course
Theming
Drupal 8, 9, 10, and 11
10 tutorials
Set Up Demo Site for Theming Practice Free
Exercise: Create a New Theme
Exercise: Add an Asset Library
Exercise: Configure Your Environment for Theme Development
Exercise: Override the Main Page Template
Exercise: Override the Node Template
Exercise: Override the Main Menu Template
Exercise: Override the Image Field Template
Exercise: Use the t Filter in a Template
Exercise: Preprocess Functions
Module Development

Settings Forms in Drupal

Course
Theming, Module Development
Drupal 8, 9, 10, and 11
2 tutorials
Create a Settings Form in a Module
Customize Theme Settings
Site Building

Layout Builder in Drupal

Course
Site Building, Theming, Site Administration
Drupal 8, 9, 10, and 11
14 tutorials
Introduction to Layout Builder Free
Create a Flexible Layout for a Content Type Free
Change the Layout on a Per-Page Basis
Limit Blocks Available in Layout Builder with Block List Override
Use Layout Builder Restrictions to Configure Available Layouts and Blocks
Layout Builder Design Patterns
Implement the Layout Builder View Modes Pattern
Use Layout Builder Modal When Creating Custom Blocks
Define Custom Layouts in a Module or Theme
Comparison of Layout-Building Approaches in Drupal
Tips for Theming with Layout Builder
Add Views to a Layout
How to Add Custom Styles in Drupal's Layout Builder
Adding Asset Libraries to Custom Layouts
Module Development

Layout Builder API in Drupal

Course
Site Building, Theming, Module Development
Drupal 8, 9, 10, and 11
3 tutorials
Dynamic Layout Plugins in Drupal's Layout Builder
How to Create a Layout with Configurable Settings in Drupal's Layout Builder
Build Dynamic Custom Layouts with Derivatives
Site Administration

Managing Media in Drupal

Course
Site Building, Theming, Module Development, Site Administration
Drupal 8, 9, 10, and 11
12 tutorials
Overview: Media Management in Drupal Free
Overview: Media Types, Media Entities, and Media Fields in Drupal Free
Add a Media Field to a Content Type in Drupal
Find, Add, Edit, and Delete Media Entities in Drupal
Use Drupal Media Library to Browse Media Entities
How to Add a Media Button to a WYSIWYG Editor in Drupal
How to Add Fields to a Media Type in Drupal
Map Media Source Data to Custom Fields
Overview: Access Control for Media Entities in Drupal
Customize the Drupal Media Library Browser Widget
Track Media Entity Usage in Drupal
Use View Modes with Media Entities in Drupal

Drupal version

Category

Content type

Guides

Not sure where to start? Our guides provide useful learning tracks for all skill levels.

Navigate guides