Envato Tuts+: What Is Drupal?

Drupal is a popular open-source content management system written in PHP. Having been created in the early 2000s by a Belgian student, it now powers some of the most prominent websites on the web (WhiteHouse.gov, Weather.com, etc.). It is often regarded as a competitor of CMSs such as WordPress and Joomla.

One of the most important components of the Drupal project is its community of supporters (contributors, developers, evangelists, business owners, etc.). Prominent within this community stands the Drupal Association, responsible for "fostering and supporting the Drupal software project, the community and its growth".

A giant leap from its predecessor, the 8th major release of the Drupal project has just hit the shelves. It brought about a serious modernisation of its code, practices and mentality. Many regard this shift as a real move away from the traditional notion of a CMS to more of a Content Management Framework (CMF) that provides a great platform for building complex applications.

In this article, I'm going to answer some of the more frequent questions people have about Drupal when starting up for the first time or considering doing so:

  • Is it right for me? Who is it aimed at?
  • How can it be installed, and where can I host it?
  • How can I start working with it as a developer?
  • What options do I have for extending functionality or styling it?

Who Is Drupal Aimed At?

Since the beginning of the project, Drupal has evolved from being mainly a tool for building smaller sites to one that can now power enterprise-level platforms. Especially with Drupal 8, site builders and developers can easily scale up from small websites to large platforms with many integrations. For example, the adoption of Composer allows you not only to bring external libraries into a Drupal project, but also to use Drupal as part of a bigger project of applications and libraries. It's safe to say that Drupal is flexible enough to meet the needs of a wide range of projects.

When it comes to development, Drupal has always had a relatively closed community—not because people are unfriendly, quite the contrary, but mainly because of the code typically being written in a Drupal way (resulting in what sometimes is referred to as Drupalisms). This has meant a learning curve for any developer starting up, but also less interest from developers of other PHP projects to jump in and contribute.

This is no longer the case. Especially with the release of Drupal 8, the community now promotes a new mentality of code reusability and best practice across different open-source projects. Active participation in the PHP Framework Interoperability Group is part of this effort, and using a number of popular Symfony components in Drupal 8 core is a testament to this commitment. 

With this move, the Drupal community has gotten richer by welcoming many developers from other communities and projects, and it is sure to grow even further. So if you are a Laravel developer, looking at Drupal code will no longer be so daunting.

How Can I Install Drupal, and Where Can I Host It?

Traditionally, Drupal has had a relatively easy installation process, particularly for people who at least knew their way around a Linux environment. The project simply needs to be dropped into a folder your web server can run (which needs to be using PHP and have a MySQL or MariaDB database). Then pointing your browser to the /install.php file and following the steps takes care of the rest. The most important screen you'll see is the one in which you select a specific database to use.

In terms of requirements, the LAMP stack (Linux, Apache, MySQL and PHP) environment has always been a favourite for Drupal to run in. However, it is in no way restricted to it. Solutions exist for installing it straight on Windows or Mac (e.g. using the Acquia Dev Desktop) but also on a Linux system that runs other web servers.

The easiest approach, if you go with your own setup, is to use a LAMP server for hosting. For a bit more performance you can replace Apache with Nginx, but you'll then have to take care of some specific configuration that otherwise is handled in the .htaccess file Drupal ships with.

However, if you don't want the hassle of maintaining your own hosting server, there are three main providers of specialised Drupal managed hosting: Acquia, Pantheon, and Platform.sh. These also provide a workflow for easy updates and development flow. Past that, you are looking at fully managed hosting with a Drupal development company.

How Can I Get Started Developing for It?

Developing Drupal websites has typically been the kind of thing you either liked a lot or didn't like at all. This is because when you were first introduced to Drupal, you encountered very many specificities that you didn't see in other projects. So if those tickled your fancy, you loved it forever.

With getting off this island in Drupal 8, this is no longer the case as much. You still have plenty of Drupalisms left that you can love or hate, but you now also have external components like Symfony or Guzzle and, most importantly, a more modern way of writing code in general (OOP, design patterns, reusable components, etc.). So your PHP skills from building websites with Zend will come in handy.

A good way of getting into Drupal development is to follow some online video courses. There are a couple of resources that are excellent for this purpose, most notably Drupalize.me. If, however, video is not your favourite medium, there are also many written tutorials and guides available to get you started. Check out the following links for some of the first steps you can take:

Since Drupal 8 is brand new, you'll find significantly more learning content for Drupal 7. Nevertheless, the focus in the community has been shifting recently towards Drupal 8, so you can expect more and more of these resources to crop up. And if you have no experience with any version of Drupal, it's best to focus exclusively on Drupal 8 as the changes between the two are big and perhaps you'd be facing unnecessary challenges.

How Can I Extend Drupal?

The main extension point of a core Drupal installation is its module system. 

Modules are used to encapsulate bigger chunks of reusable functionality that can/should work on different sites. Aside from the core modules, there are a large number of contributed ones, available for installation. 

Granted, most are still only for Drupal 6 and 7, but the community is catching up also for the newest version. This problem is also mitigated by the incorporation in Drupal 8 of a few popular contributed modules as well as extending the scope of what core can do out of the box (compared to Drupal 7). 

Lastly, custom modules (the ones that you write yourself) are the primary way you can add any functionality that you want and that is not available via a contributed module.

Installing modules can allow you to plug in various pieces of functionality, but you should not treat this as a green light for adding too many. It's always better to stick to the ones you actually need, and don't be afraid to be critical in this respect. You can also work on finding a good balance between contributed code and the custom one you write yourself. 

Additionally, since we are talking about open-source software, you should always evaluate the modules you install. The following indicators are good examples to pay attention to: number of downloads and usage, commit frequency, maintainer engagement, state of the issue queue.

And do keep security in mind as well. It's highly recommended you keep both Drupal core and any contributed modules up to date as this will significantly help you keep your site and server secure (though it doesn't ensure it).

What About Styling?

The styling layer of a Drupal site is handled (in large part) by its theme. Themes are similar to modules in that they are an extension point, but they have different responsibilities. They contain the styles, front-end libraries and in most cases template files that are used to output data.

There has been great progress in Drupal 8 compared to the previous version: the popular Twig engine has been adopted for templating, theming has been limited to Twig template files, debugging and overriding templates has been made much easier, etc. Similar to the advances in back-end development experience (DX), the theming layer has been made more appealing to the non-Drupal crowd. Front-end developers can now easily work with Drupal themes without having to understand the ins and outs of the back end.

Drupal core comes with a number of themes that can provide you with examples but also which you can extend from. There are also contributed themes similar to how there are modules. Popular front-end frameworks such as Bootstrap or Zurb Foundation have mature Drupal theme implementations for Drupal 7, which are also readying for Drupal 8. These work very well as base themes but also for quickly scaffolding a website and making it look decent.

Paid themes are also available to try out. Usually they are very cheap and quick to set up. The problem with them is that they are worth exactly as much as you pay for them and usually have gaping holes in their flexibility. As a beginner, these themes can seem like a great way to set up a site, and they very well may be. However, as you progress, you'll learn to avoid them and build your own, based on external designs or even plain HTML/CSS/JS templates.

Conclusion

Drupal is a powerful tool for building websites and platforms of any kind. With each new major release, Drupal has shown a commitment to better itself, become more robust and flexible, and embrace outside communities as well.

Envato Tuts+: Using and Extending the Drupal 8 Mail API: Part 2

In the previous article we looked at how we can send emails programatically in Drupal 8. We also saw how other modules can alter these outgoing mails. Today, we are going to look at how we can use the Mail API to extend this default behaviour. The purpose is to use an external service as a means for email delivery. 

For this, we will use Mandrill, although the focus of the article will not be its API or how to work with it, but rather the Drupal side of things. And remember, the working module can be found in this Git repository.

