In this exercise you will demonstrate your ability to attach JavaScript to themes, and use Drupal behaviors to enhance the functionality of a website.
In this exercise you will demonstrate that you understand the concept of responsive CSS and the methods which can be used to implement it in a Drupal theme.
In this exercise you will demonstrate your ability to create a custom theme as a subtheme based on Zen and use Sass.
This exercise will have you demonstrate an understanding of Drupal themes and how to develop CSS to theme the default markup created by Drupal, with particular reference to CSS naming conventions.
Drush is the command line shell and Unix scripting interface for Drupal. The most common way to install Drush is to install it on a per-project basis using Composer. We'll walk through the steps to do that, as well as how to set up the Drush Launcher tool (to make it possible to execute Drush commands without having to specify a full path to the executable).
In this tutorial we'll:
- Install Drush
- Verify it worked
By the end of this tutorial you'll have Drush installed.
Installing Drupal using the instructions in this tutorial will give you a working Drupal site that can be used for learning, or real-world project development.
Before you can work on a Drupal site locally (on your computer), you'll need to set up a local development environment. This includes all the system requirements like PHP and a web server, that Drupal needs in order to run. Our favorite way to accomplish this is using DDEV.
In this tutorial we'll learn:
- How to install and configure DDEV for use with a Drupal project.
- How to use DDEV's integrated Composer to download Drupal and Drush.
- How to install Drupal inside DDEV so you can access the site and start doing development.
By the end of this tutorial, you should be able to set up a local development environment for learning Drupal or working on a new Drupal project.
Standardized documentation is crucial to a project, whether it is just you or an entire team working on it. In this tutorial we're going to look at:
- Standards for
@docblock
comments - Standards for inline comments
- Why standards for documentation and comments are as important as standards for the rest of your code.
By the end of this tutorial you'll know how to add inline documentation for all the PHP code that you write for Drupal.
Formatting standards cover things like the use of whitespace, how to format control structures, and other aspects that affect your code's appearance and format.
In this tutorial we’ll talk specifically about standards regarding formatting. This is by no means an exhaustive list of PHP syntax rules, but rather is focused on formatting standards for Drupal.
By the end of this tutorial you'll know about the most common Drupal code formatting standards as well as where to find more information when questions arise.
Translations have their own special functions in both Drupal 7 and 8, and there are some rules for standardizing how they are used that make things clearer for everyone.
In this tutorial we'll look at:
- When to use, and when not to use, translation utilities to output translatable strings
- How placeholders work in translatable strings
- Tips for creating links inside of translatable strings
By the end of this tutorial you should know when, and how, to make strings in your code translatable using Drupal's translation utility functions.
Once you know what code standards are and why you should use them, you need to learn how to implement Drupal coding standards in your projects. This tutorial will walk through some of the steps you can take to make this as easy as possible. We'll cover:
- Configuring your editor or IDE to warn you of coding standards violations
- Setting up the Coder module and phpcs to scan and review your code
- Performing team code reviews
By the end of this tutorial you should be able to configure your development environment and implement processes in your workflow that help to ensure your code meets Drupal's coding standards guidelines.
Before you dive into using coding standards it makes sense to understand exactly what they are and why they’re important, generally and specifically in the Drupal community. In this tutorial we will look at:
- What coding standards are
- Why following coding standards is a good idea
- Where coding standards come from
By the end of this tutorial you'll have a better understanding of what coding standards are, and why you should be adhering to them when you write code.
Goes through how to implement the AHAH framework in Drupal 6 in order to provide more dynamic interactions on a Drupal form.
See how the new JavaScript APIs and ajax framework in Drupal 7 allows you to implement dynamic behaviors without having to register a menu callback in the menu system or to write any jQuery code.
Learn how to integrate jQuery scripts into Drupal, and how to leverage the JavaScript capabilities of the Drupal API in both 6.x & 7.x
Jeff Robbins and Nate Haug introduce the jQuery and Drupal integrations that we'll be building in this series, based on the foundations of theming, module development, and jQuery.
- How to add jQuery to a theme
- How to utilize Drupal's drag and drop behavior to reorder elements on a page within any form that has orderable items
- Drupal's direct integration with jQuery through the Forms API in Drupal 6 and Drupal 7
- Building a highly optimized AJAX request to Drupal that will return a JSON result
- The JavaScript state system in Drupal 7
Note: The examples in the video span across Drupal 6 and Drupal 7, and jQuery code that will work either in jQuery version 1.2.6 or 1.4.
jQuery Overview
FreeProvides a high-level overview of jQuery to people who are brand new to this JavaScript library.
This lesson shows the steps and code to add on the Drupal side in order to load JavaScript scripts to you site. One thing to note is that the HTML5 placeholder attribute makes this plugin invalid markup.
NOTE:
There is a minor change between Drupal 6 and Drupal 7, where you should use function($)
to wrap your code. For Drupal 7 you can use:
(function($) {
$(document).ready(function() {
$('#search input.form-text').autofill({
value: Drupal.t('Search...'),
});
});
}(jQuery));
Goes over the Macro Maker demonstration module in order to show what functionality we will be building over the next couple of chapters.
Shows how to pass variables from the PHP and Drupal side over to the front-end JavaScript scripts that are running so that you can use the Drupal interface to create customized settings that will appear in your jQuery scripts.
Goes into depth about some of the JavaScript constructs and tools that Drupal provides when writing JavaScript for Drupal. Topics include using Drupal.behaviors and variable settings.
There where a couple of changes to the Drupal.behaviors system for D7. You can find out more information about the changes here: http://drupal.org/update/modules/6/7#drupal_behaviors
And more general information about using the new system here http://drupal.org/node/756722
Once you've converted from the old Drupal.behaviors.myModule = function(context)
to the new syntax
Drupal.behaviors.myModule = {
attach: function(context, settings),
detach: function(context, settings)
}
The rest is pretty much the same.