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 21-33 of 33 results
Site Building

Markup in Drupal

Course
Site Building, Theming
Drupal 7
33 tutorials
Zen: Introduction and Installation Free
Why Use a Base Theme? Free
Zen: Identify HTML5 Markup in Templates
Recap: Markup in Zen
Fences: Semantic Markup for Fields
Introduction to Markup in Views
Views Unformatted List Format
Views HTML List Format
Views Table Format
Views Default Field Wrapper Markup
Views Advanced Field Wrapper Markup
Views Theme Information
Theme Developer Module and Views
Views Template Files
How to Add a Class to a View
Recap and Challenge: Markup in Views
Introduction to Markup in Panels
Overview of Layouts in Panels
Set up Demo Panel Page
Panels: Add or Remove CSS Body Classes
Panels: Add CSS Classes to the "Main" Region
Panels: Add CSS Classes or IDs to Panel Panes
Override Panel Pane Template File
What Is Style in Panels?
Recap: Markup in Panels
Introduction to Markup in Display Suite
Display Suite: Provide a Custom Layout
Display Suite: Create a Custom Layout with Drush
Display Suite: Add CSS Classes to Regions
Display Suite: Add CSS Classes to Fields
Display Suite: Add Custom HTML Wrappers
Display Suite: Utilize Field Templates
Recap: Markup in Display Suite
Site Building

What's New in Drupal 8

Course
Site Building, Theming, Module Development
Drupal 8
10 tutorials
What's New in Drupal 8: Theming
What's New in Drupal 8: Configuration Management
What's New in Drupal 8: Object-Oriented PHP
What's New in Drupal 8: Entity Field API Free
What's New in Drupal 8: Blocks
What's New in Drupal 8: Content Authoring
What's New in Drupal 8: Mobile and Responsive Features
What's New in Drupal 8: Extending and Enhancing Drupal
What's New in Drupal 8: Multilingual
What's New in Drupal 8: Site Building Best Practices
Theming

Getting Started with Responsive Web Design in Drupal

Course
Theming
Drupal 7
14 tutorials
Introduction to Responsive Web Design in Drupal Free
Setting Content Priorities that Stack up
Percentages Not Pixels: Adapting the 960px Grid
Responsive Typography
Calculating Responsive Margins and Padding
Adding the Viewport Meta Tag to html.tpl.php Free
Restoring the Natural Flow of Elements
Adding Media Queries and Breakpoints to 960.css
Configuring the Responsive Menus Module
Flexible Images and Media with CSS's max-width
Create Responsive Slideshows in Drupal: FlexSlider Free
Adapting a Fixed-Width Search Form to Flex with Its Container
Styling a Mobile-Friendly Header and Navigation
Cleaning up Tables, Up-Scaled Images, and More Fun with Media Queries
Theming

Twig Templating

Course
Theming
9 tutorials
Twig: The Basics Free
Twig Functions, Filters, and Debugging with dump
Twig Objects and Array Keys
Twig Template Inheritance
Include Other Twig Templates
If Statements with Twig Tests Free
Twig for Loops and Inline if Syntax
Debugging Mistakes and Twig Macros
Twig Tricks and HTML Escaping
Theming

PSD to Drupal Theme

Course
Theming
Drupal 7
21 tutorials
PSD to Theme Introduction Free
Introduction to the Domicile Theme Free
Theming by Component
Create a Theme Style Guide
Extract Design Assets
Create CSS Stub Files
Layout Rules for CSS Stubs
Create a Checklist of Drupal Elements
Prepare Drupal for Theming
Customize Image Styles
Create and Place Custom Blocks
Create the Theme Infrastructure
Prepare the Theme Info File
Incorporate Style Guide Stubs into the Theme
Establish Page Layout Structure with page.tpl.php
Insert Site-Wide Components into page.tpl.php
Install Your Theme
Enable Your Theme
Identify and Theme Components
Review the Completed Theme
Next Steps for Your Theme
Theming

Learning Sass and Compass