As we've seen in the previous article, sending an email in Drupal 8 happens by requesting the mail manager, passing some parameters to its mail() method, and setting up a template inside a hook_mail() implementation. What the mail manager does internally is load up the appropriate mail plugin, construct the email, and then delegate to the mail() method of whatever plugin was loaded.

But who does it actually delegate to?

Plugin Selection

An important thing to understand before writing our own plugin is the selection process of the mail manager for loading plugins. In other words, how do we know which plugin it will load, and how can we make it load our own?

The system.mail.interface configuration array holds all the answers. It contains the ids of the available plugins, keyed by the context they are used in. By default, all we have inside this configuration is default => phpmail. This means that the plugin with the id phpmail (the PHPMail class) is used as fallback for all contexts that are not otherwise specified, i.e. the default.

If we want to write our own plugin, we need to add another element into that array with the plugin id as its value. The key for this value can be one of two things: the machine name of our module (to load the plugin whenever our module sends emails) or a combination of module name and email template key (to load the plugin whenever our module sends an email using that specific key). 

An example of the latter construct is d8mail_node_insert, where d8mail is our module name we started building in the previous article, and node_insert is the email template key we defined.

So now that we know how the mail plugin selection happens, we need to make sure this config array contains the necessary information so that emails sent with our d8mail module use the new plugin we will build. We can do this inside a hook_install() implementation that gets triggered only once when the module gets installed:

d8mail.install:

1 /** 2 * Implements hook_install(). 3 */ 4 function d8mail_install() { 5 $config = \Drupal::configFactory()->getEditable('system.mail'); 6 $mail_plugins = $config->get('interface'); 7 if (in_array('d8mail', array_keys($mail_plugins))) { 8 return; 9 } 10 11 $mail_plugins['d8mail'] = 'mandrill_mail'; 12 $config->set('interface', $mail_plugins)->save(); 13 }

Not super complicated what happens above. We load the editable config object representing the system.mail configuration, and add a new element to the interface array: d8mail => mandrill_mail. We will soon create a mail plugin with the id of mandrill_mail which will be used for all emails sent by the d8mail module. And that's it.

But before we move on, we need to make sure this change is reverted when the module is uninstalled. For this, we can use the counterpart hook_uninstall() that gets called when a module gets uninstalled (there is no more module disabling in Drupal 8).

Inside the same file:

1 /** 2 * Implements hook_uninstall(). 3 */ 4 function d8mail_uninstall() { 5 $config = \Drupal::configFactory()->getEditable('system.mail'); 6 $mail_plugins = $config->get('interface'); 7 if ( ! in_array('d8mail', array_keys($mail_plugins))) { 8 return; 9 } 10 11 unset($mail_plugins['d8mail']); 12 $config->set('interface', $mail_plugins)->save(); 13 }

With the hook_uninstall() implementation we do the opposite of before: we remove our plugin id if it is set.

The install/uninstall scenario is just one way to go. You can also create an administration form that allows users to select the plugin they want and under which context. But you still need to make sure that when you disable the module defining a particular plugin, the configuration will no longer keep a reference to that plugin. Otherwise the mail manager may try to use a non-existent class and throw all kinds of errors.

Mandrill

As I mentioned before, we will work with the Mandrill API in order to illustrate our task. So let's load up Mandrill's PHP Library and make it available in our environment. There are three steps we need to do for this.

First, we need to actually get the library inside Drupal. At the time of writing, this basically means adding the "mandrill/mandrill": "1.0.*" dependency to the root composer.json file and running composer install. Keep in mind, though, that this will also clear the Drupal installation from inside the core/ folder and download the latest stable release instead. Then, you'll need to edit the root index.php file and change the path to the autoloader as per these instructions. Hopefully this last action won't be necessary soon, and I encourage you to follow the discussions around the future of Composer in Drupal 8 for managing external libraries.

Second, we need to get an API key from Mandrill. Luckily, this we can easily generate from their administration pages. Once we have that, we can store it inside a new file created on our server, at either location:

1 ~/.mandrill.key 2 /etc/mandrill.key

We can also pass the key as a constructor parameter to the main Mandrill class, but this way we won't have to hardcode it in our code. 

Thirdly, we need to create a service so that we can use dependency injection for passing the Mandrill class into our plugin:

d8mail.services.yml:

1 services: 2 d8mail.mandrill: 3 class: Mandrill

Depending on how you have loaded the Mandrill class into your application, you'll need to change the value after class. By using the composer.json approach, this will suffice.

The Mail Plugin

It's finally time to create our plugin. In Drupal 8, plugin classes go inside the src/Plugin folder of our module. Depending on their type, however, they are placed further down within other directories (in our case Mail). Let's write our class that will depend on the Mandrill API library to send emails:

src/Plugin/Mail/MandrillMail.php:

1 <?php 2 3 namespace Drupal\d8mail\Plugin\Mail; 4 5 use Drupal\Core\Mail\MailFormatHelper; 6 use Drupal\Core\Mail\MailInterface; 7 use Drupal\Core\Plugin\ContainerFactoryPluginInterface; 8 use Symfony\Component\DependencyInjection\ContainerInterface; 9 use Mandrill; 10 use Mandrill_Error; 11 12 /** 13 * Defines the Mandrill mail backend. 14 * 15 * @Mail( 16 * id = "mandrill_mail", 17 * label = @Translation("Mandrill mailer"), 18 * description = @Translation("Sends an email using Mandrill.") 19 * ) 20 */ 21 class MandrillMail implements MailInterface, ContainerFactoryPluginInterface { 22 23 /** 24 * @var Mandrill 25 */ 26 private $mandrill; 27 28 /** 29 * @param Mandrill $mandrill 30 */ 31 public function __construct(Mandrill $mandrill) { 32 $this->mandrill = $mandrill; 33 } 34 35 /** 36 * {@inheritdoc} 37 */ 38 public static function create(ContainerInterface $container, array $configuration, $plugin_id, $plugin_definition) { 39 return new static( 40 $container->get('d8mail.mandrill') 41 ); 42 } 43 44 /** 45 * {@inheritdoc} 46 */ 47 public function format(array $message) { 48 // Join the body array into one string. 49 $message['body'] = implode("\n\n", $message['body']); 50 // Convert any HTML to plain-text. 51 $message['body'] = MailFormatHelper::htmlToText($message['body']); 52 // Wrap the mail body for sending. 53 $message['body'] = MailFormatHelper::wrapMail($message['body']); 54 55 return $message; 56 } 57 58 /** 59 * {@inheritdoc} 60 */ 61 public function mail(array $message) { 62 63 try { 64 $vars = [ 65 'html' => $message['body'], 66 'subject' => $message['subject'], 67 'from_email' => $message['from'], 68 'to' => array( 69 array('email' => $message['to']) 70 ), 71 ]; 72 73 $result = $this->mandrill->messages->send($vars); 74 if ($result[0]['status'] !== 'sent') { 75 return false; 76 } 77 78 return $result; 79 } 80 catch (Mandrill_Error $e) { 81 return false; 82 } 83 } 84 }

There are a couple of things to note before getting into what the class does.

First, the annotations above the class. This is just the most common plugin discovery mechanism for Drupal 8. The id key matches the value we added to the system.mail.interface configuration array earlier, while the rest are basic plugin definition elements.

Second, the implementation of the ContainerFactoryPluginInterface interface by which we define the create() method. The latter is part of the dependency injection process by which we can load up the Mandrill service we defined in the services.yml file earlier. This makes testing much easier and it's considered best practice.

As I mentioned, the mail plugins need to implement the MailInterface interface which enforces the existence of the format() and mail() methods. In our case, the first does exactly the same thing as the PHPMail plugin: a bit of processing of the message body. So you can add your own logic here if you want. The latter method, on the other hand, is responsible for sending the mail out, in our case, using the Mandrill API itself.

As the Mandrill documentation instructs, we construct an email message inside the $vars array using values passed from the mail manager through the $message parameter. These will be already filtered through hook_mail(), hook_mail_alter() and the plugin's own format() method. All that's left is to actually send the email. I won't go into the details of using the Mandrill API as you can consult the documentation for all the options you can use.

After sending the email and getting back from Mandrill a sent status, we return the entire response array, which contains some more information. This array then gets added by the mail manager to its own return array keyed as result. If Mandrill has a problem, rejects the email or throws an exception, we return false. This will make the mail manager handle this situation by logging the incident and printing a status message.

And that is pretty much it. We can clear the cache and try creating another article node. This time, the notification email should be sent by Mandrill instead of PHP's mail(). With this in place, though, the hook_mail_alter() implementation has become superfluous as there are no headers we are actually sending through to Mandrill (and the text is HTML already). And for that matter quite a lot of the work of the mail manager is not used, as we are not passing that on to Mandrill. But this is just meant to illustrate the process of how you can go about setting this up. The details of the implementation remain up to you and your needs.

Conclusion

And there we have it. We have implemented our own mail plugin to be used by the d8module we started in the previous article. And due to the extensible nature of Drupal 8, it didn't even take too much effort. 

What's left for you to do is to perfect the mail sending logic and adapt it to your circumstances. This can mean further integration between Mandrill and your Drupal instance, constructing nice templates or what have you. Additionally, an important remaining task is writing automated tests for this functionality. And Drupal 8 offers quite the toolkit for that as well.

Envato Tuts+: Using and Extending the Drupal 8 Mail API: Part 1

In this two part series we are going to explore the Mail API in Drupal 8. In doing so, we are going to cover two main aspects: how to use it programatically for sending emails and how to extend it for using an external service like Mandrill.

To demonstrate this, in the first part we will create a custom email template that gets used for sending emails to the current user when s/he saves a new Article node. Additionally, we will see how others can alter that template in order to allow for HTML rendering of the email body instead of the default plain text.

In the second part we are going to look at extending the mail system and integrating an external API for email delivery. For this, we will use Mandrill and its PHP library that provides a good foundation for interacting with its API.

All the work we go through can be found in this Git repository as part of a custom Drupal 8 module that we will start writing here. So feel free to check that out if you want to follow along. Let's get started.

The first prerequisite of this module is its .info file:

d8mail.info.yml:

1 name: Drupal 8 Mailer 2 description: 'Demonstrates the use of the Mail API in Drupal 8.' 3 core: 8.x 4 type: module

With this out of the way, we can already enable the module on our site if we want.

How Do We Send an Email?

There are two main steps needed to send an email programatically with Drupal 8. We first need to implement hook_mail() in order to define one or more email templates. The second step is to use the mail manager to send emails using one of these templates.

Although called a hook, hook_mail() is not a typical hook but more of a regular function that generally gets called only by the same module that implements it. In other words, when you send an email programatically, you need to specify the module name implementing hook_mail() and the template id you want to use and that is defined by this hook. But we'll see that in a minute. First, how do we implement it?

d8mail.module:

1 /** 2 * Implements hook_mail(). 3 */ 4 function d8mail_mail($key, &$message, $params) { 5 $options = array( 6 'langcode' => $message['langcode'], 7 ); 8 9 switch ($key) { 10 case 'node_insert': 11 $message['from'] = \Drupal::config('system.site')->get('mail'); 12 $message['subject'] = t('Node created: @title', array('@title' => $params['node_title']), $options); 13 $message['body'][] = SafeMarkup::checkPlain($params['message']); 14 break; 15 } 16 }

This is a very simple implementation that defines one template identified as node_insert (the $key). The other two function arguments are:

  • $message: passed by reference, and inside which we add as much boilerplate about our email as we need 
  • $params: an array of extra data that needs to go in the email and that is passed from the mail manager when we try to send the email

As you can see, we are building up the $message array with values we want this email to include in all the calls. We are setting a default from value that is retrieved from the configuration system and that represents the main site email address. We set a boilerplate email subject that lets the recipient know a new node was created, followed by the name of the node (which will be passed in through the $params array). The subject is also translatable into the language that gets passed from the caller. 

Lastly, we run the message body through the string sanitiser because the text may contain HTML and it might get truncated if we don't encode the HTML elements. And since we are using the SafeMarkup class, we need to use it at the top:

1 use Drupal\Component\Utility\SafeMarkup;

Additionally, the message body is an array that will later be imploded into a string. And obviously there are many other parameters we can set, such as headers, but this will suffice for this example.

And that's all for the hook_mail() implementation. Now let's turn to the code which gets run every time a new node is created, hook_entity_insert():

1 /** 2 * Implements hook_entity_insert(). 3 */ 4 function d8mail_entity_insert(Drupal\Core\Entity\EntityInterface $entity) { 5 6 if ($entity->getEntityTypeId() !== 'node' || ($entity->getEntityTypeId() === 'node' && $entity->bundle() !== 'article')) { 7 return; 8 } 9 10 $mailManager = \Drupal::service('plugin.manager.mail'); 11 12 $module = 'd8mail'; 13 $key = 'node_insert'; 14 $to = \Drupal::currentUser()->getEmail(); 15 $params['message'] = $entity->get('body')->value; 16 $params['node_title'] = $entity->label(); 17 $langcode = \Drupal::currentUser()->getPreferredLangcode(); 18 $send = true; 19 20 $result = $mailManager->mail($module, $key, $to, $langcode, $params, NULL, $send); 21 if ($result['result'] !== true) { 22 $message = t('There was a problem sending your email notification to @email for creating node @id.', array('@email' => $to, '@id' => $entity->id())); 23 drupal_set_message($message, 'error'); 24 \Drupal::logger('d8mail')->error($message); 25 return; 26 } 27 28 $message = t('An email notification has been sent to @email for creating node @id.', array('@email' => $to, '@id' => $entity->id())); 29 drupal_set_message($message); 30 \Drupal::logger('d8mail')->notice($message); 31 }

This hook gets triggered after every node save, and all we have to do is make sure we are targeting the correct node and include our logic.

After checking that the node entity is of the type article, we load the Drupal mail manager service and start setting some values for the email. We need the following information:

  • the module name that implements hook_mail() and defines our template (what I mentioned above)
  • the template id (the $key)
  • the recipient email address (the one found on the current user account)
  • the language ($langcode) which goes inside the $params array and which will be used to translate the subject message
  • the node title that will get added to the email subject
  • the email body, which in our case will be the value of the node's body field
  • the boolean value indicating whether the email should be actually sent

We then pass all these values to the mail() method of the mail manager. The latter is responsible for building the email (calling the right hook_mail() implementation being one aspect of this) and finally delegating the actual delivery to the responsible plugin. By default, this will be PHPMail, which uses the default mail() function that comes with PHP.

If the mail manager is successful in sending the email (actual delivery is not taken into account but rather a successful PHP action), the mail() method will return an array containing a result key with whatever the mail plugin returns. Checking for that value, we can learn whether the email action was successful and inform the user that we have notified them of their action. Otherwise, we print and log an error message.

And that's about it. Clearing the cache and creating an article node should land an email in your inbox. If you are not getting anything and there are no error signs on your screen, make sure you check your server logs and mail queue to verify that emails are being sent out.

Before moving on, I would like to make a quick note regarding this hook implementation. In this example, I placed all the logic inside it directly. Additionally, I used an early return at the top, which essentially means no other logic can be added but the one specific to the article nodes. In real applications I recommend refactoring the mailing logic into a separate function or class and deferring to that. Moreover, you should not use early returns inside hook implementations but instead call other functions if the conditions are met. 

How Do We Alter an Email?

Once all of this is in place, we have another tool at our disposal that allows us to alter such an existing setup: hook_mail_alter(). This hook is called from within the mail manager before the responsible mail plugin sends the email. The purpose is to allow other modules to perform final alterations to an existent email being sent out.

Although this can be used by other modules as well, we will illustrate an example implementation from within the same module we've been working with. To this end, we will alter the email by changing one of its default headers in order to transform it from plain text to HTML. And this is how we can do this:

1 /** 2 * Implements hook_mail_alter(). 3 */ 4 function d8mail_mail_alter(&$message) { 5 switch ($message['key']) { 6 case 'node_insert': 7 $message['headers']['Content-Type'] = 'text/html; charset=UTF-8; format=flowed; delsp=yes'; 8 break; 9 } 10 }

As you can see, this is a simple alteration of the Content-Type header that transforms the email into HTML. This way plain text HTML entities will be parsed as HTML by mail clients. And using the switch case, we make sure this only happens for the email template we defined earlier.

One thing to note here is that the alter hook gets called after the relevant hook_mail() implementation. So after this, the only processing that happens on the email is done inside the format() method of the mail plugin (enforced by its interface).

Conclusion

And that is pretty much all there is to sending emails programatically using Drupal 8. We've seen the steps required to programatically set up email templates that get hydrated by the mail manager whenever we want it. We've also mentioned the default mail delivery plugin which is used to send emails in Drupal 8. And lastly, we've seen how other modules can now alter our email by adding new headers, changing the subject, concatenating values to the mail body, etc.

In the next article we are going to look at replacing the default PHPMail plugin with our own custom implementation. We will set up a mailer that uses Mandrill with the help of its PHP library. The goal is to allow our own module to use this mailer while the rest of the application continues to use the default PHPMailer.

Envato Tuts+: Create a Facebook Recent Activity Drupal Module

Image removed.Image removed.Image removed.

Enhancing Drupal's built-in functionality with new modules is one of the features that attracted a lot of developers to the platform and made it extremely popular. This tutorial will demonstrate how to create a Drupal module, using techniques recommended by Drupal gurus.

Before getting our hands dirty, let's take a look at what are we going to learn.

Prerequisites

In order to fully understand the information presented in this tutorial, you need to have the following knowledge:

  • basic Drupal administration including installing Drupal, enabling a module, adding some content
  • basic PHP knowledge

Drupal Hooks

The Drupal codebase is modular and consists of two parts:

  • the core modules (the core)
  • the contributed modules (the modules)

The core provides all the basic Drupal functionalities, and the modules add more features to the base installation. Interaction between modules and the core is done via "hooks".

According to Drupal's documentation:

"A hook is a PHP function that is named foo_bar(), where foo is the name of the module (whose filename is thus foo.module) and bar is the name of the hook."

So, the hook is a function with a special name that is called by the Drupal system in order to allow modules to include their functionality to the core. The file containing these functions also has a special name which allows the core to find all the installed modules.

The Drupal API provides the developer with a large number of hooks with which to alter almost the whole functionality of the core. For a Drupal developer, the sky is the limit for creating a site based on this powerful CMS.

Separating the basic functionality from the auxiliary features enables an increased flexibility on performing administrative tasks such as upgrading Drupal to a newer version. Since the core is somehow independent on modules, this operation can be done just by overriding the core.

What We're Building Today

We need a realistic goal for implementing our module, and I think Facebook integration is the perfect idea. We will allow the user to "like" our articles by adding a Facebook 'Like' button to each of them. The second task of our module will be to show, in the sidebar, which articles were liked by the users.

Obtaining the Data

Since the main focus of this article is on how to implement a Drupal module, we will use the simplest method to retrieve the data from Facebook: Social Plugins. Social Plugins allow users to add Facebook elements to your site with only a single line of code, which can be taken out with copy/paste from the Facebook site.

Our final product will have an output which should look like so:

Image removed.

Step 1: Setup

Drupal searches for contributed modules in the sites/all/modules folder of your Drupal installation. In case an administrator decides to have multiple sites driven by one Drupal installation, the path to the contributed module will look like sites/subdomain/modules.

First, let's choose a name for our module. Since its task will be to add Facebook functionality to our site, I assume "facebook" will be a proper name for it. We can start preparing the required directory structure for developing our module.

Inside sites/all create a subfolder, named modules. We will store our contributed modules in a subfolder named custom. The Facebook module will reside in the facebook subdirectory of the custom directory. The final structure will look like so:


Image removed.

Step 2: Inform Drupal about our Module

Drupal presents the user with a list of core and contributed modules based on the content of sites/all/modules. For each module present, Drupal searches for a file named module_name.info. This file should contain information about the specific module and Drupal displays this information to the user.

Let's create the info file for our module. Create a file, named facebook.info in the sites/all/modules/custom/facebook folder, and add the following code to it:

1 2 ; the module's user friendly name, will be displayed in the modules list 3 name = Facebook Recent Activity 4 ; the module's description, will be displayed in the second column in the modules list 5 description = Retrieves and displays in a block the recent activity data from Facebook. 6 ; the module's package, will be the name of the module's group on the modules list page 7 package = Nettuts+ Drupal Module Tutorial 8 ; the Drupal core package 9 core = 7.x 10 ; the files array indicating which files are part of the module 11 files[] = facebook.module

The code above reveals the required information to be placed in an info file. Notice that we've referenced the facebook.module in the files array. This file will contain our module's code. For the moment, go ahead and create an empty file in our folder.

The .info file is a standard .ini file; therefore, the lines starting with ";" are comments.

Checkpoint

Now, let's check what we've done so far. Visit your website and select Modules from the upper main menu. The modules list should be displayed, and at the bottom of it, you will find a new module group, named Nettuts+ Tutorial Module containing our module. Check out how the information you've placed in the info file is displayed here.

Image removed.Image removed.Image removed.

Step 3: Add the Like Button

We need to add the code provided by Facebook to the Drupal code that processes the node. This can be done by implementing hook_node_view.

As we will find in a moment, implementing hook_node_view requires using the theme function.

A theme function is a Drupal API function that is used to allow desginers to theme the modules as desired. The fact that we will use the function also means that we will have to implement hook_theme too.

Retrieving the Code from Facebook

The Facebook code that displays the 'Like' button on the pages can be obtained here. You can customize the look of the button using the controls on the page. Pressing the Get Code button displays the required XFBML code.

Image removed.Image removed.Image removed.

Implement hook_node_view

The hook_node_view returns the renderable view of the nodes (articles or pages for instance). Using this hook, we can add custom code to the one generated by Drupal by default. The implementation of this hook looks like so:

1 2 /** 3 * Implements hook_node_view(). 4 * 5 * Returns the renderable view of our nodes (pages or articles). 6 * We want to moddify the code so that we add the like button 7 * to our pages. 8 */ 9 function facebook_node_view($node, $view_mode, $langcode) 10 { 11 $node->content['facebook'] = array( 12 '#markup' => theme('facebook_add_like_button'), 13 ); 14 }

The name of the function is facebook_node_view, so you can deduce that it is composed from the name of our module and the name of the hook.

The parameters are:

  • $node -- contains the node data that will be rendered lately
  • $view_mode -- specifies how the node is displayed (can be full mode, teaser etc.)
  • $langcode -- to control the language code for rendering

We modify only the $node parameter and the result will be that our 'Like' button will appear also when a node teaser is displayed. I leave it as an exercise for you to modify the code to display the Like button only on full pages.

The code adds a new key to the $node->content array, which says that the markup for the facebook module will be rendered by the facebook_add_like_button function.

Implement hook_theme

This hook should be implemented to register the implementation of the theme function.

1 2 /** 3 * Implements hook_theme(). 4 * 5 * Just to let Drupal know about our theme function. 6 */ 7 function facebook_theme() 8 { 9 return array( 10 'facebook_add_like_button' => array('variables' => NULL), 11 ); 12 }

The code returns an array containing the name and parameteres of the function. In our case, we don't require any parameters, so the array of variables is set to NULL.

Implement our theme Function

Finally, we've reached the moment when we can add the code taken from Facebook to our module. This can be done like so:

1 2 /** 3 * Function to add the desired code to our page. 4 */ 5 function theme_facebook_add_like_button() 6 { 7 $output = '&lt;div id="fb-root"&gt;&lt;/div&gt;&lt;script src="http://connect.facebook.net/en_US/all.js#appId=221371084558907&xfbml=1"&gt;&lt;/script&gt;&lt;fb:like href="http://www.facebook.com/profile.php?id=100000782572887" send="true" width="450" show_faces="true" font=""&gt;&lt;/fb:like&gt;'; 8 9 return $output; 10 }

Note that the function's name is composed from the name registered by theme hook prefixed with theme_. The function returns a string containing the code taken from Facebook.

Checkpoint

We can now check to see if everything is okay up to this point. You can activate the module by clicking on Modules from the upper menu, scrolling down to the Facebook module and activating the enable check box in front of our module.

Click on Save configuration button to enable the module. If you do not have any articles added to your site, add some now and check out the spiffy buttons that have been added.

Your posts should look like below:

Image removed.Image removed.Image removed.

Step 4: Create the Sidebar Block

Creating the sidebar block consists of two actions:

First, we have to let Drupal know about the existence of a new block and make it appear in the list of available blocks. Second, we have to write the code that displays information in the block.

This assumes implementation of the hooks: the hook_block_info, which will list our block in the block list, and hook_block_view, which contains the necessary code to display the Facebook recent activity inside the block.

Implementing hook_block_info

1 2 /** 3 * Implements hook_block_info(). 4 * 5 * Using this hook we declare to Drupal that our module 6 * provides one block identified as facebook 7 */ 8 function facebook_block_info() 9 { 10 $blocks['facebook'] = array( 11 'info' => t('Facebook Recent Activity'), 12 // leave the other properties of the block default 13 ); 14 15 return $blocks; 16 }

The block_info hook tweaks the $blocks array by adding a new key, named info to it, which contains the text that will be available on the blocks page near our Facebook module.

Implementing hook_block_view

The first thing to do is take the Facebook code, available here. We need to configure the default options: set the width to 170 and the header to false (uncheck the Show header checkbox).

We need a 170px wide block, since this is the standard Drupal block width and we will set up our own text for the header -- therefore, we don't need Facebook's title.

Let's check the code for hook_block_view:

1 2 /** 3 * Implements hook_block_view(). 4 * 5 * Returns the renderable view of our block. It takes 6 * the configured values of facebook recent activity 7 * social plugin 8 */ 9 function facebook_block_view($delta = '') 10 { 11 switch($delta) { 12 case 'facebook' : 13 $block['subject'] = t('Facebook recent activity'); 14 $block['content'] = '&lt;script src="http://connect.facebook.net/en_US/all.js#xfbml=1">&lt;/script&gt;&lt;fb:activity site="" width="170" height="500" header="false" font="" border_color="#fff" recommendations="false"&gt;&lt;/fb:activity&gt;'; 15 } 16 17 return $block; 18 }

The block view hook receives a single parameter, which is an indication of which block is rendered. We check to see if the block belongs to our module and, if yes, we add two new items to the $block array:

  • a subject string, which will be the title of the block
  • a content string, which, in our case, is taken from Facebook.

We're almost ready. Enable the module, then navigate to Structure in the main menu, then choose Blocks and scroll down to the disabled list of blocks, and set our Facebook recent activity block to be displayed in the second sidebar (which will appear on right on the default theme).

Next, press the like button for some of the articles previously created. These will appear listed in the sidebar in our freshly created block.

That's it! We're done. The result should look like so:

Image removed.Image removed.Image removed.

Wrapping Up

I hope this tutorial convinced you that creating a Drupal module isn't really as hard as you might think. Of course, this tutorial only scratches the surface of what Drupal modules can accomplish. Nonetheless, this should be an excellent starting point!

Thank you so much for reading and let me know if you have any questions!

Envato Tuts+: Intro to Drupal: Build a Simple CMS

Drupal's popularity has lately been rising. It's a great platform for setting up content management systems and community driven sites. Here, I'll give a general overview of Drupal and build a simple site for a fake client. We'll begin with outlining the client's needs, installing and configuring a few modules, creating user roles and assigning permissions, and finally we'll add in some content. We won't go into theming, as it's a bit out of the scope of this article.

1. A fake client

Let's start off with a fake client.

SmartMarks is a small marketing consulting firm, with 4 employees. Each employee would like their own blog. The site will need a few pages in addition to the blogs:

  • Home
  • About
  • Contact
  • Links
  • Blogs

Shannon, the business owner, wants full control over the site. The rest of the employees (Bill, Jean, and Terry) should only be able to write blog entries, but Bill may publish links.

The contact us form will accept the user's name, phone, email, and a short message. Submissions of the contact form should be sent only to Shannon.

Sounds pretty simple, huh? Well with Drupal, a lot of this core functionality is already built in. We'll use as much of the core functionality as we can, and we'll add in a few other modules to make building this site a breeze!

2. Install some stuff

First, start out by installing Drupal. I'll be developing this one on my local machine, but you can install it anywhere you wish. For this tutorial, I'll be working with Drupal 6.x.

To install Drupal, simply download (https://drupal.org) and unpack it, create your database, and visit http://localhost/ (or your own dev URL). Installation should be relatively simple for ya.

Image removed.Image removed.Image removed.

You'll need to create a config file. You can copy /webroot/sites/default/default.settings.php to /webroot/sites/default/settings.php. Be sure to make it writable to the server. Also, leave a copy of sites/default/default.settings.php where it is; Drupal will use it during installation.

Image removed.Image removed.Image removed.

After your config file is created, you can go ahead and install Drupal.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

On the next screen, you'll setup the first account for the site. This is the main administrator, or super user. This user will have permission to do anything and everything on the site.

Image removed.Image removed.Image removed.

And you can go ahead and specify a few server settings. If your server is configured for mod_rewrite URL rewriting, then you can go ahead and enable Clean URLs now. This will change your URLs from something like /?q=node/3 to just /node/3.

Image removed.Image removed.Image removed.

After successful installation, you can visit the site and login as the superuser.

Image removed.Image removed.Image removed.

3. Get some modules

For this site, we'll be using a few contributed modules. We'll have to download those and activate them before we can use them.

All modules that you'll install will be placed in the directory /webroot/sites/all/modules. If the modules directory doesn't exist there, just make a new one and name it modules.

Make sure to download the modules compatible with the version of Drupal that you're using. I'm using Drupal 6.x.

4. Admin Menu

This module is a must have for working with Drupal. It's not totally necessary, but it will save you loads of time.

Download it over at http://drupal.org/project/admin_menu and place it in /webroot/sites/all/modules

PathAuto & Token

Next, go grab a copy of PathAuto and Token. PathAuto is a module that will have Drupal automatically generate nice URLs. PathAuto requires Token to work.

Meta Tags (Nodewords)

Originally titled NodeWords, the Meta Tags module allows users to specify common meta tags, like meta keywords and meta description.

Get a copy of this module over at http://drupal.org/project/nodewords

CCK (Content Construction Kit)

CCK allows you to easily create new content types, without ever having to write any code! We'll use this for the company's external links section.

Get CCK at http://drupal.org/project/cck

Views

The views module allows you to configure custom views for displaying content. They're very useful when you have complex content types and categories. Here we'll use Views to display Links.

Get the Views module at http://drupal.org/project/views

Install some modules

After you've downloaded and unpacked the above modules into /webroot/sites/all/modules, you can go ahead and install them.

Visit http://localhost/admin/build/modules to turn some of them on.

For this site, we'll need to install the following. Simply check the boxes and click "Save configuration".

  • Administration - Administration Menu
  • Core - Blog
  • Core - Contact
  • Core - Path
  • Content - Content
  • Content - Text
  • Other - Meta tags
  • Other - Pathauto
  • Other - Token
  • Views - Views
  • Views - Views UI

5. Content Types

Before we work with users and roles, we'll create our Links content type. Each Link will need a title, URL, and short description.

What's a node?

Almost every piece of content in Drupal is stored as a single node. All nodes have a title and an optional description. By creating content types, you can add fields to the content type to extend the node.

In our case, each Link will need one additional field that's not provided by default, the URL.

Create a Link content type

We'll create a content type called Link. We'll then add a field to the content type called URL.

Visit http://localhost/admin/content/types/add

In the name field, enter the human-readable name. In the type field, enter a unique name for the type. The system will use this name internally. You can make it up, but generally it'll look like a variable name, lowercase and underscored. Also enter a short description of the content type.

Image removed.Image removed.Image removed.

Next we'll modify slightly this content type from the general node. In the "Submission form settings" group, instead of "Body", we'll title the body field "Short Description".

Image removed.Image removed.Image removed.

Next, we'll edit the "Workflow settings." Allow the link to be published by default, and disable automatic promotion to the front page.

Image removed.Image removed.Image removed.

And finally, disable comments on the Links.

Image removed.Image removed.Image removed.

Save the content type. If you visit the "Create Content" page, you'll now see the new content type, Link.

Image removed.Image removed.Image removed.

Additional fields with CCK

So we've got our base Link content type set up. But we need to add an additional field to each Link: URL. Visit http://localhost/content/types and "Manage fields" for content type Link.

Image removed.Image removed.Image removed.

Add a field titled "url", and name it "field_url". Choose text data and text field.

Image removed.Image removed.Image removed.

Save it. Another page will come up, with some more options. The defaults are ok for this, so just contine by clicking "Save field settings". After this, the Link content type should appear like this:

Image removed.Image removed.Image removed.

6. Views

Now let's set up a view for our new content type, Links.

Views can become quite complex, but for our example, we'll keep it very simple. We'll make a page view that displays Links. Plain and simple

Visit http://localhost/admin/build/views to get started. Click the tab "Add" to create a new view.

Image removed.Image removed.Image removed.

Name the view "Links" and choose type node.

Image removed.Image removed.Image removed.

The next few pages can grow quite complex, but be paitent. A bit of practice will get you more comfortable with views.

Firstly, we'll want our Links view to be a full page. So add a page display.

Image removed.Image removed.Image removed.

We'll have to make some settings next. Change the name and title of the view to Links. Set the "Row Style" to node, and choose to display teaser and links.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Make sure you're clicking "Update Default Display" every time.

Set the Path to "links". This will be the URL path and our page view will show up at http://localhost/links.

Then set a menu for the view. Choose "Normal menu entry", title it Links, and put it into Primary Links. (More on menus a bit later).

Image removed.Image removed.Image removed.

The Basic Settings area should be similar to this by now:

Image removed.

And finally for the view, we'll need to setup a filter. The filter will allow us to restrict the view to only display nodes of type "link".

Add a filter by using the "+" button at the top of the Filters box.

Image removed.

Scroll down until you find the filter titled "Node: Type". Check it's box, then add it as a filter.

Image removed.Image removed.Image removed.

Choose a node type of "Link".

Image removed.Image removed.Image removed.

At this point, our whole view should look very simliar to the following.

Image removed.Image removed.Image removed.

Save the view. We'll come back to it later.

7. Users, Roles, & Permissions

Next we'll set up some user roles and permissions, and then we'll create some real users. Refer to the site requirements above to refresh on what our users need to be able to do.

User settings

Only SmartMarks staff will be able to have accounts. Public registration will not be necessary for this site. So we need to restrict regsitration at http://localhost/admin/user/settings and disallow public registration.

Image removed.Image removed.Image removed.

Roles

We'll need a couple of roles. Since Shannon wants full control, we'll need an Admin role. Since Bill can modify certain things that others can't we'll setup a Manager role. And finally, the rest of SmartMarks' employees will need to belong to an Employee role.

Visit http://localhost/admin/user/roles to get started.

Create a role titled Admin.

Image removed.Image removed.Image removed.

Repeat the process to create two more roles, Manager and Employee. We should have something like this now.

Image removed.Image removed.Image removed.

Perimssions

Next, we'll define permissions for each of the roles. Visit http://localhost/admin/user/permissions to set up permissions. Set them up like so.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

Image removed.Image removed.Image removed.

You may be wondering why we didn't give Manager too many permissions. This is because we'll set Bill to also be part of the Employee role, so Manager simply needs to be able to add and edit links. All of the permissions associated with Employee will be granted to Bill.

Now that we've got roles and permissions going, we can create our sites' users.

User Role Shannon Admin Bill Employee, Manager Jean Employee Terry Employee

Go ahead and create these users at http://localhost/user/user/create, assigning roles to each of them. We should end up with something like this on http://localhost/admin/user/user:

Image removed.Image removed.Image removed.

8. Creating Content... Finally!

And finally we can start creating content. We're well over halfway done at this point.

Create pages

First off, let's begin with the home page. Visit http://localhost/content/add to create a new Page.

Image removed.Image removed.Image removed.

Enter the page title and some sample content for the home page. Set up a menu item for this page. You may also enter some meta tag info if you'd like.

Image removed.Image removed.Image removed.

Leave the URL alias setting alone. We'll let Pathauto handle it, and we'll set that up shortly.

Image removed.Image removed.Image removed.

Save the page and create another for the About page.

Image removed.Image removed.Image removed.

If you now visit the main page, you'll notice that we've got a menu already going. These items come from the pages we just made and from the view we made for Links earlier.

Create some Links

Next, we'll create a few links. Visit the create content page again, but this time choose Link. Create a few links.

Image removed.Image removed.Image removed.

After we've created a few links, we can visit the view for Links. Visit http://localhost/links to see our links. Here's what I've got. Remember this is coming from the view we made earlier.

Image removed.Image removed.Image removed.

Contact form

Drupal's built-in Contact module is totally sufficient for SmartMarks. We'll just need to set it up. Visit http://localhost/admin/build/contact and click "Add Category" to begin.

Add a category for "General Enquiries", enter Shannon's email as the only recipient, and set "Selected" to yes. This will cause this category to be the default for the contact form. (You could setup multiple categories to handle contact submissions for areas such as Sales, Support, etc.)

Image removed.Image removed.Image removed.

You may now view your contact form at http://localhost/contact

Create some blog entries

Last of the content, we'll make a few sample blog entries. We could log out, and then log back in as each user individually, creating a blog entry under each. Or, since you're already logged in as superuser, you can create a few entries and change the author to each user.

Visit http://localhost/node/add/blog and create a sample entry.

Image removed.Image removed.Image removed.

Under the authoring info, enter shannon. This entry will become Shannon's first blog entry.

Image removed.Image removed.Image removed.

Repeat that to create a blog entry for the other users (bill, terry, jean). Then visit http://localhost/blog to see the user blogs.

Image removed.Image removed.Image removed.

9. Finishing touches

We still have a few things to tidy up before we're done. We need to setup pathauto to handle automatic URL aliases, finish our menu, check out each user account, and then we'll add a few blocks to demonstrate a little about blocks.

Menus

Let's start with menus. We've already created a few menu items beneath the Primary Links menu. We did this when we created the view for Links and when we created each static page.

Visit http://localhost/admin/build/menu. Here you'll see several menus available. Choose Primary Links.

Image removed.Image removed.Image removed.

Choose "Add item". We'll create an item for the Contact form.

Image removed.Image removed.Image removed.

Note that the path is relative to the site root. So don't enter "/contact"; just enter "contact".

Repeat the above to create another menu item for user blogs, using a path of "blog". Then visit the tab "List items" to view all the menu items within the Primary Links menu. Now we can reorder the items using the drag and drop handles on the left.

Image removed.Image removed.Image removed.

Make sure to save!!!

Now our primary links in the header should be complete and sorted.

Image removed.Image removed.Image removed.

Pathauto

Next up, we'll setup pathauto to handle our nice URLs. Visit http://localhost/admin/build/path.

Before we configure paths, let's remove any existing URL aliases. You can do this by visiting the tab "Delete Aliases", then just go ahead and choose all aliases and delete them.

Image removed.Image removed.Image removed.

Now we'll setup the automatic aliases under the tab "Automated alias settings".

Open up "Blog path settings" and check the box to have the system "Bulk generate aliases".

Image removed.Image removed.Image removed.

Now open up the "Node path settings." Here we'll set up a few rules to handle paths for different node types. Use the replacement patterns (this is where the Token module comes into play) to set up appropriate paths. Make sure your URL alias scheme will produce only unique URLs! And be sure to have it "Bulk generate aliases."

Image removed.Image removed.Image removed.

Then save. Then view "List" again. You should see new aliases made for all of our existing content.

Image removed.Image removed.Image removed.

A note about URL aliases: Don't forget to delete aliases if you change your URL scheme and regenerate aliases. Deleting and recreating aliases may seem a bit scary, but the more you do it, the more confident you'll become in your URL scheme.

Blocks

Shannon just informed us that she wants the site to highlight the company's recent office move. This is a good opportunity to go over blocks.

A block in Drupal is simply a 'chunk' of content, be it a list of nodes, some static HTML, a few images, or whatever. We'll set up a simple block to hold the notice about the office move.

Visit http://localhost/admin/build/block. Add a new block by using the tab "Add block".

Image removed.Image removed.Image removed.

After adding a block, you'll have to assign it to a region for display. Assign it to the left sidebar on http://localhost/admin/build/block, and don't forget to save!!!

Image removed.Image removed.Image removed.

You may also sort them with the drag handles, like menu items.

Image removed.Image removed.Image removed.

You should now see the new block displayed in the left sidebar after save.

Image removed.Image removed.Image removed.

Check user accounts

Now we're almost there. Just want to login as the users to make sure they've got the right permissions and that they can access the links to allow them to get stuff done.

Log out of the system and log back in as Shannon. Shannon is our administrator, so let's make sure she's able to create/edit all content. After logging in as Shannon, we should see a link to create content.

Image removed.

Go through and login as each user. Just take a look to make sure each one has the permissions and links available to get stuff done. If they don't, try going back to administer user permissions, and verify that they've been granted the correct permissions. Or also make sure you've correctly assigned roles.

Set the home page

We also need to tell Drupal to use our home page as the default home page. You can do this under http://localhost/admin/settings/site-information.

Before you change this data, though, we need to grab the node id of our home page. Visit our welcome page at http://localhost/welcome-smartmarks. Click or mouse-over the "Edit" tab; we just need the node's ID.

Image removed.Image removed.Image removed.

Our home page has a node id of 1, so we'll use that for the default home page. Visit http://localhost/admin/settings/site-information and enter some data. At the bottom, you'll see a field for the default home page. Enter "node/1". Note that we're using the node id becuase of pathauto. If we were to change the URL alias of the home page, then we won't have to change its node id, since it will remain the same. Drupal will automatically print out the correct URL alias.

Image removed.Image removed.Image removed.

10. Summary

This overview only scratches the surface of what Drupal can do. Hopefully I've given you a good overview of how to get started with the system in building this very simple CMS.

Themes

Drupal supports multiple themes, and each user can even chose their own theme.

Building a custom theme is out of the scope of this tutorial. But you can download and install some contributed themes. A good starting place is over at Theme Garden. Download and unpack themes into /webroot/sites/all/themes, then enable and configure them at http://localhost/admin/build/themes. Note that whenever you activate a new theme, you'll have to visit the blocks page to assign blocks to the theme's regions.

If you're ready to start building a theme, you might want to check out the Theme Guide.

Good luck!

Good luck in your Drupal ventures, and feel free to ask questions! Also check out http://drupal.org for more information and helpful articles.

Web Wash: How to Generate Content using Artificial Intelligence in Drupal with OpenAI

The OpenAI/ChatGPT module allows you to integrate OpenAI’s artificial intelligence technology into your Drupal website. This can generate, translate, summarize content, answer questions, and more.

To use the module, you must create an OpenAI account and obtain an API key. Once you have your API key, you can install the OpenAI module on your website.

The module’s functionality is broken down into separate sub-modules. Just install the module that you plan to use.

In this tutorial, we’ll look at the following modules:

  • OpenAI CKEditor integration
  • OpenAI Content Tools

Talking Drupal: Talking Drupal #411 - D.o Issue Etiquette

Today we are talking about D.o Issue Etiquette with Tim Lehnen.

For show notes visit: www.talkingDrupal.com/411

Topics
  • Episode 361 Credit
  • Most recent changes
  • AI
  • How should project maintainers respond
  • How should the community respond
  • Consequences
  • Who developed the policy
  • Who is responsible for enforcement
  • How do these policies help maintainers
  • Anything missing
  • Future updates
Resources Guests

Tim Lehnen - @hestenet

Hosts

Nic Laflin - www.nLighteneddevelopment.com @nicxvan John Picozzi - www.epam.com @johnpicozzi Tim Plunkett - @timplunkett

MOTW Correspondent

Martin Anderson-Clutz - @mandclu

  • Brief description:
    • Have you ever wanted a simple way to view and store information about the overall health of your Drupal website? There’s a module for that!
  • Module name/project name:
  • How old:
    • Project originally created in Sep 2007, current project looking like it took over the namespacex in June 2023
  • Versions available:
    • 1.10.0-alpha11 works with D8 and above
  • Maintainership
    • Currently very actively maintained, last release was in the past couple of weeks
  • Does not have issue enabled, project page says to open issues against ox project, which currently has no open issues
  • Usage stats:
    • 3 sites
  • Maintainer(s):
    • Jon Pugh, a founding member of the Aegir project, among many others
  • Module features and usage
    • The Site module stores information about the health of your site in a fieldable, revisionable entity
    • Provides a detailed history of the state of your site, including changes to configuration with a log of who changed what, where
    • Will include data on Drupal and PHP version, Git information, and more
    • Health can be based on the core Status report, the Site Audit module report, or a custom SiteState plugin
    • Can display an overall status indicator in the toolbar, so as a site owner or maintainer you don’t have to go to the Site Status page to see it
    • That page will display more detailed information, including the “reason” for the current status, the site’s history, and more
    • Integrates with the Site Manager module (also by Jon Pugh) which provides a UI for monitoring and managing a portfolio of Drupal sites
    • You can try out Site and Site Manager as part of the Operations project (machine name ox) as a Lando-based local setup of four sites, of which one provides a dashboard for the other three

The Drop Times: The Little Things That Matter

Dear Drupal Enthusiasts,

Life, with its ironies and paradoxes, often leads us on unexpected journeys of discovery. By an irony of fate, I am sitting inside a cabin on a crisp morning, typing away on my laptop, thinking about the little things that contributed to my way to TheDropTimes. The little things that make up the Drupal community, its vision, it’s people, and it’s innovations. Robert Heinlein once said that the supreme irony of life is that hardly anyone gets out of it alive, so why bother dreaming or building a community or bringing out groundbreaking innovations, one might ask? The answer is simple; for the little things that bring goodness and happiness to the world and our lives.

This irony could be detailed in a tech world through a minuscule character bringing a colossal project to a standstill. But the beauty of that irony is how the tiniest details can hold the key to unlocking massive potential. It's a reminder that sometimes, the devil is in the details in the vast sea of complex algorithms and intricate systems. So as we travel through this challenging world of complexities and technical jargon, let's not forget to cherish our tiny 'Eureka' moments and our humbling encounters with minute characters.

As the Drupal family is hellbent on moving forward, we hold dear the specks of happiness and endure setbacks with dignity for a better and brighter world. 

While diving into last week's top picks, we can see that Drupal 11 is on its way to making its debut in 2024. The interview with Alexander Varwijk, Keynote speaker at Drupal Developer Days 2023 Vienna, on empowering things with ease on Drupal and about keeping Drupal competitive in the modern web imparts a great deal of knowledge for the readers.

Last week was all about exciting updates for Drupalists all around the world. Cécilia Levy gave a quick sneak peek into the most awaited DrupalCon Lille 2023 while she and the Lil' Rooster explored the grounds of DrupalCon Pittsburgh. We got her on vox populi during the event, and the video has just been uploaded to our LinkedIn page

The regular registration window of DrupalCon Lille is open now! The list of community gatherings anticipated in the coming days is plenty for the Drupal community, with Drupal GovCon 2023 calling for speakers, registration for Drupal Camp Atlanta 2023 being open, and Sydney Drupal MeetUp on August 17.

Another intriguing prospect for the Drupal community is the election announcement for the position of at-large Board Member in the Drupal Association Board of Directors. With Drupal at its helm, Essex County brought out a new Local Offer website to revolutionize access to support for children and young people with Special Educational Needs and Disability (SEND).

Valuebound is organizing a webinar on Headless Drupal Theming & Decoupled Architecture. At the same time, a recent article by Conquerors Software Technologies explores the transformative potential of headless CMS, focusing on Drupal 10, Strapi, and Contentstack. LN Webworks has brought out an "ultimate pre-launch guide" to see you through the process of launching the new Drupal website. In the latest blog post, imageX Media's website introduces the Single Directory Components (SDC) concept within Drupal 10.

Axelerant in its latest blog post, delves deep into the details of Olivero, Drupal 10's new default theme. Drupak's Drupal Career Development Program (DDCP) will commence on August 28, 2023, at 09:00 AM Asia/Karachi timezone. Penyaskito discusses the introduction of the Dashboard Initiative for enhanced user experience. A blog post shared by Barbarabaiweins outlines the compelling advantages of migrating to Drupal 10, solidifying its position as a leading content management system (CMS). Read here.

Stay tuned for more updates, interviews, and informative articles in the upcoming editions of TheDropTimes. Feel free to contact us with any suggestions, contributions, or feedback. Thank you for being a part of our community!

That is all for the week.

Sincerely,

Alka Elizabeth
Sub-Editor, TheDropTimes

Specbee: Getting your Drupal Website China-ready: Why and How

Did you know that the Great Wall of China was the OG 'firewall'? Not for preventing password or network attacks, but for guarding kingdoms from unwanted visitors. Now fast forward to the digital era, and guess what? China now has its very own digital barrier too - the Great Firewall of China!  To all those folks who’ve never heard of the Great Firewall of China, it is a digital shield that came into effect way back in 1998 to regulate the internet within China. Foreign information sources and networking platforms like Facebook, Google, Wikipedia, X (RIP Twitter), and thousands of others that did not comply with their domestic regulations, were blocked, censored, or restricted in access. In essence, if your Drupal website is hosted outside of China (and complies with Chinese internet regulations), there's a likelihood that its loading speed will be significantly slower for users in China. However, China's vast digital landscape offers an exciting chance for growth and connection, given its position as one of the world's fastest-growing economies. Something that you wouldn’t want to miss out on! Discover the Great Firewall of China's story, how it works, and the compelling reasons to enhance your Drupal web presence in one of the world's fastest-growing nations! The Story Behind the Great Firewall of China Long ago, in the early 2000s, when computers were becoming a big deal, China thought, "Hey, we want to make sure our people only see things we like." So, they began building the Great Firewall, a digital wall around their internet. This wall acted like a filter, keeping out things the government didn't want people to see. As years passed, around 2006, the Chinese government made the wall even stronger with more rules and technology, controlling what people could do online. Websites like Facebook and YouTube weren't accessible in China by 2009 because they didn't match the wall's rules. The Great Firewall doesn't just affect people in China; it also affects websites from other places. If a website or app isn't in line with China's rules, it might be hard for people in China to visit it. So, while your Drupal website performs great in the rest of the world, in China, it might be entirely blocked, partially blocked (some resources and elements of your site), or just too slow to load. Here’s a side-by-side visual speed test comparison of a website loading from Ireland and China. It's worth noting that, even 36.9 seconds into the loading process, the China page lacks certain resources. Yay, or Nay? While the outside world looks at the Great Firewall (GFW) as a restriction of freedom of ideas, opinions, and damage to scientific progress and innovation, many supporters would disagree. Why? Due to the restrictions on mainstream platforms like Facebook, Twitter, YouTube, Google, Whatsapp, and Amazon, China developed its own sustainable digital ecosystem. Platforms like WeChat, Weibo, Douyin (the Chinese version of TikTok) Baidu, Alibaba, and Tencent became immensely popular. It can help protect the country's information and infrastructure from cyber threats, such as hacking and malware. It allows the government to control the online content and information that Chinese citizens are exposed to, aligning with their cultural and ideological values. By filtering out certain content, social stability can be maintained and the spread of misinformation or content that could incite unrest could be prevented. How does the GFW work While people sometimes use special tricks, like tunnels or climbing over the walls (VPNs), to go around this firewall and reach places like WhatsApp or Facebook, they usually are shortlived and get banned sooner or later.  So how do they do it? Here are three techniques used to restrict access: IP Blocking - This method involves blocking specific IP addresses associated with websites or online services that the government wants to restrict. When someone tries to visit a blocked site, their request is denied by the firewall, and the site doesn't load. DNS Poisoning - Here the gateway servers manipulate the DNS server’s IP address response and filter and deny websites. Manual Censorship - There are teams of engineers, technicians, and officials who are responsible for manually reporting unauthorized content and making sure the firewall operates effectively Prepping your existing site for the Chinese market While all these measures might pose challenges for website owners, it's undeniable that China offers a market brimming with opportunities that many would want to explore. Why should you still consider Chinafying your website? Massive market potential Gives you a competitive edge (not everyone considers it!) Improved accessibility and enhanced user experience Content localization and better engagement Opens doors to partnerships, collaborations, and business opportunities However, to ensure swift loading speeds within China, your Drupal websites could require intricate modifications and a significant allocation of resources. So, what are your options? Host your website on servers located in China Use a Content Delivery Network (CDN) service with servers in China Get an in-China presence by collaborating with local digital landscape experts To improve your SEO, optimize your website for local search engines like Baidu and localize your content to China Leveraging an intelligent website optimization service like Chinafy can help resolve technical issues on slow or broken websites (more below) How does Chinafy work? Merely opting for a CDN, switching hosting providers, or upgrading network speeds may not always suffice to enhance your local content delivery. To achieve effective onshore delivery, a combined approach involving additional services is often necessary. Enter, Chinafy. “Chinafy intelligently optimizes any website to achieve virtually onshore performance, and display more fully in China”  You can check out some of their case studies here. So once you submit your website to Chinafy, here’s what happens: Step 1: Analyze to optimize Your website is analyzed to understand its structure, content, and technical aspects. This helps in identifying what parts of your Drupal website need optimization for the Chinese market. Step 2: Technical enhancement Using its Smart Action Function (rule-based optimization), Chinafy optimizes your website's technical aspects to ensure it loads efficiently in China. This might involve replacing slow/blocked resources with China-friendly ones (or sometimes removing them if no replacements are found), reducing code complexity, and enhancing overall performance. Step 3: Speed boost Chinafy then bolts websites onto fully-managed, near-China Content Delivery Network (CDN) services to achieve further performance gain They configure the CDN to cache and deliver your website's content with reduced latency, hence improving loading speeds. For websites with an onshore presence and ICP, there are also the options to leverage onshore PoPs via Chinafy. Step 4: Automated sync Once the Chinafied version is ready, a synchronization mechanism is put in place. This automated mechanism essentially acts as a bridge between the two versions of your website— the one optimized for China and the original version hosted elsewhere. Now any changes made to your original site will be automatically tracked and synchronized with the Chinese version. You can find more detailed information on “How Chinafy Works”. Final thoughts Optimizing your website for the Chinese market can offer remarkable opportunities for expansion and engagement, given China's robust economic growth and vast online population. By implementing a comprehensive strategy that combines localization, technical prowess, and adherence to local norms, you can position your Drupal website to effectively connect with Chinese users and thrive in one of the world's most dynamic digital landscapes. Ready to prep your website for the Chinese audience? Let's discuss how we can tailor your Drupal website for success in China. Reach out to us today!