Course
Theming
20 tutorials
Introduction to the Sass and Compass Series Free
What Is a CSS Preprocessor? Free
Sass Vs. Less
What Is Compass?
Sass Terminology
Install Sass
Install Compass
Install Scout
Understand Sass Comments
Nesting Selectors in Sass
Sass Variables
Sass Mixins
Sass Functions
Sass @extend Directive
Sass Partials and Import
Compass Configuration
Compass Commands
A Look at Compass Mixins
Additional Sass Libraries
Additional Sass and Compass Tools
Theming

Introduction to Omega 3.x

Course
Theming
Drupal 7
15 tutorials
Brief Explanation of the Omega Video Series Free
Omega Overview and Terminology Free
Omega Demo Site
Create an Omega Sub-Theme
Debugging Settings in Omega
Omega Grid and Responsive Settings
Configure Zones and Regions in Omega
Add and Remove Regions in Omega
Omega Libraries, Css, and Advanced Element Settings
Export Omega Theme Settings
Understand Omega CSS and DOM
Omega Global CSS and Custom Templates
Add Template Variables in Omega
Create a New Omega Zone
Finish the 960 Robots Omega Sub-Theme
Site Building

Display Suite for Drupal 7

Course
Site Building, Theming
Drupal 7
11 tutorials
Display Suite Installation Free
Configuring a Layout in Display Suite Free
Display Suite Fields Free
Display Suite View Modes Free
Display Suite Search Display Free
Field Templates Free
Region to Block Free
Various Display Suite Extras Free
Display Suite Views Displays Free
Display Suite Exportables Free
Changes in Display Suite Version 2 Free
Theming

Advanced Theming for Drupal 7

Course
Theming
Drupal 7
17 tutorials
Introduction Advanced Theming in Drupal 7 Free
PHP for Themers Free
Altering Variables with Preprocess Functions
Adding New Variables with Preprocess Functions
Adding New Variables to a Specific Node Type
Adding Conditional CSS and Javascript
Dynamic Templates with theme_hook_suggestions
Overriding Theme Functions
Creating a Preprocess Function for a Theme Function
Function Name Suggestions
Theme Alter Hooks for CSS and JavaScript
Altering the Page from the Theme Layer
Altering Forms from the Theme Layer
Best Practices for hook_form_alter()
Theming Forms
Theme Settings
Strategies for Keeping Template Files Clean
Theming

Theming Basics for Drupal 7

Course
Theming
Drupal 7
15 tutorials
Introduction to Theming Basics for Drupal 7 Free
Preparing a Site for Theming
Enabling Themes and Theme Settings
Translating a Design into a Drupal Theme
Helpful Browser Extensions for Drupal Theming
Creating the .info File and Adding CSS
Customizing the Page Template File
Adding Regions to the Page Template
Customizing the Node Template
Creating Dynamic Templates for Specific Node Types
Using the Theme Developer Module
Add JavaScript to a Theme
Tour of Popular Page Template Variables
Add a Screenshot to Your Theme
Conclusion to Theming Basics
Site Building

Image Styles

Course
Site Building, Theming
Drupal 7
5 tutorials
Using Image Styles in Node Display Free
Creating Custom Image Styles
Using Image Styles with Views
Imagecache Actions - How to Make Circle Images
Exporting Image Styles to Code: Making Deployment Easier
Theming

jQuery and JavaScript in Drupal Series

Course
Theming
Drupal 6, 7
15 tutorials
Introduction to Jquery and Javascript in Drupal Free
Jquery Overview Free
Adding Javascript Through a Theme
The Jquery Macro Maker Demonstration Module
Adding Javascript and Variables Through a Module
Drupal.behaviors and Drupal-Specific Javascript
Making Tables Sortable with Jquery
Javascript-Related Form Api Properties
Dynamic Forms in Drupal 6: Ahah Framework
Ajax Framework in Drupal 7
Creating Ajax-Enabled Links in Drupal 7
Javascript Form Dependencies with the States System
Javascript-Related Drupal Contrib Modules
Jquery and Javascript in Drupal Review
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

Drupal version

Category

Content type

Guides

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

Navigate guides