Mar 26 2020
Mar 26

The Covid-19 pandemic has shaken the entire world. The future seems uncertain and things aren’t going the way as planned. Yet, businesses must hang in there and assure their users on what they should expect from them. We have helped some of our clients create banner announcements on their Drupal websites to let their customers know –

  • They are still operational 
  • Their working hours
  • How they can help better in these uncertain conditions
  • Precautionary actions that are underway
  • Restrictions on available services
     
covid-drupal  
     Great Southern Homes' Covid-19 Response Announcement

Of course, these announcement banners can be leveraged for any kind of informational messages that need to be displayed for a certain period of time. Let’s take you through this in two different ways. One is by creating a custom pop-up for announcements using Bootstrap modal in Drupal 8. This method offers more flexible customizations and detailing. The other option is a simpler one using the Drupal 8 Site Alert module.

Creating a custom pop-up for announcements using Bootstrap modal In Drupal 8

For a fully customized announcement banner with a decent theming, editable announcement based on the user’s selection, we can go with this option. Showing banners to the visitors depends on the selection made in the configuration form.

Step 1: Since we are building a custom announcement banner, we need to have a custom module as every feature in Drupal is a module. Build the custom module according to these instructions

Step 2: Also, the announcement needs to be configurable. We need to create an editable configuration form with required field. Follow these instructions to create configuration forms.  

Step 3: Create a plugin block for fetching the configuration form values in a custom module. Follow these instructions to create the custom block. All the validations and access should be handled within the plugin block. We will need to attach the configuration value to Javascript to build a modal pop-up in JS.

Step 4: Create a libraries.yml for defining the libraries for displaying the modal popup using bootstrap. Also Write a Javascript logic to render the announcement data into the modal. Follow these instructions to add JS to the Drupal 8 module. 

Step 5: Create a menu link for easy navigation in the custom module according to these instructions

Step 6: Place the created block in a region for the configurations provided in custom configuration form.

Now you should be able to see the pop-up in the region for the specified path based on the configuration selection.

Custom pop-up for announcements using Bootstrap modal In Drupal 8 
   Custom pop-up for announcements using Bootstrap modal In Drupal 8

Creating site announcement banners using the Site Alert Drupal module

This Drupal module has been around since Drupal 7. The Site Alert Drupal module is lightweight and simple which lets you create a site-wide informational message. It allows you to specify a start date and expiration date, severity of the alert message that is symbolized by the background color of the announcement and the content. 


Setup –

1.Enable the Site Alert module

Configuration->System->Manage Site Alerts in path

 2.Create the announcement/alert

admin/config/system/site-alerts

3. Place and configure the Site alert block from block layout according to your requirements

Structure -> blocks
Drupal.org
              Image source - Drupal.org drupal site alert                    
                                 Site Alert
Mar 24 2020
Mar 24

If you have studied some form of software design or are into designing, you should be familiar 
with the terms - "UI" and "UX". Yet, sometimes we tend to use both these words interchangeably. 
So, what sets UI apart from UX?
UX design is what makes an interface functional in its simplest forms and UI design is what makes an interface appealing and beautiful.

UI-UX Design

What is a UI Design? 

User Interface is something that a user uses to interact with a product or a service. As with the design of user experience, user interface design is a complex and challenging task. It is responsible for translating the creation, analysis, content, and layout of a product into an appealing, guiding, and responsive user interface.

  • User Interface design is all about how the product’s interface looks. This considers all of the interface's visual and interactive elements— including buttons, icons, spacing, typography, color schemes and responsive design.
  • The aim of UI design is to visually direct the user through the interface of a product. It's all about having a good experience that doesn't take too much thought and effort from the consumer.
  • A good UI design ensures the design is consistent and aesthetically pleasing. 

 What is a UX Design?

User Experience is an overall experience of a user when they interact with the products or services.

  • User experience design is a method of improving and enhancing the functionality of the user-interaction.
  • UX concept is NOT about visuals; it's based on the overall experience.
  • UX isn't just about making the consumer satisfied, however. It is about helping the customer to accomplish their activities in the best possible way and attain business objectives.
Dribbble                                             Image source - Dribbble

User experience design is the process of designing and enhancing the consistency of a user's engagement with all facets of a business and thereby improving the user experience.
As of the current situation within the digital globe, every business tries to make an impact on user in order to multiply its sale and to provide a happening experience for a consumer all with help of User Experience and User Interface design.

How can a CMS like Drupal 8 help enhance the UX of a website? 

A Content Management System plays a key role in the success of a website’s UX design. Drupal 8 offers flexibility in customizing content as well as design. Let’s look at how is Drupal 8 a great choice of CMS if you are looking at creating compelling UX designs.

  • Page Speed – Fast-loading websites not only enhances the performance but also the overall user experience. Drupal 8 provides performance boosting features like advanced caching options, image optimization, code optimization, database optimization and more.
  • Responsive – With Drupal 8, responsiveness runs in the blood. Which means that all Drupal 8 websites are responsive out-of-the-box! And without a responsiveness, the UX of a website is incomplete.
  • Personalization – It has been proven that websites that offers personalized experiences see more conversions than websites without it. Drupal 8 offers various modules that let you personalize your content based on the user’s demographics, device information, date and time of login and more.
  • Multi-lingual – Did you know that only 20% of the world’s population can speak / understand English? To be able to provide a personal touch through the UX of a website, it is important to speak with the user in the language they are comfortable with. Drupal 8 offers multi-lingual support out-of-the-box with over 100 languages to choose from.
  • Headless Drupal – Decoupling Drupal gives UI/UX designers a lot more control over the design elements of a website. When front-end frameworks like ReactJS and Angular JS are leveraged with Drupal 8, the user experience can be enriched. 
  • Themes – The Drupal community has built hundreds of themes that can be adapted to any business requirements. You can find Drupal core themes that come out-of-the-box with Drupal 8 as well as third-party Drupal 8 themes. If none of them suit your needs, you can also customize a theme to have them tailor fit.

How does UX differ from UI?

Here is an analogy I like to use to describe the difference between both.
If you imagine the human body to be a product. The organs reflect the UX design: measuring and optimizing to support life and UI design reflects the body's cosmetics; their appearance, their senses yet their reactions. 
The key distinction to remember is this: UX design is all about the overall feel of the user while UI design is all about how the interfaces of the product look and work.

Dribbble                         Image source - Dribbble 

For instance, User Experience (UX) is mostly emotional and is the consumer's mental actions, like how a user reacts when using a product or what emotions he feels during the usage of a product.

It mostly deals with what goals users are trying to achieve via the product, what their needs are, what feelings are they experiencing, what strategy is to be applied, and what interactions are they likely to perform in order to reach their goals.

Whereas User Interface (UI) is tangible. It mostly deals with the visual hierarchy of the product, including buttons, typography, colors etc. UI designers basically have to deal with scalable designs and have to improve the user flows by reducing the time required for a user to reach his goal while making the product aesthetically pleasing and visually beautiful for the user.

Good and Bad UI/UX Examples

Let’s talk about a few bad examples of UI/UX

Distractions create bad first impressions                    Distractions create bad first impressions

When looking at the above example at the first sight, it gets rather confusing about what the website is all about. A user is shown various ads and unwanted information and is presented with a lot of information that is difficult to be processed, hence making users bounce off the website without even reading the news posting which they were looking for in first place.

bad ui/ux experiencebad-ui-ux

These are some more bad examples of UI/UX.

When looking at the above two images, a user gets confused and is likely to be diverted from his actual goals. In 2020, responsive designs are not a trend but a necessity. The above examples show the bad and harsh usage of colors and typography leading to confusion.

But not every design is bad. Let’s also talk about some of the very good examples of UI/UX.
The above example shows how a simple micro-interaction can make a user happy and engaged, leading to some immersive experience.

good-ui-uxgood-ui-ux-experience
Mar 17 2020
Mar 17

Drupal 8 custom modules can range from being super simple to highly complex, depending on the need for the customization. The true power of Drupal can be unlocked with custom modules in Drupal 8. Irrespective of the complexity of a custom module, following some best practices can help you create more efficient custom modules. So, let’s get started!

Recently, I was looking for a module in Drupal and something just crossed my mind. In the Drupal world, when you are looking out or considering solutions, the first thing you might hear is, "there is a module for that!". While there are close to 70 core modules in Drupal, it is the additional contributed modules built by the Drupal community that extends the platform's functionality. And with Drupal 8, there is a completely different architecture and modernized approach towards CMS, with a shift towards object orientation to improve the overall efficiency and software quality. Creating a Drupal 8 Custom Module to further extend Drupal’s capabilities is not the same as it was in Drupal 7.  

What is a custom module in Drupal 8? Why create one?

A Drupal 8 custom module is basically a module that is made up of customized functionalities. The Drupal custom module could start with a contributed module that needs small customizations or a completely new Drupal 8 module with new sets of non-existent functionalities custom fit to the project. Or sometimes, a migration from Drupal 7 to Drupal 8 will call for a custom module because the Drupal 7 module isn’t available in Drupal 8. A Drupal 8 custom module is essentially built to extend the core functionality of Drupal, which by itself comes with built-in set of core modules. 

Regardless of how your experience has been with the previous versions of Drupal, module development in Drupal 8 has its own set of challenges. To give you a fair idea, there are some differences between Drupal 7 and Drupal 8, the key ones being that Drupal 8 requires the latest version of the PHP 7 to run and it uses Symphony, a PHP framework that relies on Object Oriented Programming. Nonetheless, Drupal 8’s new approach is a futuristic approach and has opened doors to a wider set of developers who are well-acquainted with OOP and MVC concepts.

Also, there are changes in the way a module is built and there are certain best practices to keep up with the community standards. Let us talk more about this.

Change in the Drupal 8 File Structure

One important point to remember is that in Drupal 8 modules development the file structure is quite different from the one in Drupal 7. Custom modules in Drupal 8 are stored in the /modules directory, unlike in Drupal 7 where this directory was reserved for the core modules. The core Drupal 8 modules now go into the /core directory.
Next up, to let Drupal 8 know that your custom module exists, you need to create an .info.yml file which provides the meta data. This process is similar to the one used for Drupal 7.

name - This key is to provide a name for your custom module.
type - This key defines the type of the extension (module/theme/profile).
description - This key provides the detailed description about the custom module (displayed on the module list page).
package - This key specifies the package in which the module should be included.
version - Specifies the version of the module. 

If your file looks something like 'blogexmple_module.info.yml', the syntax will be as follows-
name - blogexmple Module
type – module
description - A simple demo module
package – Custom
version - 1.0
core - 8.x


Use of Configuration before code

Having to rewrite the code every time you make any changes is quite a task. Instead of hard coding a class into a theme, set the values in the configuration and apply it with the code. This ensures easy and faster ways to code and results in high quality modules. With reusable codes being the norm in writing quality software, configurations in the code ensure advanced functionality and "easy to modify" features.


Use What Drupal Offers


Once you have built your module, you should know that Drupal comes with various built-in admin functionalities to store and display module data and settings. The module settings page can be defined with hook menu. This hook enables modules to register paths in order to define how URL requests are handled. With the drupal_get_form page callback usage, all you must do in the callback function is define and return the settings that are to be stored.


Too Many Cooks Spoil the Broth

Having worked on large scale Drupal sites for a long time, Drupal developers would have learnt that hundreds of modules can work their magic together to produce an effective large-scale project. But when working on enterprise Drupal websites, it is important to note that avoiding a single poor module has greater effects than avoiding 30 well-developed Drupal modules (in an attempt to use lesser modules). Developers then tend to favor programming their own modules over reusing existing modules. The higher the number of custom modules you write for a project, the more work it takes to maintain and modify your Drupal site later. Instead, consider publishing your modules on Github. This allows you to avoid usage of a large collection of custom modules and instead encourages you to create reusable code that has the required configuration.


Environment & Coding Standards

Development environment is an important influence as it ensures that a Drupal project runs without any hassle. Drupal development companies ensure that the entire team works in an exact same development environment for an efficient workflow.

While working in such an environment, one of the biggest issues to handle is to make sure that the code is clean and maintainable. Drupal developers need to make sure that their code is readable and makes sense to everyone they are working with. And this doesn't apply only to the team members or to anyone from your organization, but also to the larger Drupal community itself. With community involvement being an essential part of Drupal development and a key aspect in distributed teams working together efficiently, following the coding standards helps in achieving a project's goals and objectives.

Mar 10 2020
Mar 10

Do you think first impressions last? Will Rogers once said – “You never get a second chance to make a first impression”. Drupal 8 offers some fantastic themes to help every business create a lasting impression. Let’s delve into some of the top Drupal themes that are most suited (but not exclusively) for Media and publishing websites.

According to a research, it takes 50 milliseconds for your website to make a good first impression. Which means that you have 50 milliseconds to visually appeal to your website users. And 94% of the impressions are related to the design of a website. Sure, Content is King; but “Queen Design” steals the show. At its core, Drupal is a framework that is excellent at managing content. However, the Drupal community has built and designed large number of themes to fit every business.

Drupal Themes consist of HTML markup and CSS files that helps in defining the visual appeal of your website. Drupal 8 core comes packed with several basic but impressionable themes like the Claro theme (administrative theme), Bartik theme, Seven theme, Classy theme and more. Don’t forget to watch out for Drupal 9’s (coming soon) new sleek and intuitive default theme - Olivero, which is still work-in-progress, but the style looks amazing already!

 

What should media and publishing websites look for in a Drupal Theme

If none of the default Drupal 8 themes fit your media and publishing business, you can choose from a wide variety of third-party themes. Third-party themes can be categorized into Free Drupal themes, Paid Drupal themes and Custom Drupal themes. Custom themes are opted for when none of the other 3rd party Drupal themes fit a business requirement or when certain CSS styles need to be tweaked. What makes a good Drupal theme?

  • Mobile Responsive – We all know how important it is to have a responsive website today. Not only does it make a great impression, considering the increase in the number of mobile users; it also appeals to Google which in-turn can boost the SEO ranking of a website.

  • Improved content readability - with well-marked layouts and clean HTML 5 markup

  • Friendly Editorial experience design – especially important for media and publishing websites

  • Choice of Layouts to fit your needs – 2 column or 3 column layouts to fit content and ads especially for media websites.

  • Customization options – should be easy to customize while offering customization options

  • Lightweight – Helps in faster page loading

Top Drupal 8 Themes for Media and publishing websites (actively maintained)

  1. Bootstrap

    The very popular and widely used Bootstrap framework is a front-end component library that is ideal for any type of website. The Bootstrap Drupal theme is responsive and acts as a link between Drupal and the Bootstrap framework. Many themes have been based on the Bootstrap framework – some of which we are going to talk about next. It offers slick styles and super-fast page load times with the help of jsDeliver CDN.

  2. Barrio

    This Bootstrap 4 based theme offers flexible layouts that are particularly useful for media and publishing websites. The free Barrio Drupal 8 theme offers 1, 2 and 3 column layouts that are easily configurable. It acts as a base theme on which you can add styles. To completely leverage the power of Bootstrap 4, it is recommended to use the Bootstrap 4 Barrio SASS subtheme. It brings along a variety of styles for every type of element including Color management, dropdown menus, predefined Google fonts and more.

  3. Showcase Lite

    The Showcase Lite Drupal 8 theme is free Drupal theme based on Bootstrap 3 offering a mobile-first layout. It comes with 34 configurable block regions and 1, 2 and 3 column layouts to choose from. With a Superfish menu it offers intuitive navigation with mobile-friendly, touch-enabled and keyboard-accessible drop-down menus. They also offer a Premium version of this Drupal 8 theme.

Showcase LiteImage Source – https://www.drupal.org/project/showcase_lite

 

  1. Creative Responsive Theme

    This is a minimalistic yet stunning Drupal 8 theme that does not depend on any core theme. It is responsive, lightweight and comes with clean HTML5 markup and CSS code. It offers 1 and 2 column layout options, more than 16 block regions and multi-level dropdown menus. It offers a Nivo slider that helps showcase featured content in the banner, allowing administrator to add slides to the slideshow as and when they please.

Creative ResponsiveImage source - https://www.drupal.org/project/creative_responsive_theme

 

  1. Newsplus Lite

    The Newsplus Lite Drupal 8 theme is a free Bootstrap 3 based theme and as its name suggests, a very lightweight theme. It is great for styling media websites like News sites and magazine sites. Offering 3 column layouts, it is a responsive theme that is simple yet great looking. It comes with clean HTML5 and CSS3 codebase, a rich footer and plenty of other modern features. They also offer a premium version of this theme.

Newsplus LiteImage source - https://www.drupal.org/project/newsplus_lite

 

  1. Magazine Lite


As the name suggests, this Drupal 8 theme is lightweight and best suited for magazine websites. It is based on Bootstrap 3 offering mobile-first layouts. It offers a clean 1, 2 and 3 column layouts and Superfish menu for a sleek and stylish news or magazine website.

Magazine LiteImage source - https://www.drupal.org/project/magazine_lite

 

  1. Photographer theme

    The Photographer theme is a free Drupal 8 one page portfolio theme that is chic and classy at the same time. It offers a fully responsive layout that is best suited to showcase creative and colorful portfolios. Comes with jQuery dropdown menus for modern and easy navigation. It lets you add more than 10 social network profiles and is integrated with Font Awesome.

PhotographerImage source - https://www.drupal.org/project/photographer

 

    8. Pixel Theme
 

This is a classic, modern and lightweight Drupal 8 theme that is great for media and publishing websites as well as corporate websites. It is fully responsive and offers 3 column layouts to showcase your work. You can configure up to 20 block regions and comes with a responsive Superfish menu.

PixelsImage source - https://www.drupal.org/project/pixels

 

Mar 03 2020
Mar 03

Web accessibility is ingrained in Drupal’s values and principles. Starting with Drupal 7, the web accessibility initiative has progressed to great extents through Drupal 8. Why is website accessibility so significant? How does Drupal 8 ensure website accessibility? Let’s dive in to answer all your questions.

The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. - Tim Berners Lee, Inventor of World Wide Web.

The internet as we know it today is 11315 days old! Originally conceived to meet the demand for automatic information sharing between scientists in universities and institutes around the world, the internet today is an integral part of more than 3 Billion people in the world. For various reasons ranging from social networking to collecting information for projects, internet today is arguably the most powerful resource known to mankind.

Over the years, the boom in chat-bot and machine learning applications has led to businesses crafting their online presence in the form of websites and using artificial intelligence for a better customer experience. This is not surprising, given the fact that in recent years, chat or messaging has taken over social media to be the "go-to" option for users who want to contact a business.

But have you ever stopped to think, can everyone access the web?

It is 2018 and I wonder, why is web accessibility still less, well, accessible? As a business, the competitive market pushes you to reach as many people as you can to promote your brand. More the barriers lower the chances of reaching potential customers. This basically is the concept behind web accessibility: to eliminate the barriers the audience face.

What is Web Accessibility?

Generally, people refer web accessibility with screen readers or visual disabilities. However, the range of topics that it covers is vast and includes more than that. For example, having an appropriate screen contrast for a person to see the screen on a sunny day is a use case for someone with a normal vision rather than for someone with a disability.

The World Wide Web Consortium has introduced some guidelines to achieve certain levels of accessibility to ensure that a website is as useful as possible. Published in 1999 as version 1.0 and later in 2008 as version 2.0, the WCAG 2.0 is generally accepted as the standard to measure when talking about web accessibility and the information you present to a user.
 

web_accessibility

The Importance of Web Accessibility

With the internet's growing importance in people's life, if what you want to convey (your content basically) is not easily accessible to everyone, you’re turning away your audience before they even get to the door. For example, something as simple as a broken hand or a temporary blindness can make it difficult to navigate the web.

While the fact that web accessibility is not only for those with disabilities is quite resonant, businesses need to know that the flexible and responsive design of a fully accessible website is a benefit to everyone. Web accessibility standards are built to promote inclusion and Drupal is setting a benchmark when it comes to supporting and fostering inclusion.

importance_of_web_accessibility

How does Drupal help?

Drupal CMS, a web based SaaS provides the ability to organize a manage an organization's web content in a systematic manner. The guidelines of the World Wide Web Consortium are divided into two - ATAG 2.0 that addresses the authoring tools and the WCAG 2.0 which addresses the web content and is widely used by developers and accessibility evaluation tools. Drupal CMS, as a platform, has been built to adhere to both the guidelines. While the accessibility initiative started with Drupal 7, Drupal 8, addresses some of the best accessibility features.

Drupal 8 Accessibility Features and Modules

The most advanced version of Drupal allows your website to be far more likely to be accessible, to assistive technologies and the users who depend on them, than ever before. Drupal 8 extends accessibility with various core and contributed modules. 

Better Contrast

Poor contrast level is often cited as the most commonly overlooked feature by the developers. However, in Drupal 8, the core themes have higher contrasts, thanks to the Drupal's accessibility maintainers. With improved contrasts, users suffering from colour-blindness can easily websites. Also, this feature is an added advantage when visiting a website under bright sunlight in a portable device like a mobile phone or a tab.

Forms

Errors while filling forms is one of the most common factors that affect the user interface. With the new standards, identifying these errors becomes much easier. By using a better form validation error verbiage, Drupal 8 provides an option to turn on this feature that improves accessibility related to the display of form errors. For example, a visually impaired person can now easily identify what errors he might have made when filling in a web form.

Buttons instead of links

A common practice among many website owners is to use anchor texts as "call to action" instead of buttons. From a semantic standpoint, it is more logical to use a button rather than anchor texts as these user interface elements are action oriented. Thus, Drupal 8 has called for this measure to use buttons rather than links. This new standard set by Drupal 8 can be handled without becoming heavily dependent on WAI-ARIA that can be useful in identifying the purpose of some elements.

Other Drupal 8 Accessibility Features 

Alt text (Alternative text) usually refers to the words that are used to describe a particular image. Though not visible or rendered on the page, these alt texts are used by tools like screen readers and is a great asset to web accessibility. This feature which is set to ‘required’ by default in Drupal 8 helps visually impaired audience to know what the image is all about with the help of the text.

TabbingManager is a feature that constrains tabbing and guides non-visual users to important “tabbable” page elements. This is useful for users who prefer to use the Tab key on the keyboard rather than the mouse.

The Aural Alerts feature is a Javascript function that passes an assertive or a polite message/instruction to the aural users if there are any changes made on the page (which would otherwise go unnoticed on screen readers).

Layout Builder Module

Layout builder is one of the most powerful and popular Drupal 8 modules that is widely used by content builders. It offers easy and powerful page-building capabilities allowing site builders to build custom pages, create and override reusable templates, granular customizations and much more. It has been stable since the release of Drupal 8.7 and is in core. 

As part as Drupal’s commitment to inclusion and accessibility, Layout Builder meets all the guidelines set in the WCAG 2.0 AA (needed to meet the AA level of the Web Content Accessibility Guidelines). Only once it passed the “accessibility gate”, the module was released as a stable version. And this was a commitment that was made and duly fulfilled by the Drupal community.

CKEditor Accessibility Checker Module

The CKEditor Accessibility Checker module is a contributed Drupal 8 module that allows you to test the accessibility level of the content within the CKEditor. It not only detects the problem areas in website accessibility; it also helps you solve them for better accessibility conformation. It leverages the Accessibility Checker plugin from CKEditor.com to perform these functionalities.

ckeditor_moduleImage Source: Drupal.org

SiteImprove Module

Siteimprove is a Drupal 8 contributed module that provides a plugin to connect your Drupal website to the Siteimprove intelligence platform. Siteimprove is a Digital Presence Optimization software that provide amazing insights that can not only help in improving web accessibility compliance but also helps improve website traffic, content quality, performance and more.

Text Resize Module

This is a contributed Drupal module for web accessibility and is widely used in Drupal 7 and Drupal 8 projects. It allows users to increase or decrease the font size of a web page with a click of a button. It helps visually impaired users to a great extent as they are able to adjust the size of the text that suits their eyesight.

text_resize_module Image Source : Drupal.org


 

The Future of Web Accessibility in Drupal

Over the years, Drupal has taken some great steps forward to achieve web accessibility through several of its major releases and is one of the leading implementations of the web accessibility standards. With web accessibility being one of the major factors contributing to the user interface and the ability of a business to reach the maximum audience, several strategic initiatives for Drupal core is sure to shape the future of how people interact with a website. Some of the noteworthy ones include:

  • Application-like interfaces and various UI interactions that are presented without full-page refreshes: sliding panels, autofocus, live result filters, drag-and-drop, pop-up success messages, live previews, wizard-like progress steps, and role impersonation.
  • Automated testing using headless browser drivers.
  • Supporting more interaction modes, such as MS Windows' high-contrast mode, and speech-driven control.
  • End-user testing for accessibility
  • The theme component library initiative which involves much refactoring of how Drupal produces output.
Feb 27 2020
Feb 27

Still running your website on Drupal 7 (or 6)? It’s about time to migrate to Drupal 8!

We have written extensively about why you should migrate to Drupal 8 if you’re still on Drupal 7 (or 6). Although, one of our most favorite (and significant) reasons to migrate to Drupal 8 is that … Drupal 9 is coming! And if you want to enjoy the benefits of Drupal 9, it is recommended you migrate your website to Drupal 8 first. We could argue that you should move to Drupal 8 now because there’s not enough time once Drupal 9 is here (June 2020) and Drupal 7’s EOL (Nov 2021). But you could claim that you can opt for an LTS (long term support) instead! Fair enough. Except that apart from spending more money in engaging an LTS service provider, you are also losing out on the rich benefits that Drupal 8 has to offer. Some things may seem difficult but are necessary for a stronger and a simpler future.  

Once on Drupal 8, you don’t have to “migrate” anymore – only a simple “upgrade” from Drupal 8.9 to 9, and then 9.9 to 10 and so on, will do. Migrating from Drupal 7 to Drupal 8 is not always easy and straightforward; I agree. Following a process helps but you might still face some challenges during the migration, especially if your Drupal 7 website’s content model is considerably complex. Let’s take you through a step-by-step migration from Drupal 7 to Drupal 8 with challenges that you might face. And our recommendations on how to overcome them.

Drupal 8 Migrate – Assumptions and Preparations

“To be prepared is half the victory”, said Spanish novelist Miguel De Cervantes. A Drupal 8 migrate can get complicated but if you have spent enough time in planning the migration, the challenges won’t surprise you. Drupal 8’s adoption of many modern development standards like Symfony, Twig, PHP 7, etc. have led to this complete rebuild but it also calls for more powerful, robust and flexible digital experiences. Listed out are a few pre-conditions that you should remember before you begin –

  • Update your Drupal 7 website to the latest version available. This will help in cleaner automatic upgrades of some of the modules that have direct upgrade paths.
  • Make sure you have access to the Drupal 7 website’s database and files (public and private).
  • Create a backup of the Drupal 7 website and use this backup for the Drupal 8 migration. It is not recommended to migrate a live functional website although the migration itself does not make any modifications to the source.
  • Download a fresh installation of Drupal 8 from here and enable the core Migrate modules the we discussed above. And remember, it MUST be fresh! Any configurations made or content created will be overwritten when an upgrade is performed.
  • There is no direct upgrade path from Drupal 7 to Drupal 8 (unlike in previous version upgrades). Familiarize yourself with Drupal 8’s migration system. The three modules that are in core –Drupal 8 Migrate module, Drupal 8 Migrate Drupal module and Drupal 8 Migrate Drupal UI module. 
  • Make your migration choice – will you use Drush (which gives you granular control) or will you go with the browser user interface (easier but less control)?
  • Know your source. The Drupal 8 migration system’s flexibility allows content to be extracted and loaded from older versions of Drupal and various other sources like CSV, XML, JSON, MYSQL, etc.
  • Perform a thorough content audit to identify content that you need to migrate. Discard unused and irrelevant content to avoid spending time and effort in migrating them.

The Migration Process (Step by Step)

  • Observe and Plan

Identify the content types and content structure of the existing site and document the observations. This includes content types, field types, blocks, taxonomies, etc. Prepare a plan on what you need to migrate and what needs to be merged, based on these observations. Analyze the views and other site configurations and catalog them so it is easier to replicate them in Drupal 8.

  • Create a modules checklist of your Drupal 7 website

With this checklist you should be able to identify modules that you still need, or if there is a Drupal 8 version of that module, or if the module has now moved to Drupal 8 Core (like the Media module). Not all Drupal 7 modules can be automatically migrated to Drupal 8. Some Drupal 7 modules may have merged their functionality into a single Drupal 8 module. And some Drupal 7 modules may have separated their features into two or more Drupal 8 modules. It is always better to analyze such cases to be sure there is no data loss!

     Expert Recommendation – Use a module like the Drupal Migrate UI to identify the Drupal 7 modules and their corresponding Drupal 8 module (if available or not).

drupal-7-to-8-migration

No module version available for Drupal 8? For example, the ImageField module in Drupal 7 does not have a corresponding D8 module. We might have to find best suitable alternative available for this in Drupal 8. Of course, we have the Drupal 8 core Media module. However, we will have to develop custom scripts migrate the image data.

Expert Recommendation – If you have just inherited a D7 website and have no idea about the customizations made to the modules OR If you have made customizations yourself and need to find them, we recommend you to use the Hacked! module. This module will go through the list of modules available on the site and the changes/customizations done to each module. 

Expert Recommendations – 

  1. Template files(.tpl) in Drupal 7 should be written rewritten using twig files, which is part of symphony 2 framework.
  2. Make sure you rewrite your custom modules that follow symphony standards.
  • Implementing the Migration 

The most awaited and significant step has arrived. As discussed earlier, there are two ways of migrating your Drupal 7 data to Drupal 8 -

  1. Running a migration with the Drupal UI
  2. Running a migration with the Drush

The latter is recommended as it is more efficient, can be incorporated into shell scripts, and has clearer error messages. 

Based on the catalog of the content and the extracted data you need to build the migration scripts where you map the content type attributes of Drupal 7 with the newly built content type attributes of Drupal 8.

Drupal UI Method

Leveraging the Migrate UI Drupal 8 module, you can start by visiting the /upgrade path of the Drupal 8 website. The upgrade review page will show you a list of modules in your Drupal 7 site that can and cannot be automatically migrated to Drupal 8. For modules that have their functionalities in another D8 module but not exactly the same (like the AddressField module in D7 is now Address module in D8), you will need to install and enable the corresponding D8 module and restart the migration process. Based on the catalog of the content and the extracted data you need to build the migration scripts where you map the content type attributes of Drupal 7 with the newly built content type attributes of Drupal 8. Next you can go ahead with importing the data from a data source.

Drush Method –

Are you comfortable using terminal? If so, you should opt for the Drush method for migration. It provides a set of commands for the process of data migration with better status messages. Check out this tutorial if you’re looking for a step by step procedure migration using Drush commands. Never used Drush before? This guide will help you understand the basics of Drush with a list of useful commands for migration.

You might run into some conflicts now. Make sure you have checked for known issues in Drupal . org and how to fix them. Once fixed, you can now run the Migration process that gives continuous logs/feedback of the actions taken. Lastly, check the logs for any errors, fix them and you are good to go!

Expert Recommendation – Wait! Once you have the content created, never overlook the SEO/page views. We need the content to have the same URL paths. Do not forget to take care of migrating the URL aliases, meta tags information of the content from the old Drupal 7 site.

There are very rare times when you would run into zero issues during a Drupal 7 to Drupal 8 migrate. Once the migration is completed, a regression testing of the configuration and content freshly imported to identify any potential bugs or issues, is absolutely necessary.


Challenges and (more Expert) Recommendations

  • Many Drupal 7 contributed modules have better versions of themselves in Drupal 8 and some have been deprecated. For example, the Field Collection module, which is used for grouping fields in Drupal 7 is soon to be deprecated. This module’s functionality has been added to the Paragraphs module and Entity Reference Revision module in Drupal 8. The Drupal 8 Paragraphs module provides immense flexibility to Content editors/authors to create seamless forms and structures. If you need to migrate the Field Collection module and map it to the Paragraphs module (D8), you will need to write custom plugins to map the content between Field Collection fields to Paragraph fields. Or if you still want to continue migrating the Field Collection module even in Drupal 8, this field mapping can be handled by available Core migrate plugins. 
  • Do you use Panels for creating your landing pages like Home page, Dashboard, etc.? Even if you only need to place a block in the home page? Layout builder to the rescue! Layout Builder in Drupal 8 makes it easier for a content editor to customize a landing page. Let’s make best use of the features of Drupal 8. To migrate from Panels to Layout builder, you will need to write some custom migration plugins.
  • While migrating users, we will have to maintain the passwords as well so that the user does not have to recreate the password on the new site. Passwords are hashed content. So, you must find the hash type algorithm that is used in the source site. Next. write a process to validate the migrated password with the rehashed password using the same algorithm.
  • When running a migration, you may exhaust your system resources which may cause your migration to stop. Thanks to highwater marks, you can run the migration again and it should pick up from where it left off.
  • The widely used Features module in Drupal 7 now has almost become obsolete after the Configuration Management took over all the Features functionality and more in Drupal 8. Although the Features module is available in Drupal 8 as well, it is highly recommended to leverage Drupal 8’s Configuration Management system. It is not only simpler to work with, it is easy to export between environments, it uses YAML file formats instead of PHP – which is a more readable and proper data format.
  • Facing problems with your migration? There are several ways to report failures and get help -            - Drupal Upgrade Issue Queue
            - Module issue queue if you find a bug or exception with a core/contributed module
            - The #drupal-migrate IRC channel on Freenode
            - The #migration channel on Drupal Slack
            - Hire a Drupal Expert
Feb 18 2020
Feb 18

Paragraphs is a new way of content creation. It allows the site builders to make things cleaner and can give more editing power to the end-users.
“Paragraphs” is a very popular module in drupal, used for handling content. It is similar to content fields and provides a wide range of options for designs, layout, and grouping of content as per the requirements.

Types of Drupal Paragraphs & Its Usage?

Paragraphs can be of different types. They can be anything from an image to a video, or a simple text to a configurable slideshow. 
Instead of putting all the data in one body field, we can create multiple Paragraphs Types with different structures. This allows the end user to choose between pre-defined Paragraphs Types. By using Paragraphs, we can create multiple featured Paragraphs, allowing the end users to pick the one most suitable for their needs. 
The Drupal Paragraphs module is easily manageable for non-technical users, while also offering Drupal developers the ability to control the appearance of the elements at the theme level.

How to use Drupal 8 Paragraphs module

1. Install and Enable Drupal Paragraphs module.
 

drupal paragraph module

Drupal Paragraphs module requires Entity Reference Revision module. To work with drupal paragraph module, install and enable Entity Reference Revision module.
 

drupal paragraph field


2. Create a new Paragraphs Type

  • To take the advantages of Drupal Paragraphs module, create at least one Paragraphs Types.
  • Navigate to Structure > Paragraphs types.
  • Click on “Add paragraph types”.
  • On the next page, there are three fields to be filled.  Label, Paragraph type icon and description. The Label field(mandatory), is the name given to the paragraph type created. If required, icon and the description of the paragraph can be given.
     
add-paragraph-module
  • After editing, click on “save and manage fields”.
  • In manage fields, click on “Add field”.
  • Here you can add more fields as per the requirement. These fields include text fields, image fields, boolean etc.. This is similar to adding fields in content type.
  • After adding the field, click on “save and continue”.
  • On clicking “save and continue”, you will be guided to the “Field settings” tab. For any of these fields, there are settings such as, maximum length and allowed number of values. This is useful to allow more than one value for some fields when it is required. 
paragraph-module
  • Click on “save field settings”.
  • In the next tab we can set the title for the field which is displayed when the new content is created.
  • Then click on “save settings”.
  • Now the field created can be seen inside Paragraphs Types.
manage field in paragraphs modules


3. Add Paragraphs to the content type:

  • Navigate to Structure > Content type. Choose the content type for which the created paragraph is required.
  • Go to “manage fields” of the content type and click “add field”.
  • To use Paragraphs, open the “Select a field type” dropdown list and select “Paragraph” under “Reference revisions”. After selecting “Paragraph” give a label name for the field which is used while creating the content. After labeling, click on “save and continue”.
  • On the next page, there are two settings “Type of item to reference” and “Allowed number of values”. “Type of item to reference” should be set to “Paragraph” and under “number of values”, it is better to set it to “Unlimited” so that we can value innumerable times. Click “Save field settings”.
type of the paragraphs-module
  • Clicking “Save field settings” will take us to the next tab where there are options to choose the paragraphs type to be used in this content type. If we want a particular paragraph type to be used, check on the paragraph that is required. Else, click ”Save settings” without checking the paragraph types. This will give dropdown during the content creation and we can use any paragraphs that are created.
     
reference-type
  • By clicking “Save settings” we can see the field with type entity reference revisions.

4. Adding contents to the content type having drupal paragraphs.

  • Go to Content > Add content, and choose the content type to which paragraph is added.
  • You will see a paragraph field with all the fields added to the paragraphs. There are two more options: They are “remove” and “Add (title of the field referred to the paragraph)”. To add multiple values of the same structure, click on add, and to remove paragraph, click on remove.
demo-paragraph-module

Features of Paragraphs module

  1. Allows the editor to create different structures on each page.
    If there are different structures on the same page or different pages, paragraphs can be used. For ex. There is an image with text on the top and slideshow on the bottom. We can use Paragraphs to make this less complicated.
  2. Allows the editor to change the order of the paragraphs.
    If there is a change in display, like there is an image on the top followed by title and description, and you want to change it to title to the top followed by image and description. Such changes can be done using paragraphs easily. 
    Go to “manage display” of the paragraphs used and change the order, which will change the display order of all the content wherever the paragraph is used.
  3. Paragraphs can be nested
    One paragraph field can be referred to in another paragraph field. While selecting field to paragraphs, select “Paragraph” under “Reference revisions” and select which paragraphs type you want to add.
     
Feb 11 2020
Feb 11

A Drupal 7 to 8 migration is anything but boring because there are so many ways to perform a migration! Depending on the complexity of the project, we can choose a technique that suits it best. The one we are going to discuss in this blog is to migrate content and configuration from Drupal 7 to Drupal 8 using a CSV import method.

Drupal provides various modules for importing data from different sources like JSON, XML and CSV. Drupal 8 core migration API system offers a whole suite of APIs that can essentially handle any kind of a migration from a previous version of Drupal to Drupal 8. 

Some prep Work before the Drupal 7 to 8 migration

In order to migrate from Drupal 7 to Drupal 8 using CSV import, we will need these modules.

Drupal 7 Modules -

  • Views Data export: This module needs to be installed in our Drupal 7 site. The Views Data export module helps in exporting the data in CSV format.

  • Views Password Field: This module helps to migrate passwords which will send passwords in hashed format. 

Drupal 8 Modules -

  • Migrate – The Drupal 8 Migrate module helps in extracting data from various sources to Drupa 8.

  • Migrate Plus – This Drupal 8 module will help in manipulating the imported source data

  • Migrate Drupal – This module offers support in migrating content and configurations to Drupal 8.

  • Migrate source CSV – This module offers a source plugin that can migrate entities and content to Drupal 8 from .csv files.

  • Migrate Tools – This Drupal 8 module helps by offering UI tools/Drush commands to manage migrations.

  • Configuration Development Module – This module helps in importing configuration files to Drupal 8.

Let the Drupal 8 migration begin!

First, we need to create a custom module for our Drupal 8 migration. Let’s name this module as test_migrate. And we know that after creating a custom module we need to create the info.yml file.

csv1

Above screenshot shows keys that are required for info.yml.

Once the info.yml file is created, we need to create a migration group for the migration. This migration group needs to be created in the path: test_migration > config > install. Name of the group should be migrate_plus.migration_group.test_migration.yml.

csv2

Above screenshot shows the folder structure to create a migration group.

Inside the migrate_plus.migration_group.test_migration.yml file, we need to write id, label and description for the migration group which is shown in the screenshot below.

csv3

After creating the migration group, we need to install this group in our info.yml file. 

csv

Now, we are going to write a migration script for the Users, Taxonomy term, Paragraphs, Content types. Note that you are migrating in the same order since there will be a link between these entities. For example, content will be created by a particular user - so we first need to migrate users and after that taxonomy, content type.

Now let’s write a script in yaml file for user migration. So, in order to write user migration, we need user yaml file with the name migrate_plus.migration.test_migration_users.yml and script for migration is shown below.

csv5

These are the keys required for migration here source csv file which we need to be migrated. Csv files should be placed in the path assets > csv > user.csv. Users.csv is also shown below.

csv6

csv7

Path - It indicates the path for the csv file.

header_row_count - This will give row count which is the header of a particular column.

Keys - which should be unique for every row.

Process - In this we are mapping csv files to fields.

csv8

Above image shows the mapping between fields and csv. Here, the name is the machine name of the user name field and title is the csv column title. If we have multiple data for a single field, then we use delimiters. Users may have multiple roles in that case we write like shown in the above image.

Images are migrated by writing custom plugin. Custom plugin can be written in the path src > plugin > migrate > process. In the above picture you can see that the user_image_import_process is a custom plugin written to migrate user images.

csv9

Inside UserImportProcess.php we are writing the function which will copy the image and save it to the destination. Script is shown in the image below.

csv10

In order to identify where images should be saved we will write one more function ImageImportprocess. In that function we will mention the machine name of the image.

csv11

In the users info.yml file there is a destination section which will indicate where the migrated data is to be stored and which is an entity. This is marked in the image below.

csv12

After creating code for users, we need to write yaml for taxonomy terms. Note that if you have only title field in your taxonomy then you do not need to write a separate yaml file. If you have multiple fields in taxonomy term, then you need to write a separate yaml file. In taxonomy terms we will have tid as key since tid will be unique for each term.

csv13

After this we will migrate paragraphs. For that we need to create a separate yaml file. The code to migrate is shown in the below image.

csv14

Lastly, lets migrate the content type. The yaml file for the content type is shown in the code below.

 

label: 'Migrate Content type data from the csv file'

migration_group: test_migration

source:id: test_migration_content

 plugin: csv

 # Full path to the file.

 path: 'modules/custom/test_migrate/assets/csv/content.csv'

 header_row_count: 1

 keys:

   - nid

process:

 # Adding the mapping between the fields and the csv columns.

 title: title

 promote: promoted_to_front_page

 sticky: sticky

 field_display_name: display_name

 field_marketing_tagline: marketing_tagline

 field_taxonomy:

   plugin: entity_lookup

   source: Taxonomy

   entity_type: taxonomy_term

   bundle_key: vid

   bundle: taxonomy

   value_key: name

 body/value: body

 body/format:

   plugin: default_value

   default_value: "full_html"

 field_paragraph:

   - plugin: explode

     delimiter: "|"

     source: fcid

   - plugin: skip_on_empty

     method: process

   - plugin: migration_lookup

     migration: test_migration_paragraphs

     no_stub: true

   - plugin: iterator

     process:

       target_id: '0'

       target_revision_id: '1'

destination:

 plugin: 'entity:node'

 default_bundle: content

migration_dependencies:

 required:

   - test_migration_paragraph

   - test_migration_taxonomy

dependencies: { }

After writing all the yaml files the migration test_migrate.info.yml will contain the below installs.

csv15

Once you finish all these steps, go to your site and install your custom module.

csv16

Next, go to your project in terminal and run this “drush ms” command to check migration status as shown in the below image.

csv17

To migrate use command drush mim migration-id . We can see the migration ID in the above image.

Once done, if you check the migration status you can see the number of migrated items.

csv18

Now you can observe that all the content is migrated. If there is any error in the data migration, the process will terminate at that particular instance. Check the issue with that content and then once again you can restart the migration.

Things to Remember

  • If the migration is terminated in between the process, the status of migration will display as “importing”. In order to change the status to idle you need to run the command drush mrs migration-id. Next, run command drush mim migration-id

  • If you want rollback the migrated content, then run the command drush mr migration-id

  • If you have changed anything in the code after starting the migration process, then make sure you run the command drush cdi test_migration. This command will help you to reflect the changes while migrating. Once done, do a thorough check on your site to see if all the content is migrated.

Feb 04 2020
Feb 04

Meta tags are often underrated. Sure, they are not visible on your page up front but they are those hidden ninjas that can elevate your SEO game. These modest snippets of text that describe what your page is about can turn out to be very useful. The Drupal 8 Metatag module helps site builders to dynamically create and manage these meta tags for each of their web pages through an interactive admin interface (and no code!).

With the Drupal 8 Metatag module, you can not only provide structured metadata about a web page but can also customize meta tag elements. Meta elements are tags used in HTML or XHTML documents to provide structured metadata about a web page. They are part of a web page's head section. Multiple Meta elements with different attributes can be used on the same page. Lets learn more on improving SEO with the Metatag module. 

Setting-up the Drupal 8 Metatag Module

Meta elements can be used to specify page description, keywords and any other metadata not provided through the other head elements and attributes.You need to add  meta tags in the head section of your Drupal 8 pages for title, description, keywords, twitter card, facebook open-graph - to make your website SEO friendly. Download and install the module here.

With the Drupal Metatag module, we can configure the following -

  • Configuring Meta tags for home page(front page).
  • Configuring Meta tags for a Content type.
  • Configuring Meta tags for view pages.

1) Configuring Drupal 8 Meta tags for home page/front page.

After installing the module, you can edit global configurations at /admin/config/search/metatags and set the global configuration for the front page. Click on Edit to get into the details.

meta tag configuration                      Drupal 8 Metatag - Configuration for Front page

Enter Page title, Description, Abstract, and Keywords.

meta tag config module              Drupal 8 Metatag - Configuration for Front page

Page Title

This snippet is not only useful to search engines but also to your users. It appears in the title bar of your web page and should not exceed 55 characters. It also acts as a title for when your web page is bookmarked.


Description:

Enter a brief description of your website. Make sure that the description does not exceed 150 characters because search engines won't display more than that on a results page. If you don't have either field filled out, Google will decide what to display without any input from you. It can be very helpful to write up a snappy description for your content here.

Abstract

Enter a brief Abstract (Optional). Again, keep it to fewer than 150 characters but instead of something snappy, try to be as plainly descriptive as possible.

Keywords

Enter a comma separated list of keywords related to your website.

Advanced Settings and Custom Meta tags

There are some important things here that were previously handled by code. 

Drupal 8 Metatag - Advanced Settings             Drupal 8 Metatag - Advanced Settings

Robots

Normally, if you want to block or allow search engines from indexing a page or disallow search engines to display cached copies or descriptions of your page, you would edit the site-wide Robots.txt file. Here, you can control all of it and more with the Robots meta tag by checking/unchecking the various indexing options it provides.

News Keywords

This Meta tag is exclusively used by Google News that takes in comma-separated keywords as inputs. 

Rights

Any details about a copyright or trademarks that you might have, should go here.


Image

This one is also relatively new and can be handy for telling social networks which image they should use with a post.

Canonical URL

Canonical URLs are very useful for dealing with duplicate content issues. This is something that is often a problem on e-commerce sites where product listings are duplicated on multiple pages. Metatag does a good job of handling this by default.

Shortlink URL

This element acts as an alternative to link shorteners. In Drupal they usually come out looking something like this:

<link rel="shortlink" href="https://www.specbee.com/blogs/node/12" />

Original Source

This tag is also something that Google came up with, this time to help identify the original source of content. This one may be particularly useful for news sites, but can be safely ignored by most.
Save your settings.

2) Configuring Drupal 8 Meta tags for a Content type


Edit global configurations at  /admin/config/search/metatags, set the global configuration for Content. Click on Edit to get into the details. If you want to add different metatags for different content types, then click on the “Add default Meta tags” link on the top left corner of the page. Select the content type you wish to add metatag to and click on Save and configure.

Drupal Metatag - Configuration for Content types                    Drupal Metatag - Configuration for Content typesmeta tag ccongif for content type article      Drupal 8 Metatag - Configuration for Content type : Article

The content type will be listed in the Meta tags screen. The above screenshot shows the content type ‘Article’. Click on edit to add metatags.

Enter Page Title, Description, Abstract, and other necessary settings. Follow the same procedure as mentioned above in configuring metatags for the ‘front-page’.

3) Configuring Drupal 8 Meta tags for View pages


Enable “metatag: views” module which is a sub-module of the metatag module.

Drupal Metatag - Configuration for Views                  Drupal Metatag - Configuration for Views

Edit global configurations at /admin/config/search/metatags. Click on override to get into the details.
To add the meta tags in view go to the views edit screen and click on the meta tags link.

meta tag setting viewsmeta tag view

The above setting is the default setting for the view page.

Jan 28 2020
Jan 28

Communicating with Google services is simple and effortless with a wealth of API’s to choose from. With Drupal 8’s powerful API-first capabilities, interacting with these services are now easier and more effective. The API in focus is the Google Directions API. Drupal 8 offers a Google Directions module that integrates with the Google Directions API. 

What does the Google Directions Module do?

The Drupal Google Directions module allows you to create and add a block to your content where users can add two locations and find directions between the two points. Also displayed are suggested routes based on modes of transport (public transit, cycling, walking or driving) and the time it will take to get there. This block can be positioned via the Block layout and customized to fit any website’s style guidelines.

Getting Started with Google Directions Module

Let’s get started with implementing the Google Directions module.

Get the Google API Key 

A Google API Key is required to access the Google Directions Service.
To get a key, visit https://developers.google.com/maps/documentation/directions/start with your Google account and follow the Guide.
To get an API key:

  • Visit the Google Cloud Platform Console.
  • Click on the project drop-down and select or create the project for which you want to add an API key.
     Google-maps
  • Click on the menu button and select APIs & Services  -> Credentials
Google-direction-module
  • On the Credentials page, click on Create credentials -> API key.
api key
  • The “API key created” dialog displays your newly created API key. Copy the API key as it must be configured in your Drupal Project.google-direction-module-api-key
  •   Select Close. The new API key is listed on the Credentials page under API keys.Google-direction-module-api-key

Enable the required APIs

  • In the Google Developer Console Dashboard, click on the menu button, select APIs & Services -> Librarygoogle cloud form
  • Search for and enable the following APIs

                   ○ Google Directions API

                   ○ Google Maps JavaScript API

                   ○ Google Places API

                   ○ Google Geocoding API

Installing

Install and enable the Google Directions module as you would normally install a contributed Drupal module. Use your preferred method to download the modules. I’m using the Composer to install since it automatically takes care of all the necessary dependencies and Drush command to enable the module.

[email protected]:/var/www/html/drupal_php$ composer require drupal/google_directions

[email protected]:/var/www/html/drupal_php$ drush en google_directions


Configuration

  • Configure user permissions as required in Administration -> People -> Permissions:       
               ○  Administer Google Directionsadminister google directions
  • Once Google Directions is installed and enabled and permissions are granted:
               ○ Visit /admin/config/services/google-directions to enter your Google API Key that we copied earlier.google-direction-setting
  • ○ Use the Block layout page (/admin/structure/block) to position the block in one or more regions to suit your use case for the Google Directions module.direction-module-visibility
  •             ○ For each block placement, configure Visibility and other block settings to suit your use case.
                ○ Click on Save Block and visit the page. The following Google Directions block appears in the region it was placed.
google module block

Good to Note : 


If the menu does not display, flush cache and try again.

  • In the block enter the locations in “From” and “To” fields and hit “Go”.
google direction blocks
Jan 23 2020
Jan 23

Yes. “Prelaunch anxiety” is a thing. 
You have worked tirelessly on your Drupal 8 website for weeks/months together and now the most important day has arrived – the launch day! But wait! Have you done everything right to ensure your Drupal website does not run into any unforeseen issues? It is always best to compile a checklist of things to do a few days before the launch to make sure you have everything in place and that your website is not under any kind of risk. Don’t have a Drupal checklist yet? Put your mind at ease with our compiled prelaunch Drupal checklist for developers.

Are the File Permissions set right?

This is one of the top items in our pre-launch Drupal checklist. To secure your Drupal website, the first step you must take is to set the file permissions right. Make sure your web server is not given permission to edit or write the files that it executes. Automated tools to set and verify permissions like File Permissions and Security Review Module, can also be used. The PHP Filter Module under /admin/modules needs to be disabled, if your site is using Drupal 7. The settings.php file should be secure so that the database connection information is protected. 

Drupal Security Updates?

Drupal has been a choice of Content management system for various organizations but particularly so for organizations that deal with critical data. The reason why Drupal is known to become a secure CMS is because of the Drupal security team’s constant effort to keep it safe. With every major/minor release, security updates are shipped out. Many of them address immediate security risks. You will get warning messages when your Drupal security has lapsed.  Make sure your Drupal 8 release is up to date with all the security releases and patches. Keep your modules and core updated. You could also check for security updates manually by clicking on Reports and then checking for Available Updates.

Secure your admin’s account name

The Admin account is the root account that is used for any Drupal website development. Securing the root account is very important and should not be ignored. The installation is extremely vulnerable to hacker attacks as it isn’t hard to guess the username for the hacker. So the root account name should be changed to a more complex one (before launch at least) and a strong password must be used. You can use the Real AES module to tighten up your security. Also, when granting user permissions, ensure minimal permissions are given to anonymous users and all permissions granted to them should also be given to authenticated users.

Don’t let your users see those Error reports!

Because it can get very annoying. Error reporting should be turned off such that it must write the errors onto a log but does not display it to the users. To disable error reporting, go to Configuration > Development > Logging and Errors, set the option to None, which will disable all the error reporting. It should be ensured that 404 errors are handled well. Using Drupal modules like Search 404 helps in displaying more helpful content like search results based on the URL the user has been searching for.

search 404 module

Search 404 Result:

search 404 modules

Content and Search Engine Optimizing for your Drupal 8 website

You must ensure that all your site’s contents are displayed correctly. Don’t forget to run your site through the Lorem Ipsum scanner before launching. You might have missed to change all the dummy text when you have a lot of pages to go through. There are some great SEO modules that will boost traffic to your site after you launch.  Using the PathAuto Module is extremely important for Drupal web development as it will generate friendly URL’s instead of a URL that will look like this www.specbee[dot]com/node/3843. It is also recommended to use the Redirect Module along with PathAuto as it allows users to redirect from old URLs to new URLs. Because if you have two URL’s (with alias name) that represent the same content, it can be very harmful for your SEO ranking.

Redirect Module Settings

Redirection module

Redirection Module:

add url redirection

Check Your Drupal Modules

Unused Drupal modules end up taking up space and makes your website slow. Ensure only those modules that are being used are enabled. Removing unused modules will help with your website’s start-up time. You could also use a Drupal module for this – Unused Modules. Also, it is recommended to disable the Devel module and similar modules during launch. Make sure your modules are up to date with its latest releases. Using a Drupal 8 module like the Site Audit can be extremely beneficial as it analyses your website for performance and behavior. It gives you a report that tells you if you have followed best practices (else gives recommendations), website’s caching settings, codebase (size and file count), unused content types if any, and much more.

Server Configuration

Check the file upload sizes. This is to allow users to upload large media files from your Drupal website. To do this, you may need to adjust the server configuration. It is also important to check the execution time. You can do so by setting the max_execution_time in the server configuration. Also don’t forget to check that all the forms and modules are being sent to the correct email addresses.

Is your Drupal site optimized for performance?

There are many things a Drupal developer can do to optimize the performance of your Drupal website, like

  • Caching –configuring caching will boost the performance of your website. Caching for some modules are turned off by default – so make sure they are turned on. Drupal 8 core comes packed with modules like the Internal Page Cache module and the Internal Dynamic Page Cache module
  • CSS and Javascript – a typical Drupal website will have a lot of Javascript and CSS files which will increase the number of HTTP calls for each page. However, one can compress all these relevant files by enabling the Advanced CSS/JS Aggregation feature in the performance section.

CRON jobs?

These time-triggered actions can help in checking for updates, re-indexing the search mechanism, retrieving feeds, notifying other sites of updates and perform routine maintenance tasks. It is also recommended to configure CRON for security and performance reasons.

Jan 16 2020
Jan 16

Drupal 9 is just around the corner. Do you have a plan to upgrade to Drupal 9? Are you still in the “Why should I upgrade to Drupal 9 after all” phase? Wondering what your next steps should be for Drupal 9 readiness? We have answers to all your questions and a quick Drupal 9 checklist on how to prepare for Drupal 9.


The best way to prepare yourself for tomorrow is to give your best today. And very apparently, the Drupal community has done just that. I know, migrating to Drupal 8 from previous versions was hard. It meant a complete rebuild of the code and a lot of learning. But once you are fully onboard Drupal 8, life gets easier. Think of it as a hard climb for a gorgeous view from the mountaintop. Truly worth all the effort, isn’t it?
 

The Much-Talked-About Drupal 9 Release Date

One of the most frequently asked Drupal questions lately has been about the Drupal 9 release date. Drupal 9 is currently scheduled to release on June 3rd, 2020. The Drupal community has been successfully releasing minor versions every six months since the adoption of semantic versioning in Drupal 8. Every minor version came with several valuable new features. 


Drupal 8 extensively depends on third-party libraries like Symfony, Twig, Guzzle, CKEditor and must keep up pace with their updates as well. For example, Symfony 3 (Drupal 8’s biggest dependency) will reach EOL (end of life) by November 2021. The same time as Drupal 8 reaches end of life as well. Drupal 9 will be released with the latest Symfony 4.4 support and will not be backwards compatible with Symfony 3. 

Drupal 9The Drupal 9 Readiness Roadmap (Image Credits – Drupal.org)

What’s New in Drupal 9 (Drupal 8 vs Drupal 9)

Drupal 9 is already being built within Drupal 8. Drupal 8.9 will release along with Drupal 9.0 in June 2020. This is because Drupal 9 is going to be the same as Drupal 8.9, except that it will be a cleaned-up version that is updated with support for its third-party dependencies. And hence one of the outstanding Drupal 9 features is that it is so easy to upgrade!

Every new minor version of Drupal 8 saw many new features but it also contained a lot of old code so it could be backwards compatible. This “old code” is also famously known as “deprecated code”. Because of the dependencies on third parties like Symfony, Twig, etc., Drupal 9 will incorporate updates to these dependencies. Drupal contributors and module developers are collectively making the road to Drupal 9 easier by eliminating “bad smelling code” (as Jacob Rockowitz calls it in his blog about deprecating code for his Webform module) from various Drupal 8 modules.

Drupal 9What’s new in Drupal 9.0 (Image Credits - Drupal.org)

From Drupal 9.1 onwards, the same story continues. New Drupal 9 features will continue to be added every six months (Drupal 9.1..Drupal 9.2..Drupal 9.3…and so on) which will be backwards compatible with Drupal 9.

“If Drupal 9 is the same as Drupal 8.9, why should I even upgrade?”. Because Drupal 8 reaches end of life on November 2021 and will stop receiving any security fixes or updates from then on. So once Drupal 9 is released, there is an 18-month window to upgrade to Drupal 9. Sure, long-term support will be offered by Drupal vendors, but do we really want to miss out on all the new Drupal 9 features and enhancements that it will offer?

Drupal 9 Checklist

Regardless whether you’re upgrading from Drupal 7 to Drupal 9 or Drupal 8 to Drupal 9, you will need to start planning for Drupal 9. The scheduled release is soon approaching and now is a good time to get prepared for Drupal 9. 

  • Drupal 7 to Drupal 9
    If you are still on Drupal 7 and looking forward to getting onboard Drupal 9, it isn’t too late. Ideally, it is recommended you upgrade to Drupal 8 now and stay updated with the latest core releases. Migrate content and code to Drupal 8, Check for availability of modules in Drupal 8 using the Upgrade Status Drupal module, upgrade your Drupal 7 modules to Drupal 8 with the help of modules such as Drupal Module Upgrader, remove any deprecated code, upgrade to Drupal 9. And as already discussed, upgrading from Drupal 8’s latest version to Drupal 9 is easy as pie. Upgrading from Drupal 7 to Drupal 9 will take as much resource time (and resource budget) as a Drupal 7 to Drupal 8 to Drupal 9 upgrade. Drupal 7 will reach end-of-life by November 2021 and will continue to receive community support until then. 
  • Stay Up to date with Drupal 8
    With every new minor version release of Drupal 8, the benefits are not only restricted to access to new features and enhancements. It also takes you one step closer to Drupal 9. Since Drupal 8.8 is the last minor release before the Drupal 8.9 release (which also happens at the same time as Drupal 9!), it is the last Drupal 8 version to contain significant feature additions. Drupal 8.9 releases on June 3rd, 2020 and will include more stable modules (that were previously experimental) and a few UX and API enhancements. So, the best thing to do now is to keep Drupal core updated and update your website to Drupal 8.8. 
  • Weed out the Deprecated code
    Make way for new and improved features by removing old and deprecated code from your Drupal 8 codebase. When you keep Drupal core and contributed modules up to date, you are also embracing cleaner code. Updated versions remove usage of deprecated code and API. There are various methods to check for deprecated code. 
    • Sometimes functions are marked with @deprecated annotations that warn the developer that the following code is deprecated and what they should be using instead. 
    • Use a command-line tool like Drupal Check (by Matt Glaman from Centarro) to help check for deprecated code and other bugs. It can also be integrated in continuous integration environments.
    • Leverage the Drupal 8 Upgrade Status module on top of Drupal-Check for a more UI based solution. It can scan your entire Drupal project and generates a report that illustrates any compatibility issues and Drupal 9 readiness. 
    • Drupal.org also offers support to check for Drupal 9 readiness and deprecation within its testing system. Like enabling static analysis with phpStan or by setting a trigger_error() when a deprecated level is reached.

      Once identified, it is time for some manual work to remove the deprecated code and refine existing codebase. Use automated tools like Drupal 8 rector to resolve some code issues, although it does need some manual intervention.

Jan 07 2020
Jan 07

You’ve just freshly installed Drupal 8 on your computer and you are really looking forward to
getting your website up and running fast. You want all those amazing features you have heard
about of Drupal 8. So, what do you do next? Pick your Drupal 8 modules! Coz modules are the
building blocks of any great Drupal mansion.


Of course, it isn’t as simple as it sounds. Drupal 8 is powered by its ever-growing open-source
community who work hard to develop thousands of modules that can enhance and extend the
functionality of a Drupal website. Choosing out of thousands of Drupal 8 modules can be a
backbreaker.


Luckily for you, many significant contributed modules from Drupal 7 have made their way to
Drupal 8 core. Which means, you will only need to enable these modules once Drupal 8 is
installed. Let’s dive into a short list of top Drupal 8 modules you must have to build great digital
experiences. Following that, we’ll talk about how to pick your Drupal 8 modules.

Admin Toolbar Module

The Drupal Admin Toolbar module is extremely useful for better navigation for site admins and
site builders. The default Toolbar isn’t very user friendly. This module aims to extend the
functionality of the toolbar by offering drop-down menus that allow easy access to various
admin pages. It also offers a submodule to extend its functionality called Admin Toolbar Extra
Tools. This submodule adds more helpful links to the admin menu to perform tasks like flush
cache, run cron and more.

Paragraphs Module

The Drupal 8 Paragraphs Module gives a lot of power in the hands of content authors and
editors. It allows them to create flexible and structured content easily. You can now add various
paragraphs field types like images, text blocks, quotes, slideshows, videos and so much more.
Using the familiar node edit form, you can add/play around with as many paragraph items and
place them wherever you want to. It also offers widgets (still in experimental) which will allow drag and drop functionality, duplicating paragraphs and many other features that can elevate
user experience while working with the Paragraphs module.

Webform Module

This is one Drupal 8 module that is always on my recommended-modules-list. It is so versatile
and such an essential Drupal module that it is hard to ignore. Almost every website needs a
form. A contact form or a survey form or a feedback form – there is no running away from
them. The Drupal 8 Webform Module is a rich form builder that is easily customizable and
extendable. It allows to collect form data, send it to third-party applications or send emails to
admins or users. You can also export this data to spreadsheets for further analysis. There’s so
much more that the Webform module offers which cannot be summed up here.

Display Suite

The Drupal Display Suite module is a very easy-to-use and handy tool to build page layouts. It
offers a slick drag and drop interface to arrange content. There are a list of predefined layouts
and templates to choose from. Custom layouts and templates can also be created and added in
the theme. Custom view modes and custom fields can also be defined.

Devel Module

The Drupal Devel module is a very handy tool for developers and site admins. It is widely used
in testing purposes because of its ability to generate a lot of content for nodes, comments,
users and various content types and entities. Also, it allows developers debug any problems
with node access. Page footers can be added for all pages with the help of its submodule called
Webprofiler. Webprofiler also gives the site admins an insight to some analytics about the
caching abilities, database queries, resource utilization and much more.

Drupal GraphQL Module

GraphQL is a modern querying language that replaces old-timers like REST to communicate with
APIs. It is faster and yields only the results you are looking for – minus all the unwanted
baggage that comes along with a REST API call. The Drupal GraphQL module enables your
Drupal website to create GraphQL schemas and expose Drupal entities with GraphQL client
applications.

Pathauto Module

Having a well-structured URL does not only improve the user experience, it is very vital for
search engine optimization too. The Drupal Pathauto module is definitely a must-have module
in every Drupal project. It helps in automatically generating SEO friendly and well-structured
URLs. Site admins can also change the pattern system by changing the tokens it uses.

Google Analytics

The Drupal Google Analytics module adds Google analytics tracking system to your website.
Using this Drupal module, all features of Google analytics can be accessed and integrated with
your website. It allows for domain tracking, users tracking, monitoring tracked links, monitoring
downloaded files, site search, Adsense support and much more.

Things to Remember while choosing your Drupal 8 modules

Be it personalization modules, social media integration modules, marketing automation
modules or any other module, you can always find more than one for each functionality. Here’s
what you should keep in mind before making a choice:

Compatibility

Before you download a module, you should know if it is going to be compatible with your
version of Drupal. You just cannot install a version 7 module into your Drupal 8 installation
without cross checking if it is supported. To find out what version of the module has been
released in Drupal.org, you can go to the module’s project page and scroll right to the end
where you will see the download link and find the release versions specified. If it isn’t specified,
go to http://drupal.org/project/Modules/name and filter by Core compatibility.

They’re free but they consume space

You must keep in mind that although the contributed Drupal modules are free of cost, they are
not feather light. Unused modules can unnecessarily consume a lot of space and resources
which can make your Drupal website heavier and slower. So, before you download a module,
analyze if you really need it or if any other core module can perform the same functionality for
your website. Also, feel free to abandon those hardly used and inactive modules to make your
website feel healthier and light.

Actively Maintained Modules

It is very important to choose modules that are actively maintained, updated and published by
the developers. Because, if you run into any security vulnerabilities or any other issues, you
know that you can get a quicker response from the developer/contributor. Also, you will be
sure that an updated new version is on its way soon.

Popularity

Using popular modules means you can trust the module to do the job and be secure with less
issues. In the module’s project page on drupal.org, you can see the number of downloads and
how many websites are currently using that particular module.

Look out for issues

On the right side of the Drupal module’s project page, you can find the number of issues and
bugs (open and closed) associated with that module. On clicking on the link, you will be able to

see a detailed report of all bugs and issues. Looking at this can give you an idea if the module
can really help you with your functionality or not. The ‘Last Updated’ date can also give you an
idea of how active the developers are in solving issues and how responsive they are.

Dec 31 2019
Dec 31

In 2018, The Open Source Initiative celebrated its 20th Anniversary, a milestone and a huge success for the global non-profit dedicated to raising awareness and adoption of open source software. Since its inception, the open source movement has gained tremendous momentum in corporate computing. In the recent years, open source has entered the government sphere as well.

One such popular open-source platform is Drupal. Developed by Dries Buytaert in 2001, Drupal became a sensation when it was used to build a network for the Democratic primary campaign of Howard Dean in 2003. Since then, Drupal has come a long way and now more than 100 countries use Drupal for their government websites.

Steve Nichols, CTO of Georgia Technology Authority, which runs more than 65 state government websites, recently talked about how shifting to a Drupal platform helped him manage the government websites in a better way. Earlier, these government websites were running on two different versions of proprietary software - Vignette 6 and Vignette 7. But as the functionalities increased, it became very cumbersome and expensive. Soon they started looking out for other options, and all the evident choices pointed to open source CMS, and the most obvious and the strongest among all the contenders was Drupal.

When they dug a little deeper, they found out that many key federal government sites were being powered by Drupal, and that is when they decided upon to narrow down on the Drupal CMS.

So why exactly do these government websites opt for a Drupal CMS among the plethora of options? Why is the most obvious choice Drupal? Let us know a bit more about what makes Drupal so special!

Drupal's Market Share

In the present world, with more than 150 federal government sites running on Drupal platform, it is kind of obvious that the Drupal CMS has an enormous market share when it comes to the government websites and the public sector in general.

Nasa Website build with drupal cms

The list contains big guns like NASA, Department of Health, Department of Education, Transportation, Defense and Homeland Security. When Drupal platform is being preferred by some of these big government sites, it is not surprising to see that many other private and media companies are inclining towards Drupal CMS for their own websites.


Drupal's Adaptability Features

A few years back, the energy department's website, energy.gov got into a lot of trouble. The website faced low traffic, high bounce rate, and to make it worse, the entire website was built on the basis of an internal office structure which made it quite impossible to navigate. It needed immediate attention, and that is when the organization decided to migrate their website to Drupal.

One of the greatest strengths of the Drupal CMS is its ability to integrate with any other solutions and services. Even a proprietary CMS such as Sharepoint, is likely to coexist with Drupal and other open source platforms. The modular system that a Drupal CMS works on, allows it to adjust easily based on the type of deployments.

Security

While the typical stereotypes about open-source platforms is that they are quite vulnerable to threats, Drupal has a track-record of being one of the most secure open-source CMS. Well-equipped to handle cyberthreats, the Drupal community does a great job to work together and ensure that they eliminate any threats before they affect the users.

Drupal consists of several security modules, making it one of the most reliable platforms amongst several others. Some of these modules include, Login Security, Password Policy, Captcha, Security Kit etc.

Multisites - An Easy Task

Governments tend to have multiple websites, in multiple languages in order to handle various sections of their administration. Irrespective of whether the government has just a couple of websites or few hundreds, the task of building each one of them individually and maintaining them is going to be a tough job.

Drupal CMS makes it easier with its multisite feature, allowing the developers to copy the site's code base and create as many new websites as required. Thus, by leveraging the features and functionalities of an already existing website, the need to build every single site from scratch, is eliminated.

Additionally, Drupal also offers out of the box Content and Entity Translator modules which help content authors to translate pages, individual fields, elements and more. Thus, multiple sites in multiple languages is an easy feat with Drupal CMS.

Say Hello To DeGov

DeGov is the first of its kind Drupal 8 open source distribution that focuses on the needs of government organizations only! DeGov offers a comprehensive set of customized functionalities which are commonly used only for those applications that are necessary for government websites.

With the ability to release federal and state portals, internet sites for ministries, authorities, municipalities and more, DeGov distribution allows web pages and group-specific portals to be created easily, without any hassle.
Learn more about DeGov here.

Dec 17 2019
Dec 17

GraphQL talks to Drupal in HTTP and the outputs are more structured than ever before!

Today, great customer experiences begin with great content. Content that is made available everywhere. With Drupal 8’s API-first initiative, the content that is managed by Drupal can be readily used by other systems over HTTP. REST (Representational State Transfer) provides a design standard for APIs. However, with client applications getting more complex and challenging, developers need a more modern and effective solution.

GraphQL was born out of the demand for a more flexible and powerful client-server interaction. It is a sophisticated query language and an execution machine. In 2012 Facebook created the specification for it, which describes its capabilities and the requirements of data models for headless applications. 

What is GraphQL? 

GraphQL is an adaptive standard for APIs and provides a runtime to fulfill those queries. GraphQL gives a complete and reasonable details of the information in your API. It's developed with an ideology of "Ask for what you need and get exactly that". It empowers the client to fetch for the exact response they need from the API, nothing more - nothing less. 

GraphQL Advantages

Few of the many advantages of using GraphQL for Drupal -

  1. Faster frontend development

    Emphasize quickly on applications without waiting for new backend endpoints. Improve data fetching and code maintenance by getting the data in the shape you need.
     

  2. Ask for what you need and get exactly that

    It provides the exact response the client asked for. It always returns predictable result. Applications using GraphQL are also stable because the application controls the data it gets, not the server.
     

  3. Use your existing data

    GraphQL can be used with any existing infrastructure e.g. REST, SOAP or existing database, or anything else. It allows you to query all the data in a single request and provides you a cleaned predictable response.
     

  4. Fewer bytes and roundtrips

    Using GraphQL all the required data can be fetched using single query. It’s makes the
    application faster.

drupal-graphql
                                 GraphQL with Drupal 8

REST vs JSON:API vs GraphQL

If we compare these three according to request efficiency, JSON:API and GraphQL are excellent. Because in a single request JSON:API and GraphQl can serve all the required responses. In case of JSON:API, sometimes we have to tailor the response but when it comes to GraphQL, it only serves what we need. REST is slower as compared to these, because multiple requests are needed to serve the common needs. 

In terms of operational simplicity and implementation, REST is the easiest, it has been there for quite a while now. JSON:API also works out of the box with CDN and reverse proxies. For GraphQL extra infrastructure is needed and client libraries are necessary to implement it. 

It’s easier to use web cache in REST and JSON:API as compared to GraphQL. In GraphQL, there’s only one endpoint (most of the time an HTTP POST endpoint) where all the queries are sent. Since each query can be different, it is harder to use this type of caching.

The Drupal GraphQL specification supports bulk/batch operations automatically for the mutations you've already implemented, whereas the JSON:API specification does not. The ability to perform batch write operations can be important.

Installing GraphQL for Drupal 8

The Drupal GraphQL module supports all the GraphQL specifications and can be used to build and expose GraphQL schemas. The latest alpha release of the Drupal 8 module in the version 8.x-4 offers a capability for Drupal modules to extend the schema with a plugin.

Here is where you can install Drupal GraphQL module from - https://www.drupal.org/project/graphql
You can install using composer command.

composer require 'drupal/graphql:^3.0'

It will provide you two modules GraphQL Core and GraphQL. You need to enable both the modules. You can enable it using drush e.g.

drush en graphql
drush en graphql_core

Queries with Drupal GraphQL

Drupal GraphQL module provides a tool called GraphiQL. It’s a powerful tool and has an interactive UI with functionalities like auto completion. Using this tool, you can run queries and get outputs. Navigate to – “/graphql/explorer” for the interface.

You will get a UI that looks like this –

GraphQL-UI           
           GraphiQL UI

On the left side panel of this UI you can write a query and on the right side, you will see the results as an output in JSON format. Clicking on Docs at top right corner, will get you the documentation of the available queries. Query Variable section on the bottom left panel can be used to pass query variables.

Examples

1.Querying Nodes

Quering-nodes-graphql            
            Drupal GraphQL - Querying Nodes

2. Querying Taxonomies

Drupal GraphQL - Querying Taxonomies      
           Drupal GraphQL - Querying Taxonomies


3. Querying Routes

Drupal GraphQL - Querying Routes
          Drupal GraphQL - Querying Routes

4. Query Fragments

Drupal GraphQL - Query Fragments
          Drupal GraphQL - Query Fragments

5.Filters

Drupal GraphQL - Filters
            Drupal GraphQL - Filters

6. Filters with conjunction

Drupal GraphQL - Filters with Conjunction
         Drupal GraphQL - Filters with Conjunction

Other available operators are: 

  • EQUAL
  • NOT_EQUAL
  • SMALLER_THAN
  • SMALLER_THAN_OR_EQUAL
  • GREATER_THAN
  • GREATER_THAN_OR_EQUAL
  • IN
  • NOT_IN
  • LIKE
  • NOT_LIKE
  • BETWEEN
  • NOT_BETWEEN
  • IS_NULL
  • IS_NOT_NULL

Conjunctions can have two values

You can also use Groups to write more complex queries.

7.GraphQL variables

Drupal GraphQL - Variables
           Drupal GraphQL - Variables

Mutations

In GraphQL, a mutation is the terminology used whenever you want to add, modify, or delete data stored on the server. In this case, Drupal. Unfortunately, the module does not include a way to perform common mutations out of the box due to some technical requirements of GraphQL.
Example code for creating, deleting, updating, and file uploads, can be found here: https://github.com/drupal-graphql/graphql-examples

Example mutation:

Drupal GraphQL - Mutation example
           Drupal GraphQL - Mutation example

Drupal GraphQL with Twig

Using Drupal GraphQL with Twig can significantly improve the performance of your website. Here’s how – When you inject data into the Twig template, you can fetch all the required data using a single API call. Moreover, because the client controls the data they get and not the server, it makes the process even faster.

To use Drupal GraphQL with Twig we need the GraphQL Twig module. To download and enable it, use the following commands:

composer require 'drupal/graphql_twig:^1.0'
drush en graphql_twig

And then you can use GraphQL query in your website e.g.

{#graphql
query {
  admin:userById(id: "1") {
    uid
    name
  }
  user:currentUserContext {
    uid
  }
}
#}

You will get the response data in the GraphQL variable.

Dec 10 2019
Dec 10

Computed Field Module is extremely beneficial to a Drupal developer at various events. There are times when you have tons of Fields, a few of which can be consolidated into one field. Sometimes, you might need a field that is a computation of two or more fields, which does not need user inputs. Or you might just want to store the current user’s data directly into the database. 
  
When you want to populate content automatically without user inputs in Drupal, we can leverage the Computed Field Module for Drupal 8. This module is a very powerful field module that allows us to insert custom calculated/computed fields via PHP code. These values can be either stored directly in the database or can be calculated while using node views. 

This module comes with a security warning as the custom code entered in the field is going to be saved in the database. Adding PHP code in the text area (“Insert your working code here”) without the use of Hooks in custom modules, is a huge threat to the security of your website. This module is recommended to be used by developers with good skills and knowledge in PHP and Drupal APIs. It is also recommended that you first test your PHP code in the Body field of a Drupal page.

Installing the Drupal 8 Computed Field Module:

Initially, you will need to download the Drupal Computed Field module from this link - https://www.drupal.org/project/computed_field/releases/8.x-2.0 or you can  Install with the Composer :  composer require 'drupal/computed_field:^2.0'

Once you have installed the module, navigate to extent and enable the Computed field module. 

Enable computed field module               Figure 1- Enable the Computed Field Module

Using Computed Field to automatically populate content

Step1 - Once you have enabled the module, navigate to Structure -> content- type -> select your content type. For now, I have selected the Article content type.

Step 2 - Go to Manage fields, add field of type Computed field. There are 5 types of computed fields - 

  • Computed (decimal): This field automatically populates as decimal value based on the php code.
  • Computed (float): This field automatically populates a floating value based on the php code.
  • Computed(integer): This field automatically populates an integer valued based on the php code. 
  • Computed (text): This field automatically populates a string values based on the php code.
  • Computed (text, long): This field is the same as Computed text but takes more text.
select field type         
           Figure 2 - Select the Field Type

Time to Try it out! Let us now automatically calculate and populate the age of a person based on their Date of Birth that the user has entered.

Step 3 -  First, we will have to add the Computed Field. In our case I am going to calculate the Age of a person so I will add the field by navigating to 
Configuration -> Account settings -> Manage fields. Lets’ select the Computed (integer) field to populate the Age automatically.

computed field         
             Figure 3 - Add the Computed (integer) Field


When we add the Computed (integer) field and give a Label (name of the calculated field), click on Save. We will then see this window as shown in the image below.

Setting up the Drupal Computed Field            Figure 4 - Setting up the Drupal Computed Field

Step 4 -  In the settings window, you can add an optional Help text that instructs the user on what the calculated field value is about. The most important part, however, is the text-area called “Code (PHP) to compute the integer value”. Here is where we write the custom code to calculate the Age (in this case). Below the text area you will see some security warnings and some suggestions/recommendations. Also mentioned are a few example variables that can be used in the PHP code. In our case, I am going to write the PHP custom code to calculate Age in the PHP code text area. To automatically populate the Age.
 

Calculating the Age within the PHP Code text area            
           Figure 5 - Calculating the Age within the PHP Code text area

Inside the PHP code text area, we can also use “if” conditions to populate the content automatically.

Step 5 - After writing the custom code for the Compute Field, hit the save button. Next, lets’ test this by entering the Date of Birth.

Entering the Date of Birth           
           Figure 6- Entering the Date of Birth

Step 6 - After saving the content the Age will be populated automatically (as shown in the image below)

Figure 7 - Calculated Age presented to the user             
           Figure 7 - Calculated Age presented to the user

This is a very simple example of using the Drupal 8 Computed Field Module but similarly you can populate values with various types of computations and custom code. 
 

Dec 03 2019
Dec 03

With our Drupal SEO guide, you don’t have to go too far in search of SEO modules, features and tips to boost your Drupal website ranking. Read and bookmark this for future reference!

We all know Drupal as this robust, flexible and dependable CMS platform but not many realize its abilities when it comes to SEO. SEO can be one of the most influential factors for the success of an organization or a business. Did you know that 93% of online experiences start with search engines and 51% of all website traffic is attributed to organic searches (source)?! 

When people from around the globe search for your product or services, you want to appear as high as possible on the search engine ranking. Improving your SERP (Search Engine Results Page) ranking is now more important than any other marketing strategy. Ideally, Drupal SEO is about making your website easy for both your visitors and the search engine crawlers to understand. Thus, your SEO strategy begins long before your Drupal website is built. With an effective long-term perspective, its amazing collection of modules, its flexibility and customization options and not to forget, the loyal community working towards the betterment of the open source platform, Drupal 8 tops the CMS chart. Drupal 8 offers some exemplary SEO modules that can boost your Drupal 8 SEO and SERP ranking.

Lay your Foundation

With Drupal 8, most of the required SEO best practices are already embedded into the core of the platform and with a little knowledge of SEO and some must-have configurations, anybody can possibly boost their website’s SEO to drive more traffic. But before you jump right into the tools and other configurations on Drupal 8, sit back and think about the basics which you need to get right for your website's success.

Things to remember -

  • With your website goals in sight and your visitors' interests in mind, sit down and form a proper pre-SEO strategy to begin with. 
  • Know your audience before you begin with your Drupal 8 SEO strategy. Once your audience set is established, shooting targeted content will be easier.
  • Pay attention to every detail that goes into your On-page SEO (content, improve keyword ranking), Off-page SEO (backlinks) and Technical SEO (site architecture, UX, clean code). 
  • Website performance and site speed directly contribute to a website’s SEO ranking factor. This is not just true because of Google’s algorithm update for speed but also because a slow loading website hampers user experience.
  • Yes, come 2019 and Google has changed the way SEO used to work previously. The focus is more now on the value you bring to your users – mainly through content. Hence, getting your Content strategy right is very crucial for a good website ranking.
  • Google favors websites that make it easy for users to navigate and access irrespective of the device. With Drupal 8, you can be assured of a responsive website because of its Mobile-first approach. 
  • Remember that SEO works differently for different businesses. There is no one-size-fits-all when it comes to crafting an SEO strategy for your Drupal website.

Top 5 Drupal SEO Modules to Optimize your Website

With Drupal 8 and the continuous innovation approach, it has adopted some of the best-in-class technologies thus making it more future-proof. More importantly, it has made content authoring more powerful and easier at the same time. One of the great things about Drupal 8 is that it is "SEO ready" right out of the box. To begin with, let us talk about some top Drupal SEO modules that help enhance your SEO efforts on your Drupal website.

1. Drupal SEO Checklist Module

If you are a ‘To-do-list’ person who is in love with organizing things, this Drupal SEO module is for you. This is an important SEO module which does not directly affect your Drupal SEO and improve the SERP but will provide critical information on the changes to be made on the site. The Drupal SEO Checklist module checks your entire Drupal website for proper search engine optimization against SEO best practices and tells you what to do. It provides a detailed report on what needs to be done to improve the performance of your Drupal website.

seo-checklist
          Drupal SEO Checklist

The Drupal SEO checklist module keeps a track of how tasks have been taken care of, what has already been done (with timestamps) and what needs to be attended to. If a task needs you to install a module, it provides with a link to download it as well. This data provides a report that can be used for further monitoring.

2. Pathauto Module

Using clean URLs that indicate what content it represents is extremely important for SEO. One of the most important and useful modules for Drupal SEO, Pathautho module plays a major role in creating SEO-friendly URLs on your website. The usual "example[dot]com/node/1" can be replaced with more SEO specific URL aliases such as "example[dot]com/page/keyword". Based on the category of your website page or based on the page title, with Pathauto SEO module you can build URLs which are SEO friendly. These intuitive URLs are easy for the visitors on your site to understand what they are looking at and where they are, which helps in improving your site ranking on search engines.
 

pathauto.
         Pathauto Module

3. Google Analytics Module

In our recent post, we discussed how you can add Google Analytics module to your Drupal website and also create custom reports for better performance of your website. Though the Google Analytics Drupal SEO module does not have any direct effect on your Drupal SEO or does not improve your search engine ranking, it plays a major role in providing the necessary information that can amplify your Drupal 8 website's SEO success. By tracking your visitors, their behavior and interests within your site, you can change or add new strategies to drive more traffic and increase conversions. You can also use the GA Reports module that can provide you with a graphical representation and details reports about your Drupal website.

drupal google
        Google Analytics Module

4. Global Redirect Module

Google certainly does not like spammy duplicate content on a web page. Such content can have a negative impact on your SEO efforts and as a result, can harm your rankings on the search engine. On Drupal, while you are happy creating clean URLs with the alias system, you should note that there is a small problem arising. With the creation of new URLs, the default URL still exists and the search engines do not see it as a good sign.

global-redirect.

         Global Redirect module

The Global redirect module helps in rectifying this problem by verifying the existence of an alias for a URL and redirecting it to the same. The Global redirect module also plays a role in checking the URL implementation and permission or the access required to the nodes and URLs. However, this module has been deprecated for Drupal 8 and the functionalities are now merged into the Redirect module.

5. SEO Compliance Checker Module

A module which is of great help to Drupal SEO beginners and webmasters, SEO Compliance Checker module performs a complete check when a node is created or modified on your Drupal website. The execution includes checking if the titles and meta tags are optimized, no alt tags are missing, optimized keywords usage and other important factors for better SEO and to improve keyword ranking.

compliance-checker.
           SEO Compliance Checker Module

While the core module - seo_checker does not perform any of these checks, it is the submodules that come along (basic_seo_rules.module and keyword_rules.module) which execute these checks for the implementation of some basic SEO rules. The core Drupal module, on the other hand, gathers the required information about the checks to be performed and applies them to collect the results.
In addition to these modules, there are many other Drupal 8 SEO modules such as the Page Title module which allows the page title to be set, the Meta tag module which equips you with complete control of meta tags on your Drupal website, and the XML Sitemap module to create a search engine readable, dynamic sitemaps.

Some Additional Tips to Improve your Drupal site's Ranking

Just to let you know, in the time you took to read the blog until this point,

  • More than a million Google searches were made.
  • Close to 20,000 Facebook posts were posted.
  • More than 1000 blogs were posted on the internet.

The internet is noisier than ever now, and it doesn't seem like it is going to stop anytime soon. SEO at its beginning stages was all about cramming your website with keywords and let the crawlers do their magic. But over time, SEO has blossomed with Google introducing some amazing algorithms and updates to curb the black hat SEO practices.
Right now, for a successful Drupal 8 SEO campaign, you need to study your visitors, their behavior and interests on your website and curate the content accordingly to stay ahead of the curve. You don't want to be in the midst of a content gap which can create problems for your website's conversions. With this study, you have a real opportunity in hand to develop fresh content for your Drupal website and optimize it for the searches on the search engine.
 

Nov 26 2019
Nov 26

You can run. But you can’t hide… When you’re listed on an XML Sitemap.
Back in 2005, around the time when one of my favorite shows – The Office (US version), premiered on NBC, Google was busy introducing Sitemaps to the world. When the world wide web started getting loaded with websites that consisted of multiple webpages, search engine spider bots like Googlebot found it excruciating to understand which of those pages need to be indexed (listed). Enter Sitemaps. They help in relieving some stress off of search engines. Sitemaps also let you control the priorities of your pages, frequency of page changes and modified dates. Setting up XML sitemaps with Drupal 8 is easy and you can choose from Drupal sitemap modules like the Simple XML Sitemap module or the XML Sitemap module.

What is a Sitemap?

Sitemaps are XML (Extensible Markup Language) files that contain a list of all your webpages and their locations. Listing out all your URLs in a single Sitemap file ensures that search engines like Google, Yahoo, MSN, etc., ‘indexes’ your content that is ready to be seen by the world. Here is an example of our Sitemap -  

Sample sitemap           
               Figure 1- A Sample Sitemap 

The <priority> element tells the crawlers how important that page is to your website with regards to all the other pages. You can set a priority that ranges between 0.0 to 1.0 with 1 being of highest importance. So how important sitemaps are for SEO? This question is often debatable but having a sitemap has proven to improve the time taken to crawl a website by Google/Yahoo bots. Admittedly, the faster your website is crawled the better chance it has at SERP ranking.
Having said that, not all websites need a sitemap. Especially not if your website is small, not very complex and is well referenced through internal links. Here’s what Google has to say about this –

google announcement about sitemap         
             Figure 2 - Google announcement

Drupal Sitemap Modules

SEO has always been priority for Drupal and the community has created tons of modules dedicated to SEO only. With Sitemaps playing a significant role in improving the SEO ranking of a website, Drupal comes with some easy-to-use modules like the Simple XML Sitemap module and the XML Sitemap module. Both Drupal sitemap modules aim to generate XML sitemaps that meet the latest standards and specifications.

 Simple XML Sitemap Module

The Simple XML Sitemap module for Drupal 8 is an easy-to-use XML sitemap generator. This Drupal XML sitemap module has been made specifically for Drupal 8. Needless to say, the codebase complies by the OOP and Drupal 8 standards. Which makes it more futuristic and flexible. It generates XML sitemaps that adhere to Google’s latest standards and even supports multilingual content. The module also provides an API that will allow you to customize links and configurations, making it truly extendible.

Setting up the Simple XML Sitemap Module         
            Figure 3- Setting up the Simple XML Sitemap Module Simple XML Sitemap Module - Advanced Settings         
           Figure 4 - Setting up the Simple XML Sitemap Module - Advanced Settings Setting up the Simple XML Sitemap Module - Priority Settings          
                 Figure 5- Setting up the Simple XML Sitemap Module - Priority Settings

XML Sitemap Module

This robust old-timer has been around since Drupal 5 and continues to support Drupal 8 websites as well. The Drupal XML Sitemap module lets you create xml sitemaps that adheres to the sitemap.org guidelines. Sitemaps generated can be automatically submitted to search engines like Google, Ask, Bing, etc. The module is also flexible and comes with submodules that allow site admins to customize links and the output.

Setting up the XML Sitemap Module           Figure 6- Setting up the XML Sitemap Module Setting up the XML Sitemap Module - Sitemap Content Settings         
            Figure 7- Setting up the XML Sitemap Module - Sitemap Content Settings Setting up the XML Sitemap Module           
              Figure 8 - Setting up the XML Sitemap Module
Nov 22 2019
Nov 22

Accept it, your inbox is infested with Spam and you cannot do anything about it. They’ll just crawl into your website and send you those annoying emails through your contact forms or comments section or just about anywhere they can sneak in through. Sure, you can "Mark" them as Spam. But is that really going to help in keeping all those creepy crawlies at bay?

There are two types of spam – Spambots, which are basically scripts designed to collect email addresses and then spam them , and Human Spammers, who are actually sitting on computers just to spam you. We can protect ourselves from Spambots to a certain level but getting around Human spammers is extremely tricky.

Thankfully, Drupal 8 provides you with plenty of solutions and Drupal modules to protect your website from Spambots. Let us take a look at some of them and see which Drupal 8 modules suit your needs the best.

Capture them with CAPTCHA

We have all come across a CAPTCHA test at some point or the other and though it may seem annoying as a visitor, this can be a very useful tool to a site administrator. It is that fuzzy image of some text that you have to fill in a web form and if you’re a legitimate user you can go ahead with submitting your details. This challenge-response test is a decent way to keep some Drupal spam away, but it isn’t too difficult for them to find a way out either. Thus, using it as a stand-alone solution is not a very good idea. Installing the Drupal 8 Captcha module is as simple as configuring it. 

CAPTCHA Keypad 

Taking it up a notch in Drupal spam prevention with the use of CAPTCHA  is another Drupal module that  provides an alternative CAPTCHA security. CAPTCHA Keypad increases the complexity of a CAPTCHA , making it really difficult for the spammers. This module allows the users to make use of a keypad (which can be configured to shuffle the keys, as required) to enter the CAPTCHA. 

Complicate it with ReCAPTCHA

Drupal reCAPTCHA module makes it more complex for the spambots by using the reCAPTCHA services offered from Google. Built for the sole purpose of security, Drupal  reCAPTCHA module also aims at improving the user experience by allowing the users to complete the test with a single click or a tick mark. 

The Drupal reCAPTCHA module offers a choice to provide checkbox, asking the users if they are a robot or not. Despite the fact that this module makes it easier for the users, it still is a hard nut to crack when it comes to Drupal spam prevention. 

Lure them spammers with Honeypot

Honeypot, as the name suggests, acts as a trap to deter spam bots from posting harmful data into your website. Drupal 8 Honeypot module basically adds a hidden field to your web form which is seen only by spambots. So if the hidden field in your form is filled, then you know it’s a spambot and discard the form. Drupal Honeypot also allows you to set a timer for filling the form since if it is a spambot, they can fill those forms in no time! Let’s say, if you set a timer of 5 seconds to fill your contact form, you will know when a spambot is doing so as us humans would most definitely take longer.

AntiSpam by CleanTalk

Developed by CleanTalk, Drupal Antispam module is another module that tests the user in such a way that the users see no tasks that are required to be solved from their end. Drupal Antispam module does a great job if you have your own list of spam email addresses and IP-addresses that you have detected. 

Using a series of tests that filter the spambot registration & the spams in the comments section, Drupal Antispam module ensures that the spam checks are not visible to any of the website users. This ensures a better and more comfortable engagement with the site, eliminating the extra time spent on completing additional registration forms. 

Antibot

Another Drupal module that boasts of a "NO end user interaction" is Antibot. This light weight module aims to prevent robotic submissions on a Drupal website, with minimal user interactions and zero involvement of API keys and other third party integrations. 

Implementing two major criteria, the Antibot module includes a Javascript interaction test and an analysis for the usage of keyboard and mouse. Also, it also enables caching of the forms, which makes it a lot quicker than other modules like Honeypot. 

Mollom

Developed by Dries Buytaert, the founder of Drupal, Mollom was an intelligent web service that identified potential spam content and decide if the post is legit or not. Using machine learning techniques to block spammers from posting malicious content, Mallom was one of the most used modules for Drupal spam protection. However, on April 2, 2018, Mallom officially announced its end of life. If you are using the Mollom module, it is advised to disable the same and switch to an alternative.

Nov 06 2019
Nov 06

What are your goals of marketing automation? Every organization has varied targets to meet with their marketing automation strategy. According to a study, the most prominent objective is to optimize productivity. The other significant goals are to increase marketing ROI, acquiring more leads, analyzing performance and to align marketing and sales. With tons of marketing automation platforms available in the market today, it is hard to choose the most effective tools that will work for you. 

Drupal CMS lets you create compelling digital experiences. Its ease of use and powerful features make it a great platform for a marketer. Integrating Drupal with marketing automation tools will not just enable you to enhance the user experience but it can turn into an intelligent lead generation and nurturing tool. Drupal 8 offers seamless integration modules with top marketing automation tools like Hubspot, Mailchimp, Google Analytics and many more.

Why do I need a Marketing Automation Tool, you ask?

 “Good marketing makes the company look smart; Great marketing makes the customers feel smart” - Joe Chernov (VP Marketing @ Pendo). 
Great marketing needs more than just a physical team who can manually manage your marketing workflows. Great marketing needs a Marketing Automation tool to help you nurture your leads and expedite your whole marketing process. Did you know lead nurturing can increase your revenue growth by 85%?

  • Marketing Automation tools help converting raw leads to nourished and qualified marketing leads that are turned over to the Sales team for further customer relation management. This implies for both B2B and B2C organizations.
  • It helps track your prospective customer’s activities right from when they visit your website to reading your blogs or filling out a form. 
  • You can also schedule and track your marketing campaigns via email or social media or any other communication.
  • Prospective customers can be easily segmented into suitable mailing lists based on their interests or preferences and will receive/view only relevant content, thus giving you happier (also read ‘less annoyed’) leads. 
  • A ‘drip campaign’ (email campaign) can be scheduled depending on the right time and right interest shown by your leads that will help you stay on top of their minds thereby nurturing your leads. 
  • You will also be able to see the reports/analytics and analyze the success of your marketing campaigns.

Drupal 8 Modules for Marketing Automation 

Drupal is not only known for its robustness and scalability but also for its huge active community of contributors. You will find various contributed Marketing automation modules or plug-ins within Drupal CMS. They are free and out-of-the-box but sometimes might not provide you with as many features as other thirds-party tools. There are a huge number of third-party Marketing Automation software that integrate seamlessly with your Drupal website. 

Webform

No, the Webform module is not a marketing automation module but is one of the most vital building blocks of an integration between Drupal and other third-party marketing automation software. The Drupal Webform module is used to collect user data via forms. You can build forms like surveys, simple newsletter signup forms or contact forms. This submitted data is then pushed to third-party marketing automation systems. Drupal 8 Webforms have a lot more features added like the object-oriented API, source editing, new and improved form elements, extendable plugins, better documentation and more.

webform module                                         
          Webform Module for Drupal 8 – Form elements

Marketo MA

Marketo is a very popular and widely used marketing automation tool that automates activities such as lead tracking and nurturing, personalization, analytics, advertisements, social marketing, automated campaigns and much more across multiple devices. The Market MA Drupal module helps you capture lead data during form submission and adds tracking capabilities to your Drupal website with the Marketo Munchkin tracking codes and API. It also integrates with the Webform module. 

Marketo MA Module for Drupal 8           Marketo MA Module for Drupal 8 – Setting up

Eloqua 

The Eloqua marketing automation tool by Oracle allows for marketing campaign management, email automation and tracker, lead management and engagement, and more. Eloqua Drupal module integrates Eloqua tracking and Eloqua Webforms submodule with your Drupal website. In Drupal 8, the Eloqua module has been divided into separate module fragments like the Eloqua Tracking module, webform Eloqua module, Eloqua API Redux (Drupal 8 and Eloqua REST API integration)

Eloque module                                 
          Eloqua Module for Drupal 8 - High-level design 

HubSpot 

HubSpot marketing automation is well-known to provide users with a wide range of inbound automation tools – the marketing hub, the sales hub and the service hub. Each of them can function alone or all together. The HubSpot Drupal module integrates with Webform and the HubSpot API. Once a user enters their information via Drupal 8 Webforms, the records are sent to HubSpot’s lead management tool, where the leads can be tracked and nurtured.

Hubspot module
          HubSpot Module for Drupal 8 – Setting up

Pardot

Pardot, the marketing automation service by Salesforce, offers marketers a host of activities like digital marketing campaign management, customer behavior tracking, SEO, website tracking, lead generation and nurturing, etc. The Pardot Drupal 8 module adds web analytics onto your Drupal website allowing marketing and sales department to create, deploy and manage online marketing campaigns. 

 Pardot Module for Drupal - Configuring          Pardot Module for Drupal - Configuring

Mautic

By now you must have heard about the acquisition of Mautic, the first open-source marketing automation platform, by Acquia. Mautic allows for multi-channel communications and campaign management, visitor tracking, email marketing, content customization and personalization and more. The best way to integrate Mautic with your Drupal website is with the Webform Mautic module. It lets you add Mautic handlers to the Webform which allows data from to be submitted to the Mautic list. To be able to track website contacts, the Mautic tracking code should be installed in your Drupal website.

Mautic Module for Drupal          Mautic Module for Drupal – Setting up

Google Analytics

Fun fact – Did you know Co-founder of Urchin (now Google Analytics) sold his company to Google on his wedding day (April 2005)? Google Analytics is the most widely used website analytics tool in the world today. No marketing automation is complete without analytics and GA does a great job at it. The Google Analytics Drupal module lets you add a web statistics tracking system to your website. It can track, monitor and support domains, users, files, search system, Adsense, custom code snippets and so much more. To generate reports for all your tracked data, the Drupal module for Google Analytics Reports can be installed.

google analytics
          Google Analytics Module for Drupal – Setting up

MailChimp

MailChimp is a very popular email automation platform that does more than just sending emails. You can create custom campaigns, send and schedule automated emails based on certain predefined triggers, track and monitor customer behavior, personalize, generate reports, etc. The Drupal MailChimp module integrates your Drupal website with Mailchimp which will help in tracking and creating a list of website visitors. This list is sent to the MailChimp list from where email automation and other features can be accessed. You can also create signup forms, campaigns and track activity from your Drupal website. Your visitors can also have a control over which of your email lists they want to be on or off.

Mailchimp Module for Drupal
          Mailchimp Module for Drupal – Sign up form


 

There are a few Marketing Automation tools that include a collection of marketing components:

IBM Marketing Cloud is a hybrid marketing automation tool based on Silverpop’s cloud-based marketing automation software, DemandTec’s cloud analytics and Xtify’s mobile messaging models and enhanced by IBM marketing software.

Adobe Marketing Cloud includes components like Adobe Target, Adobe Social, Adobe Campaign, Adobe Media Optimizer and Adobe Analytics. Adobe Analytics (previously SiteCatalyst) is a module that you can integrate with your Drupal website that helps provide detailed statistics about website traffic and can categorize customers based on their locations, preferences and behavioral traits.

Oct 30 2019
Oct 30

A website without Meta tags is like a shop without a signboard. With Meta tags, you can showcase what your business/website is about without giving out too many details. Something that can captivate your audience and make them want to click to know more about your website. The Meta tag module in Drupal 8 lets you easily and dynamically create and customize various meta tag elements that can help you improve your search engine optimization (SEO) ranking.

Meta tags have been around for a very long time and play a significant role in optimizing your website for search engines. You can reach your audience organically when you set up meta tags the right way. 

So, how can you improve your Drupal website’s SEO with meta tags while being able to create or modify them as you like? Easy – Leverage the Meta tag module for Drupal 8. 

Meta tag Module for Drupal 8

With the Meta tag module, adding structured metadata about your website is easy. In addition to Meta tags for Keywords and Description, you can also customize content you want to display for each of your social media networks. It supports meta tags for Open Graph Protocol, Twitter Cards, Dublin Core and much more. The inclusion of Drupal Console integrations helps developers to create various custom meta tags too.

Getting Started: Installing the Meta tag Module

Meta tag module requires you to install the tokens and ctool modules.
You will need to download and install the meta tag module from Drupal.org or download it through the composer dependency manager. 

Enabling Meta tag module

Meta Tags

Go to Extend Search for meta tag and enable it. Along with meta tag, you can also install the meta tag extensions such as open graph, twitter cards.

Configuring the Meta tags

Go to Configuration. Click on Meta tag under Search And Metadata.

meta tag moldule

By default, you will get these set of types. Global will be applicable to all your pages. You can create your own Default meta tags for a content type or taxonomy terms and configure it according to your requirements.

Basic Tags

basic tags

These are the foundation tags in meta tags which are very effective in improving your Drupal website’s SEO.

Page title will set the title of the page. While the title tag doesn’t start with "meta", it is in the header and contains information that's very important to SEO.
Description will let you give a brief description of the page. It is used by search engines in the search results to display a brief description about the page.

Advanced Tags

advanced tags

These are optional tags that you can use for improved SEO results.

Geographical tags give the information related to the location. Canonical URL will tell the search engines that the certain URL could have duplicate content and need not be displayed in the search results. Robots will give the option to configure how you want your site links to be seen by the search engines, preventing google translation, disabling the search engine indexing etc. Image is a URL to a unique image representing the content of the page.

Open Graph Meta tags

Open graph meta tags

Open Graph meta tags helps with sharing content on social networks like Facebook, Pinterest, and others. The site name, title, image and description will be the brief content show while sharing. Here you can specify the type of image or video. It is important that you specify the image width and height.

Oct 15 2019
Oct 15

Drupal 8 is making things so much easier for content authors. One of the most important reasons being the addition of the Layout Builder module in core Drupal 8. With easy drag and drop interface, preview and customizing abilities, the layout builder is soon becoming a favorite page-building and designing tool.

In my previous article, I wrote about how you can get started with installing and using Drupal 8’s Layout builder. Here, I want to share my knowledge on customizing a layout builder for unique requirements.

If your drupal website needs multiple sections with multiple blocks, then you can’t use the default sections that are provided by Drupal. For this, you can create your own custom layout.

Getting Started with Layout Builder :

We will first create a custom layout builder module for our custom layout builder We will name the folder as custom_layout. Next, we will create an info.yml file. We should specify the basic keys for it. The custom layout builder in drupal 8 will have a dependency on the layout builder module. Let us specify it over here.

custom layout
Code:
name: 'Custom Layout'
type: module
description: 'Provides a way for building layout'
core: 8.x
package: 'Custom'
dependencies:
 - layout_builder:layout_builder

Next we will create layouts.yml file to specify regions for our custom layout.

  • custom_layout: key for our custom layout builder layout.
  • label: Label for our custom layout builder layout.
  • category: Category for our custom layout builder layout.
  • default_region:  Default region are the regions which are default in all type of layout.
  • icon_map: Icon which will be shown up while we choose our layout.

Eg:
 

custom-layout

To create above icon map we need to follow the below steps.

1. First row is “Header Left” and “Header Right”
         We have specified - [header_left, header_left, header_right] - header_left is             
         defined 2 times so it will take 2 parts of total width of the   screen then header_right will take rest of the portion so ratio will be  “75%/25%”.
2. Second row is “Content” and “Sidebar”
        We have specified - [content, content, sidebar]   same above logic applied here.    
3.  Third row is “Footer Left” and “Footer Right”
        We have specified - [footer_left, footer_right] -  since there are only 2 regions it will take 50% each.
        

  • regions: Regions which we need for our layout. We have header_left, header_right, sidebar, content, footer_left, footer_right.
custom layout builder

Code:

custom_layout:
 label: 'Custom Layout'
 category: 'Custom Layouts'
 default_region: content
 icon_map:
   - [header_left, header_left, header_right]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [footer_left, footer_right]

 regions:
   header_left:
     label: Header Left
   header_right:
     label: Header Right
   sidebar:
     label: Sidebar
   content:
     label: Content
   footer_left:
     label: Footer Left
   footer_right:
     label: Footer Right

Next, let us create an html structure for our layout. We will create a folder named “layouts” within our module. In the folder we will create another folder named “custom_layout”

And within that folder, we will create twig file named “custom-layout.html.twig” 

custom layout builder


We have to specify the twig file in layouts.yml 

  • path: It specifies in which folder your html structure will be written
  • template: It specifies which twig template to use for this layout under the path.
custom layout
Code:

custom_layout:
 label: 'Custom Layout'
 path: layouts/custom_layout
 category: 'Custom Layouts'
 template: custom-layout
 default_region: content
 icon_map:
   - [header_left, header_left, header_right]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [footer_left, footer_right]

 regions:
   header_left:
     label: Header Left
   header_right:
     label: Header Right
   sidebar:
     label: Sidebar
   content:
     label: Content
   footer_left:
     label: Footer Left
   footer_right:
     label: Footer Right

Next we will write html structure for our regions in “custom-layout.html.twig” file.
We will set classes has “layout” and “layout--custom-layout”  and we will wrap the whole content inside it.
We will specify regions which where been defined in layouts.yml , we can access those regions like “{{ content.header_left }}”
 

layout builder

Code: 

{% set classes = [
 'layout',
 'layout--custom-layout',
] %}
{% if content %}
 <div{{ attributes.addClass(classes) }}>
   {% if content.header_left %}
     <div {{ region_attributes.header_left.addClass('layout__region', 'layout__region--header_left') }}>
       {{ content.header_left }}
     </div>
   {% endif %}
   {% if content.header_right %}
     <div {{ region_attributes.header_right.addClass('layout__region', 'layout__region--header_right') }}>
       {{ content.header_right }}
     </div>
   {% endif %}
   {% if content.content %}
     <div {{ region_attributes.content.addClass('layout__region', 'layout__region--content') }}>
       {{ content.content }}
     </div>
   {% endif %}
   {% if content.sidebar %}
     <div {{ region_attributes.sidebar.addClass('layout__region', 'layout__region--sidebar') }}>
       {{ content.sidebar }}
     </div>
   {% endif %}
   {% if content.footer_left %}
     <div {{ region_attributes.footer_left.addClass('layout__region', 'layout__region--footer_left') }}>
       {{ content.footer_left }}
     </div>
   {% endif %}
   {% if content.footer_right %}
     <div {{ region_attributes.footer_right.addClass('layout__region', 'layout__region--footer_right') }}>
       {{ content.footer_right }}
     </div>
   {% endif %}
 </div>
{% endif %}

After the html structure is written, we will have to write css for each region. We will now create libraries.yml in our custom module.

layout-builder

Code:

custom_layout:
version: VERSION
css:
   theme:
     css/custom_layout.css: {}

We will define that library in layouts.yml

  

layout builer

Code:

custom_layout:
 label: 'Custom Layout'
 path: layouts/custom_layout
 category: 'Custom Layouts'
 template: custom-layout
 library: custom_layout/custom_layout
 default_region: content
 icon_map:
   - [header_left, header_left, header_right]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [content, content, sidebar]
   - [footer_left, footer_right]

 regions:
   header_left:
     label: Header Left
   header_right:
     label: Header Right
   sidebar:
     label: Sidebar
   content:
     label: Content
   footer_left:
     label: Footer Left
   footer_right:
     label: Footer Right

Now let’s start with styling our regions block. We will specify structure  for each region as below-

layout-builder

Code:

.layout--custom-layout {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
}

@media screen and (min-width: 40em) {
 .layout--custom-layout .layout__region--header_left {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 70%;
   flex: 0 1 70%;
 }

 .layout--custom-layout .layout__region--header_right {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 30%;
   flex: 0 1 30%;
 }

 .layout--custom-layout .layout__region--content {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 70%;
   flex: 0 1 70%;
 }

 .layout--custom-layout .layout__region--sidebar {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 30%;
   flex: 0 1 30%;
 }

 .layout--custom-layout .layout__region--footer_left {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 50%;
   flex: 0 1 50%;
 }

 .layout--custom-layout .layout__region--footer_right {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 50%;
   flex: 0 1 50%;
 }
}

Next, let us enable our custom module
 

layout-builder-module

Let us go to Structure -> Content types and click on “Manage display” for any content type. For now we will use ‘article’ content type.

edit-layout-builder

After we choose our custom layout-
 

custom-layout
Oct 04 2019
Oct 04

Content authors and content editors always look out for a seamless, easy-to-use experience when it comes to page building. Drag-and-drop and WYSIWYG tools are something they expect when they want to create and design pages. Drupal Layout Builder offers this exact experience with its easy-to-use page building capability, in Drupal core. 

Drupal Layout Builder is unique and provides a powerful visual design tool to let content authors change the way content is presented. Introduced in Drupal core in its latest version, Layout Builder in Drupal 8 allows you to add/remove sections to display the content using different layouts, and customizing your pages based on the requirements. The Layout Builder Module in Drupal 8 also allows you to combine these sections and create a truly customized page. 

Layout Builder in Drupal 8 can be used in two different ways. It can be used to create a layout for each content type on the website, and also to create a layout for an individual piece of content.

Introducing Layout Builder in Drupal 8

The Layout Builder module allows you to customize the design of the entities such as content types, taxonomy, users etc. It provides an easy-to-use drag and drop option for site builders to place blocks, fields etc.

The layout builder module in Drupal 8 makes it easier to build your layouts by offering a preview of the changes made while building your layouts. Instead of having to save every small change made in the layout and then looking it up on the front-end, layout builder in Drupal allows previews of the changes made for a seamless layout building experience. 

Installing and setting up the Layout Builder module in Drupal 

In order to install/setup the layout builder module in Drupal 8, navigate to Extend and enable both Layout Builder and Layout Discovery module.

Installinf and setting up the layout builder


Note: Layout Builder was introduced as a stable module in Drupal 8.7. So, make sure you’re using the latest version. In older versions of Drupal, it was an experimental module.

1. Use Drupal Layout Builder to Customize Content-Type and Taxonomy

1. Once you have installed the module, navigate to Structure, Content types and click on “Manage display” for any content type , For now we will use the “article” content type.

layout builder module

2. Scroll to the bottom and click on Layout options and select “Use Layout Builder”, then click on Save.

Layout builder module in drupal 8

3. Once you’ve enabled Layout Builder on the view mode, you can see a “Manage layout” option instead of field formatters. You can use Layout Builder for any of the view modes present.
 

Manage Display

4. When you click on “Manage layout”, you’ll be redirected to article content type layout.

edit layout builder

2. Add Sections to Layout

1. First, remove the default section. Click on the close icon (as depicted in the below screenshot). Further, you will be provided with an option to the right side of your screen to remove the default section. Click on “Remove”.

add sections to layout builder

2. Let us add a few sections to our layout by clicking on the “Add Section” option. Further, you will be provided with options to choose a layout of your choice for your section, on the right side of the screen. For now, let us select the “Two Column Section”.

edit layout

3. You will have an option to choose the width for your “Two Column Layout”. Let us select a “50%/50%” for now. Then click on “Add section”.

Two column layout

Once added, you should be able to see an “Add Block” link for each section region.

ad-block-layout-builder

3. Add Blocks to Section Regions

After choosing your section for the layout, you can add blocks into your section. To add a block just click on “Add Block” and the “Choose a block” option will slide out from the right.

add blocks to section regions

1.Choosing a Block
 
Blocks can be chosen from the right by just clicking on them. You can even find blocks by filtering them out by their name using the “Filter by block name” text field. 
We will select “Authored on” content field  for now.

choosing a block

When you click on the block you want to add, you’ll be able to adjust the field formatter. Once you’ve configured the formatter, click on “Add Block”.

configured-add-blocks

The “Authored On” content field will be placed on the left side of the block.

Authored-on-layout-buildr

After placing the “Authored On” field , you need to save your changes. Save all the changes you have made to your section by clicking on “Save Layout” option at the top of the layout page

layout builder

Let us try adding some more fields into our layout

layout-builder

So, after saving this layout, if you visit an article content type page, you will be able to see a preview of the layout which you just built..

Layout-module

4.Override Default Layout

The layout which we just built will be applicable for all the articles. If you want to build a customized layout for a particular article, we have to enable some options provided by Drupal for the same. You can do it by selecting “Allow each content item to have its layout customized.”

Override-layout

After enabling this option, if you go to an article, you should see a Layout tab button.

Layout builder

You can now modify the layout using the same interface. However, this will only change the layout on this specific piece of content.

Layout builder
Oct 01 2019
Oct 01

“Do I really need Drupal support and maintenance services for my website?” 
If this is the question that you have, you probably think that your quest for a public-facing and a customer-attracting tool ends with the development and deployment. Is content updating enough to stay current and relevant? How important is it really to have a support and maintenance plan for your Drupal website? Let me give you five of the most important reasons why you may want to think about Drupal support services–

1. Continuous Safeguarding 

No doubt Drupal is one of the most secure CMS’s today but only if your Drupal website is updated with security upgrades and patches regularly. The Drupal community and the Drupal security team work hard towards building security patches, fixes and upgrades that all add up to building a sustainable ecosystem. These security fixes and upgrades need to be performed immediately to avoid trouble. If you’re still on Drupal 7 (or Drupal 6), migrating to Drupal 8 is crucial to keep your website secure. Drupal 7 support for security will be provided by the community till November 2021. To ensure complete security of your website, you need regular Drupal support and maintenance services.

2. Fixes and repairs

No bug is a small bug. Even the smallest bug/error when ignored, could cost you a customer. Bugs and errors can emerge out of nowhere for multiple reasons. It could be because of a hurried up coding and deployment, insufficient testing, miscommunication, lack of expertise, untrusted third-party tools and more. Some of them are critical and might need immediate attention while some could just lie there unnoticed (which can come to light at wrong times!). Nonetheless, neither of them can be overlooked for a customer focused Drupal website. 

3. Up-to-date

From Drupal 8 onwards, upgrades and minor versions are released more frequently to avoid long waiting times for updates and enhanced features. While Drupal 6 has already reached End-of-life (no security fixes/enhancements), Drupal 7 will continue to only receive security support till November 2021. If you still need Drupal 7 support after that, you will need to contact a vendor who provides Long Term support (like the LTS plan for Drupal 6 support). However, if you need to stay updated and leverage Drupal 8’s new and powerful features, it is about time to upgrade to Drupal 8. Staying up-to-date with Drupal’s latest version will allow you to provide your customers with compelling and fresh digital experiences.

4. On top of things

Growing and scaling up your business calls for proactive and future-proof solutions. If you want to gain an edge over your competition, you have to stay on top of things. Things you will need for this? Frequent content updates and enhanced features. Of course, with Drupal, updating content is easy enough and does not need a technical background. Nonetheless, to remain competitive, you have to add new features and enhancements that can improve your user experience and customer journey. User behaviour is never constant, which is why your website needs to stay fresh and align with your user’s needs and business goals. 

5. Focus on your business goals

An intelligent businessman had once said, “Focus on what you do really well. Let others help you with what you are not good at.”  Making sure that your website needs security updates, fixes, enhancements, updates, etc. needs a lot of time and attention. Businesses are most successful when they focus on what they are best at. Unloading your Drupal support and Drupal maintenance job to a technology partner who is does it day-in and day-out is your best bet.                                                                                                                                     
If your Drupal website is critical to your business, here are a few more reasons you may want to go for professional Drupal support and maintenance: Improve and maintain your Search Engine Optimization (SEO) ranking, Third-party API updates, Drupal core module updates, contributed module updates, scaling your website/application, website performing reporting, Drupal interface improvements, and more.

drupal maintenance

Now that we have established a few strong reasons on why you need Drupal support and Drupal maintenance services, here are a few things you need to know before you choose a technology partner to help you with it.

  • Website Audit – Your Drupal support and maintenance service partners should perform a comprehensive audit of your website. This audit should be able to give you a clear picture of where your website stands in terms of performance, security issues, bugs and SEO status. Your Drupal website’s support and maintenance plan should be based on these factors. 
  • Levels of Support – Different types of websites will need different levels of support. Some of them include-
  • Drupal Security Update Support – Security updates, upgrades and applying patches.
  • Drupal Module Upgrades Support – Module upgrading to leverage better features and/or to remain compatible.
  • Migration Support – Ensuring smooth transition and uptime during migrations, migration bug fixes, content migration support, database migration support, etc.
  • Code Reviews – Reviewing code for structure, quality, logic, performance, testing, design, usability, readability, functionality, etc. 
  • Performance testing and tuning Support – Check and support for performance on website’s expected workload, response time, speed, robustness and scalability.
  • Integration Assistance – Support of existing integrations and during new integrations with third-party applications and APIs.
  • Drupal 6 Support – Long Term Support plan (LTS) and Drupal maintenance
  • Drupal 7 Support – LTS after Nov 2021, Drupal 7 module support
  • Turn-around times – Turnaround and response times for your website depends on the type of an issue/support needed. For emergency issues like a serious bug or a security loophole, the turn-around time should not exceed 24-48 hours. While support for new Drupal features or enhancements or customizations can range from 2 weeks to more depending on the complexity of the task.
  • Dedicated VS Shared Support – As the names suggest, with dedicated support you get a Drupal expert/team of Drupal experts who will exclusively support your website(s). You can pay a monthly fee to carry out Drupal support and maintenance tasks continuously and as and when they arise. This ensures that your website is customized and well looked-after both proactively and on-demand. Most support service providers also offer to utilize your unused support hours into the development of a new feature or enhancing exciting features. 
    You could also opt for shared support where you will be sharing resources with other companies as well. Works best when your website is not very complex does not include customizations and does not require continuous monitoring.
  • Update Release Schedule - Drupal 8 is not just a build-up upon Drupal 7. It has been re-architectured to improve adoption among businesses and Drupal developers by adopting more futurist frameworks (Symfony, Twig, PHP 7+, BigPipe caching, etc.). To be able to stay secure and compatible with the other building blocks, Drupal 8 has adopted a continuous innovation model and releases frequent minor version updates (every 6 months). Your Drupal support and maintenance service partners should ensure regular scheduled updates of Drupal’s version releases, bug fixes, and security releases.
Sep 25 2019
Sep 25

Securing your website is not a one-time goal but an on-going process that needs a lot of your attention. Preventing a disaster is always a better option. With a Drupal 8 website, you can be assured about having some of the top security risks being taken care of by the Drupal security team. 
Drupal has powered millions of websites, many of which handle extremely critical data. Unsurprisingly, Drupal has been the CMS of choice for websites that handle critical information like government websites, banking and financial institutions, e-Commerce stores, etc. Drupal security features address all top 10 security risks of OWASP (Open Web Application Security Project)
Drupal 8 is considered one of the most secure version till date because of its forward-thinking and continuous innovation approach. The Drupal security team had also issued a security bounty program six months before the release of Drupal 8. Through this program, users were invited to test run and find (and report) bugs in Drupal 8. And they even got paid for it! 

Drupal Security Vulnerabilities

It goes without saying that the Drupal community take drupal security issues very seriously and keep releasing Drupal security updates/patches. The Drupal security team is always proactive and ready with patches even before a vulnerability goes public. For example, the Drupal security team released the security vulnerability update - SA-CORE-2018-002 days before it was actually exploited (Drupalgeddon2). Patches and security upgrades were soon released, advising Drupal site admins to update their website.
Quoting Dries from one of his blogs on the security vulnerability – “The Drupal Security Team follows a "coordinated disclosure policy": issues remain private until there is a published fix. A public announcement is made when the threat has been addressed and a secure version of Drupal core is also available. Even when a bug fix is made available, the Drupal Security Team is very thoughtful with its communication. “
Some interesting insights on Drupal’s vulnerability statistics by CVE Details :

drupal securitydrupal security vulnerabilities

1. Keep Calm and Stay Updated – Drupal Security Updates    

The Drupal security team are always on their toes looking out for vulnerabilities. As soon as they find one, a patch/Drupal security update is immediately released. Also, after Drupal 8 and the adoption of continuous innovation, minor releases are more frequent. This has led to easy and quick Drupal updates of a better, more secure version. 
Making sure your Drupal version and modules are up-to-date is really the least you can do to ensure safety of your website. Drupal contributors are staying on top of things and are always looking for any security threats that could spell disaster. A Drupal security update doesn’t just come with new features but also security patches and bug fixes. Drupal security updates and announcements are posted to users’ emails and site admins have to keep their Drupal version updated to safeguard the website.

2. Administer your inputs 

Most interactive websites gather inputs from a user. As website admins, unless you manage and handle these inputs appropriately, you are at a high-security risk. Hackers can inject SQL codes that can cause great harm to your website’s data.
Stopping your users from entering SQL specific words like “SELECT” or “DROP” or “DELETE” could harm the user experience of your website. Instead, with Drupal security, you can use escaping or filtering functions available in the database API to strip and filter out such harmful SQL injections. Sanitizing your code is the most crucial step towards a secure Drupal website.

3. Drupal 8 Security

How is Drupal 8 helping in building a more robust and secure website? Here are a few Drupal 8 security features - 

  • Symfony – With Drupal 8 adopting the Symfony framework, it opened doors to many more developers other than limiting them to just core Drupal developers. Not only is Symfony a more secure framework, it also brought in more developers with different insights to fix bugs and create security patches.
  • Twig Templates – As we just discussed about sanitizing your code to handle inputs better, here’s to tell you that with Drupal 8, it has already been taken care of. How? Thanks to Drupal 8’s adoption of Twig as its templating engine. With Twig, you will not need any additional filtering and escaping of inputs as it is automatically sanitized. Additionally, because Twig’s enforcement of separate layers between logic and presentation, makes it impossible to run SQL queries or misusing the theme layer.
  • More Secure WYSIWYG - The WYSIWYG editor in Drupal is a great editing tool for users but it can also be misused to carry out attacks like XSS attacks. With Drupal 8 following Drupal security best practices, it now allows for using only filtered HTML formats. Also, to prevent users from misusing images and to prevent CSRF (cross-site request forgery), Drupal 8’s core text filtering allows users to use only local images.
  • The Configuration Management Initiative (CMI) – This Drupal 8 initiative works out great for site administrators and owners as it allows them to track configuration in code. Any site configuration changes will be tracked and audited, allowing strict control over website configuration.

4. Choose your Drupal modules wisely

Before you install a module, make sure you look at how active it is. Are the module developers active enough? Do they release updates often? Has it been downloaded before or are you the first scape- goat? You will find all the mentioned details at the bottom of the modules’ download page. Also ensure your modules are updated and uninstall the ones that you no longer use.

5. Drupal Security Modules to the rescue

Just like layered clothing works better than one thick pullover to keep warm during winter, your website is best protected in a layered approach. Drupal security modules can give your website an extra layer of security around it. Some of the top Drupal 8 security modules that you must use for your website –

 Drupal Login Security –

This module enables the site administrator to add various restrictions on user login. The Drupal login security module can restrict the number of invalid login attempts before blocking accounts. Access can be denied for IP addresses either temporarily or permanently. 

Two-factor Authentication –

With this Drupal security module, you can add an extra layer of authentication once your user logs in with a user-id and password. Like entering a code that’s been sent to their mobile phone.

Password Policy –

This is a great Drupal security module that lets you add another layer of security to your login forms, this preventing bots and other security breaches. It enforces certain restrictions on user passwords – like constraints on the length, character type, case (uppercase/lowercase), punctuation, etc. It also forces users to change their passwords regularly (password expiration feature).
 

Username Enumeration Prevention –

By default, Drupal lets you know if the username entered does not exist or exists (if other credentials are wrong). This can be great if a hacker is trying to enter random usernames only to find out one that’s actually valid. This Drupal security module can prevent such an attack by changing the standard error message.

Content Access -

As the name suggests, this module lets you give more detailed access control to your content. Each content type can be specified with a custom view, edit or delete permissions. You can manage permissions for content types by role and author.

Coder -

Loopholes in your code can also make way for an attacker. The Coder module (a command line tool with IDE support) goes through your Drupal code and lets you know where you haven’t followed best coding practices.

Security Kit -

This Drupal security module offers many risk-handling features. Vulnerabilities like cross-site scripting (or sniffing), CSRF, Clickjacking, eavesdropping attacks and more can be easily handled and mitigated with this Drupal 88 security module.

Captcha -

As much as we hate to prove our human’ness, CAPTCHA is probably one of the best Drupal security modules out there to filter unwanted spambots. This Drupal module prevents automated script submissions from spambots and can be used in any web form of a Drupal website

6. Check on your Permissions

Drupal allows you to have multiple roles and users like administrators, authenticated users, anonymous users, editors, etc. In order to fine-tune your website security, each of these roles should be permitted to perform only a certain type of work. For example, an anonymous user should be given least permissions like viewing content only. Once you install Drupal and/or add more modules, do not forget to manually assign and grant access permissions to each role.

7. Get HTTPS

I bet you already knew that any traffic that’s transmitted over just an HTTP can be snooped and recorded by almost anyone. Information like your login id, password and other session information can be grabbed and exploited by an attacker. If you have an e-Commerce website, this gets even more critical as it deals with payment and personal details. Installing an SSL certificate on your server will secure the connection in between the user and the server by encrypting data that’s transferred. An HTTPS website can also increase your SEO ranking – which makes it totally worth the investment.

Sep 17 2019
Sep 17

“Should I upgrade or should I just wait?” This question has been constantly bothering business decision-makers when it comes to migrating their website from Drupal 7 to Drupal 8. Change can be hard and terrifying, especially at its inception. Yet, a change is what allows you to grow, evolve and progress. It can get painful to take a decision as big as a migration of your Drupal 7 (or 6) website – the one that you knew and have loved. But soon you will know you have made the most brilliant business decision, ever! 

Drupal 8 Migration - A Long-term vision

There has always been a perception that Drupal is a difficult CMS to get a hang of. Starting from end-users to developers, Drupal was considered as having a huge learning curve.  Yes, with the previous major versions (before Drupal 8), the process of upgrading and adjusting to the change was harder. It was also more expensive (needed more resource time), the release of contributed modules (and necessary features) were slower and the release cycles got longer.

But with Drupal 8, everything changed. 

Tom Wentworth, (SVP Product Marketing from Acquia), summed up accurately in his article that unlike a few other CMS’s, “Drupal 8 was a teardown all the way to the foundation”. Creating an upgrade based on the same old foundation would have been a much easier task for the Drupal community. But starting from Drupal 8, the Drupal community has focused on long-term sustainability and on getting people to adopt Drupal effortlessly. This called for a complete re-architecture of Drupal 8 with the adoption of Symphony for high performance, Twig for a more modern templating engine, object oriented programming for easier maintenance, modern user experience design creators and editors for rich content editing, and much more. 

Drupal 8’s continuous innovation approach propels an evolution with regular (and shorter) minor releases, semantic versioning (in a ‘major.minor.patch’ format) that helps in backwards-compatibility enhancements and faster stability in modules by releasing experimental modules in core.

Your Drupal 8 Questions, Answered. (To some extent)

Although it has been a while since Drupal 8 has been around and stable, we still get asked a ton of questions by our customers before a migration. 

1. Why should I upgrade to Drupal 8 (from Drupal 7) when Drupal 9 is just around the corner? (We get this nearly every time)

I have a whole blog dedicated to this question, but if you insist, here are your benefits of upgrading to Drupal 8 now -

  • Time crunch – So Drupal 9 does not release until June 2020 and Drupal 7 reaches its end-of-life by December 2021. Which means you have only a year and a half to upgrade to Drupal 9. If your website is considerably simple and needs less customizations, this is a viable option. Else, you’d better off start an upgrade to Drupal 8 now and migrating from Drupal 9 from Drupal 8 is as easy as upgrading to a next minor release.
  • Living with a FOMO – That’s a term I recently learnt about – Fear Of Missing Out. Why do you want to miss out on some powerful and modern enhancements when you can migrate to Drupal 8 now and boost your Drupal website’s performance and experience? Upgrading from Drupal 8 to Drupal 9 is a cakewalk anyway!
  • Just a better version – Drupal 9 is just Drupal 8 minus the deprecated code and modules. Migrate to Drupal 8 now, enjoy a better performing website and an easy upgrade to Drupal 9 (and any future versions of Drupal)

2. We’re still stuck on Drupal 6. Help!

If you’re still stuck on to Drupal 6, you must know that everyone else has moved on. Today, the web has changed and so has Drupal. The Drupal community no longer supports Drupal 6 since February 2016. Which means, there will be no new Drupal modules or features to look forward to, no more bug-fixes, security updates and patches. Thus putting your website’s security at high-risk and of course depriving it of some TLC from the community. If you still want the best for your website, migrate to Drupal 8 now! Yes, you can completely skip Drupal 7. Drupal Migrate module is now included in Drupal 8 core and makes the switch easy and fast.

3. What performance upgrades does Drupal 8 offer?

Drupal 8 comes packed with performance-enhancing features and modules that can turn your website into a speedy and high performing one. Here are a few to name -

  • The Symfony Framework – Drupal 8’s adoption of Symfony framework isn’t just a great move for developers but for website owners as well. Symfony offers a robust, flexible and high-performance framework that allows for easy scalability of a website.
  • BigPipe Caching - It lets you segregate your page into different sections (called Pagelets) which can be rendered as they get available (Cached first). This lets you drastically improve your page’s perceived performance and speed.

migration-d8

  • Caching for Authenticated Users – Drupal 8 uses Varnish to cache page content and serve them to authenticated users for better and faster performance.
  • PHP7 support – Did you know PHP 7 is now two times faster than PHP 5.6 because of its new Zend engine? With PHP 7 support in Drupal 8, your websites can see a performance rise up to about 110% and reduced memory usage.

4. What challenges will we encounter during a Drupal 8 migration? What can be done to alleviate those issues?

Challenges encountered during a website migration from say Drupal 7 to Drupal 8, completely depends upon the complexity of a website, if it includes a redesign, the amount of content needed to be migrated and many more other factors. The first and the most crucial step towards a Drupal 8 migration is to audit your existing website. Auditing and analysing your website could be the biggest challenge if not handled well and could lead to a successful (and quick) migration when done right. If not planned well, you might run into problems where you are unprepared to handle -

  • Module compatibility issues
  • Might migrate old and unused modules that will increase migration time
  • Unavailability of existing modules/features/themes/views/entities (in core or contrib) 
  • The need to rebuild and rewrite custom modules in Drupal 8. (Coz as discussed earlier, D8 has restructured itself to be able to be more future-ready)
  • A rebuild/repackage of features and views
  • A redevelopment of the theme – because of Drupal 8’s new and powerful templating engine Twig

How do we fix this? – Easy. Audit your website well. Get a Drupal technology partner to do a complete analysis and audit of your existing website and list out features, modules and other elements that need to be migrated. They will need to provide you with details on what needs a rebuild and what can just be easily ported. You can also use evaluation modules like the Upgrade checker which will give you a comprehensive list of migration components and an estimate of how long it might take.

5. Can we migrate to Drupal 8 and yet preserve our existing data whilst remaining GDPR compliant?

Absolutely! The reason why Drupal is so successful is because of its proactive and battle-ready Drupal community. The Drupal GDPR Compliance team project aims at providing websites with modules and features that can assist in making them GGDPR compliant. There are over 15 new modules in Drupal 8 for GDPR compliance to choose from with some modules that can be ported to Drupal 8 and some that may need a rewrite. Check here for a list of Drupal modules that help you build GDPR compliant websites.

6. What happens to my content? 

Drupal understands how important content is to every organisation. With efforts from more than 500 contributors, the release of Drupal 8.5.0 brought together a stable and robust Drupal Migrate architecture. Modules like Migrate API, Drupal Migrate module and Migrate Drupal UI allows for a flexible and easy content migration from the database or sources like JSON, CSV or XML.

7. If we migrate to Drupal 8, will it break any of our existing features/modules?

The answer to this question depends on your website structure, complexity and the way Drupal 7 (or Drupal 6) was implemented on your website. Many times, there is no direct path for a Drupal 8 upgrade. Custom modules will need a rebuild and will break if simply ported because Drupal 8 is now built on Symfony framework (and OOPS principles). Themes will need to be redeveloped as with the new template engine Twig, migrating your existing Drupal theme will not work.

8. Will our integrations with third-party software break when we migrate to Drupal 8?

Integrations with third-party software have just gotten better with Drupal 8. With web services in core in Drupal 8, creating RESTful APIs are easy and fast. This is invaluable in connecting with many third-party applications. Additionally, Drupal 8 has added many more integration modules to its list.

9. Will our core Drupal 7 modules still work?

Yes. Drupal 7 Core modules have made their way to Drupal 8 and some of them are even better in Drupal 8! While most of them are automatically upgraded, a few modules will need manual work if they don’t have an automatic upgrade path. Some Drupal 7 (or 6) modules are not mapped to the same Drupal 8 module. For example, the Block module in Drupal 7 is now divided into a Block and Custom Block module in Drupal 8. Nonetheless, many contributed modules in Drupal 7 are now in Drupal 8 core (like the Views module). 

10. What happens to our custom and contributed modules?

After Drupal 8’s adoption of the Symfony framework and Object Oriented Programming principles, Drupal has opened its doors to wider set of developers and programmers. This also helps in building code that is more robust and reusable. But this time-saving, future-ready concept brings along some bad news too. The bad news is that most of the existing custom modules and some contributed modules will need to be rebuilt from scratch to be able to support Drupal 8’s futuristic mission. But the great part about this is from Drupal 8 onwards, any major/minor upgrade will be easy as pie.

11. Will our Drupal theme break on migrating to Drupal 8?

Unfortunately, yes it will. Since Drupal 4.7 up until Drupal 7, PHPTemplate has been the default Drupal Theme engine. But with the adoption of the Twig (part of Symfony2) for a more powerful, secure and modern templating engine, themes will need to be redeveloped. However, parts of code can be replaced as is.

12. How can Drupal 8’s API-first approach benefit us?

By the year 2020, there are going to be more than 50 billion internet connected devices. Content is now consumed via a plethora of mediums – computers, mobiles, IoTs, wearables, conversational interfaces, smart TVs… and the list keeps growing. Which means, your brand needs to interact with a lot more devices and in many more formats than just a website. Content delivery has gotten a lot more challenging.

Just so we are on the same page, an API (Application Programing Interface) is a set of rules or routines (functions or programs) that specifies how applications can interact with each other. For example, if you want to display the current weather on your website, you can invoke an API with websites that offer this service.
To be able to handle the content delivery challenge efficiently, content needs to be treated like well-structured data. Drupal’s API-first approach, lets you create an API before you build your website or mobile app. This futuristic approach allows you to turn content into services which can then interact with diverse devices irrespective of the formats. While Drupal 7, also supports the API-first approach with the help of additional modules, Drupal 8 comes built-in with the content-as-a-service model.
This is what our in-house expert Drupal Practice Head, Malabya Tewari has to say about Drupal 8’s API first approach – “Drupal 8 has taken this approach to another level and here’s why- REST module is now in core, where you can create own custom web-services using Views (which is also added in core in D8). It is easier to create custom REST APIs using the core REST module. Adding basic authentication is in core as well. You can get APIs, including JSON API and GraphQL, for all entities - out of the box! 

13.What are the benefits of upgrading to Drupal 8?

One of the most stunning features of Drupal 8 is that you have (almost) everything you need, out-of-the-box. 

  • Responsive websites are not a luxury anymore, they are a necessity. All of Drupal 8’s themes are responsive off-the-rack – which not only works great with all devices also makes configuration and set up of your Drupal website a lot easier.
  • A built-in, well configured WYSIWYG editor CKEditor lets you preview and edit your content in a breeze. You also have an in-place editor that lets you edit blocks, content, menus, etc. right in the same page.
  • SEO gets you noticed and out-there. With some of Drupal’s built-in powerful SEO modules, you can take your website places! Modules like SEO Checklist, PathAuto, Redirect, MetaTag, etc. are killing it!
  • The newest and most powerful version of HTML, which is HTML5 is now built-into Drupal 8. It lets you embed complex input elements like audio, video, date, email, etc with ease and better functionality across all devices.
  • Take your business global with Drupal 8’s out-of-the-box multilingual support. You can not only create pages enabled with language-based views, even the admin interface allows you to select our preferred language. The built-in content translate modules enables you to translate any content entity into different languages.
Sep 11 2019
Sep 11

Adding media content to a website instantly turns it into an engaging and attractive one. Media like images, videos, audio, slideshows, etc. work wonders in creating better and compelling digital experiences. The Media module for Drupal 8 lets you manage your media elements easily and systematically. The release of Drupal 8.4 saw the inclusion of many media features like the Media module and Media Library in core.

What is Media module?

The Drupal 8 Media module is often called as a ‘File browser to the internet’. 
Media module for Drupal 8 lets you manage media files and assets regardless of where they are hosted. With this module you can add/embed different kinds of media to your website content, save them in the Media Library, embed videos with a URL and more.

Drupal 8 Media Entities

The concept of Media entities are similar to that of Nodes. Media types are to media entities as Content types are to nodes. However, with Media entities, every media type is different. For example, an Image media type will come with a different set of features that can be modified (like dimensions) when compared to a video embed with a URL media type. When you enable the Media module, these Media types are created automatically -

  • File
  • Image
  • Audio File
  • Video File
  • Remote Video

You can also add fields to media types and create your own media types based on your selected media source.

Installation of Media module:

The Media module ships with Drupal 8 core but you will need to enable it first to be able to use it. Here are the steps to enabling and using the Drupal 8 Media module-

Step1: 

First we have to go to Extend tab and enable the Media and media library module as shown in the below image.

Step2:

Once we enable the module now we can see that the Media types are part of the site’s structure, which has 5 types - Audio, Image , Remote video, File and video. Here we can create our own type as well.

Step3: 

Now we can use this as an entity reference for any field.
For example, here we will create a field for Images as Media type as shown in the below.

Next, we have to select a Reference type of media as shown in the below image.

Step 4: 

The field has been created successfully. It is time to add some media of the available types. You can add it in two ways:

  1. From the admin dashboard “Content ->  Add content ->  Article” for Image field

  1. Directly from the “Media” tab in “Content” where you will see the entire Media Library with all media that you have added.

The new Media Library interface can display your media in the Gridview and in the Table view

It is easy to filter and sort the media by various criteria, as well as select particular items to do actions with them (delete, publish, save, unpublish).

Sep 03 2019
Sep 03

Debugging is not something us developers look forward to. Developer detest bugs but to be able to build a fine quality software, debugging is an indispensable part of a developer’s life. Every PHP developer has a different style and go-to methods for debugging their code. This depends on their experience, their problem-solving approach and most importantly - the amount of time they have in hand! 

How important is debugging and why do you need to debug your code? 

Debugging is an integral part of a software development life cycle that assures quality results. 
Picture this - The codebase is big, You are new to the project, You do not have much details of the project/functionality. But you are supposed to fix a bug. Where do we start from? We start by analyzing the code step by step to understand what is done and where things are going wrong. That, my friends, is Debugging. Debugging is an art that can get better with practice and experience.

How to debug your PHP code

Okay so here is a case that I have come across in my development career. There is a commerce site built on Wordpress in which the checkout process was taking around 5-8 minutes and I was asked to solve it. In this case, I don’t have much knowledge on how things work with Wordpress. So I started with checking off the options from the list one by one such as, (a) Is it because of some plugin? (b) Is it Theme related? (c) Is it any custom code base? etc. 

The tool that helped me in php debugging and solving this case is Blackfire. This gives you a more user-readable option of the stack trace of all the functions, the time taken for each function in the whole process. By using this, I found the function that is eating up the checkout process. All you need is some setup to add the key to your code base and you are all set to analyse any functionality using the documentation.  
So, you can solve the bugs if you have knowledge on multiple methods of php debugging.

Code Debugging Techniques

Let me talk about a few techniques that I have used for debugging PHP.
A simple and most common way to check if the function or the method you have written is being called up, write an exit. There wouldn’t be any developer who hasn’t used this!
To check the value of some variable, print_r(), var_dump(), var_export(). Okay, let’s see the difference.

Example:

Assume an array 
$a = array( 1, array( "a", "b") );

print_r($a);
Array
(
    [0] => 1
    [1] => Array
        (
            [0] => 'a'
            [1] => 'b'
        )
)
 
Array
(
    [0] => 1
    [1] => Array
        (
            [0] => 'a'
            [1] => 'b'
        )
)

This gives a human-readable format and information about the variable. Also, we can store it to a variable with print_r($var, true).

var_dump( $a );
array(3) {
  [0]=>
  int(1)
  [1]=>
  array(2) {
    [0]=>
    string(1) "a"
    [1]=>
    string(1) "b"
  }
}

This prints along with type, length of each value. And this is faster comparatively to print_r()
 var_export( $a );

array (
  0 => 1,
  1 => 
  array (
    0 => 'a',
    1 => 'b',
  ),
)
 

This prints along with type, length of each value. And this is faster comparatively to print_r()
 

var_export( $a );

This returns valid php, if variable exists, else returns false. Which means, the output of var_export can be used directly in a php file.

Have you ever made use of debug($var, NULL, TRUE) provided by Drupal core? This uses print_r() or var_export based on the arguments passed to the php debug function.

What about the warnings like below, which you don’t have a clue on which line of code is causing such a warning.

warning: Invalid argument supplied for foreach() in /modules/node/node.module on line 485.

We know that there are so many places that the node module will be called. So, how do you resolve this? One faster way without using any other external resources is using PHP function debug_backtrace(). Go to “drupal_set_message”, because you know, this is the method that is printing the warning. Put the below line, in that function

debug_backtrace();

Output:

Array
(
    [0] => Array
        (
            [file] => /includes/common.inc
            [line] => 552
            [function] => drupal_set_message
            [args] => Array
                (
                    [0] => warning: Invalid argument
supplied for foreach() in /modules/node/node.module on line 504.
                    [1] => error
                )

        )

    [1] => Array
        (
            [file] => /modules/node/node.module
            [line] => 504
            [function] => error_handler
            [args] => Array
                (
                    [0] => 2
                    [1] => Invalid argument supplied for foreach()
                    [2] => /modules/node/node.module
                    [3] => 504
                    [4] => Array
                        (
                            [param] => 
                            [revision] => 
                            [reset] => 
                            ...
                        )

                )

        )

    [2] => Array
        (
            [file] => /sites/all/modules/custom/custom_module/
custom_module.module
            [line] => 10
            [function] => node_load
            [args] => Array
                (
                    [0] => 
                )

        )

    [3] => Array
        (
            [file] => /includes/form.inc
            [line] => 365
            [function] => custom_module_form_alter
            [args] => Array
                (
                ...
 

This function shows the stack of all the functions that are called in the process of causing the warning. Make sure you restrict the limit, otherwise PHP shows a “memory exhausted” message if the stack takes too long to be displayed.

Debugging through CLI:

Heard of phpdbg! Yes, there is a php extension that is available from PHP 5.6+ which is used to debug a php file from command line.
Open you terminal, enter “phpdbg”. This starts  an interactive php debugger shell. You can also use breakpoints! Just try it out - the hidden way of debugging PHP. 
The only problem is: you will have to get used to the commands of phpdbg to make better use of it.

Debugging through Drupal:

Devel Kint:

Drupal developers use this pretty often. Kint is a submodule of the Devel module that can be used to debug Drupal 8 twig templates together with dump(); 

DB Log: 

Who is not aware of this Drupal module?! In D7 it is watchdog() and D8 it is logger service.

\Drupal::logger('my_module')->debug($message);

But the only reason why we don’t encourage the use of this module even though we are in love with this is that the log message is written into the database every time!

And imagine if it is a huge database, this would be even worse and will affect the performance. That’s the reason, it is not recommended to use DBLOG module on Production sites.


Do you still want to use DBLog, module and reduce the performance impacts? There is a solution for that as well - DBlog Filter. This is a contributed module which helps in restricting the type of logs to be written into the database. For example, if you want to store only logs of severity “error”, you can configure them with this module. So you don’t have to completely get rid of Dblog module. Oh yes, and this module is contributed by me ;) 

Web profiler

Web profiler is a contributed module provided by Devel again. Once you have the module enabled, you will see a report at the bottom of the window. Whenever a page is loaded, this report gives us the page load time, number of queries running in the page, number of forms, number of js/css files, etc. in that page.

web profiler

Yes, This even offers details of each section by clicking on them. For example, the following image shows the queries in the home page.

Xdebug

XDebug - Debugging through IDE:

The best and more user-friendly way of debugging most of the people prefer if they are using an IDE for coding is using XDebug. XDebug is a PHP extension that helps in the development and debugging and provides a single step debugger that you can use with an IDE like PHPStorm. Of course to get the best results, you have to put more effort to install and configure the extension with the IDE you are using.

Aug 27 2019
Aug 27

Want an easy way to extend your market reach and ultimately your sales? Do you feel you need to personalize your website to every user no matter which country they belong to or what language they speak? Getting yourself a multilingual website is your best bet. Not only is it a more cost-effective marketing strategy, it also helps in increasing your website traffic and overall SEO. Drupal CMS has particularly taken up this challenge of providing not only users but also developers with the ability to access Drupal in a language that they prefer. And with Drupal 8 being multilingual out-of-the-box, it has become an ideal choice for businesses and developers. Powerful Drupal translation modules offer developers with granular configuration capabilities where every content entity can be translated.

What are Multilingual Websites?

Multilingual basically means written or available in different languages. Multilingual websites connect better with users from different countries as it immediately adds an element of familiarity. Drupal 8 provides an easy and a great experience of building a multilingual website. Currently Drupal 8 supports 100 different languages for translation.

Drupal 8 has a multilingual feature which comes along with the installation interface. As soon as you install Drupal, based on the browser preference, it provides a language for your Drupal website. Based on the option selected the site is installed in that particular language. Drupal 8 basically provides 4 different modules for language and content translation. We can enable the required Drupal modules in our site and use according to our needs in the website. 

Drupal-8-migration

The four core modules provided by drupal are

  1. Language module
  2. Content translation module
  3. Interface translation module
  4. Configuration translation module

Let’s catch up with what each module does, its configurations and how each module can be used in our Drupal website.

Firstly, you need to enable all the 4 core modules in your drupal site. All the translation modules can be configured at path /admin/config/regional

Drupal Language Module

This Drupal 8 language module is one of the core modules located at core/modules/language. It provides a feature of adding and choosing a new language to your Drupal website. Under /admin/config/regional/language/ you can simply add a new language to your site by clicking on the “Add Language” button. It provides a list of different languages from which you can choose the language you need for the development.

drupal-8-migrationdrupal language module

Choose the preferred language from the list and add it

Once the language is added the interface will look similar to this. In the above picture, the default language of the interface is set as English and spanish is the additional language installed. The 9172/9340(98.2%) under Interface translation indicates that 9172 words out of 9340 words available for translation are translated i.e 98.2% of the words in the interface are translated.

It also provides a block( Language switcher) to switch the language from one to another which can be placed at  any region of your Drupal website. Under /admin/structure/block we can place the language switcher block with which we can switch the default language of our website.

Drupal Language Switcher                                                                                Language Switcher

Once the block is placed in the region we will be able to switch to the different languages in the web page itself.

Content Translation Module

The Drupal Content Translation module allows you to translate content entities such as comments, custom block, contents, taxonomy terms, users etc. In order to translate the content entities, the website should have at least two languages installed. The content translation can be configured at path admin/config/regional/content-language . It provides a list of entity types which can be translated. 

For example, click on the content configuration option that appears for each content type.

Let us consider that the content translation is being enabled for the article content type. It provides an option to decide if each subtype entity to be translatable or not. We can also change the default language for a particular content type. Each field has an option to translate its content or not. 

Content Translation Module - Choosing the content                                            Content Translation Module - Choosing the content

It also provides an option to input the content in the language which is suitable for the user while adding content from the backend interface. Once the above configuration is set up and when we try to add content to the Article content type we can see a Select option with the languages installed in our site. We can select any language and add content in the particular language selected.

Content Translation Module - Select the language                                       Content Translation Module - Select the language


Once the contents are saved, users with translate permissions will see links to Translate its content. It provides an additional tab called “Translate” along with the  "Edit" links, and you'll be able to add translations for each configured language.

Content Translation Module - Select the language                                                           
                                                         Content Translation Module - Select the language

Interface translation Module

 The Drupal Interface translation module is also a part of core module and can be easily enabled like any other drupal module. Once this module is enabled it is possible to replace any string in the interface with string which has been customized. Whenever this module encounters any string it tries to translate the particular string to the current language of the interface. If a particular translation is not available it is remembered and we can lookup into the untranslated string in the table.   

Interface translation Module                                                                Interface translation Module


In the above example, the strings which are both translated and untranslated are displayed and we are able to modify the strings for the language that is installed as well.
The translations for the strings are put up in a single place called http://localize.drupal.org and the Localization Update module will automatically import the updated translation strings for your selected language. In Drupal 7 and previous versions, this was a contributed module. In Drupal 8 it is a part of a core module.

Configuration translation Module

The Drupal 8 Configuration Translation module allows configuration to be translated into different languages. The site name, views name, and other configurations can be translated easily using the configuration translation.

Configuration translation Module                                                                    Configuration translation Module

It also provides an option to input the content in the language which is suitable for the user while adding content from the backend interface. Once the above configuration is set up and when we try to add content to the Article content type we can see a Select option with the languages installed in our site. We can select any language and add content in the particular language selected.

Aug 21 2019
Aug 21

Do you like people who are warm and friendly or cold and hostile? You’ve got it right! I’m comparing Interactive to Non-interactive (static) websites here. In this increasingly digital generation, it isn’t sufficient to place some content on your website and wait for it to work its magic. Providing a web User experience without interactivity is like opening a store filled with inventory without a salesperson to interact with. 
When you create an interactive website, you are forming a connection with your audience. It propels a two-way communication on a medium where you cannot directly interact with a user. Studies have proven that people are more likely to convert on, return to or recommend websites that are interactive. Drupal CMS offers a wide variety of interactive themes and modules that can be easily adapted to your website and further customized.

What is an interactive website?

Put simply, an interactive website is a website that communicates and allows for interaction with users. And by interaction, we don’t just mean allowing users to “click” and “scroll”. Offering users with content that is amusing, collaborative and engaging is the essential objective of an interactive website. An interactive website design will not just display attractive content, it will exhibit interactive content. Content that will compel users to communicate and deeply engage with the website. 
 

Interactive website design 
Interactive Website Designs Communicate & Engage with users 

Why do you need one?

Today, all businesses in the digital market are racing to expand their audience. Most of them, however, forget that increasing traffic is simply not enough. Retaining and engaging users is what converts. Engaging your users should be your prime motive and for this you will first need an interactive business website. 

  • Drives more engagement. Interactive business websites can make your website less boring, thus garnering more action. 
  • Users will spend more time on a website that interacts with them. This increases your conversion rate, decreases bounce rate and can boost the SEO of your website.
  • Develops a more personalized user experience that can result in happy users. 
  • Engaged users are more likely to maintain a long-term relationship with websites.
  • Interactive website designs can create lasting effects in user’s minds. This improves your brand awareness and reach. 
  • Interactive websites encourages users to recommend your website and link back to it.
  • More conversions means you have a better chance in making a sale!

How to make interactive websites? 

Creating an interactive website from scratch is easier and more effective as you envision and plan the customer journey from day one. Nevertheless, if you already have a website that you think is static or needs more interactive website features, it is never too late. The first step is to define your business objectives and then identify various touch points from where you can interact with your customers.
If budgets and timelines are constraints you could also look at HTML5 interactive website templates (not recommended if you need customizations).
There are various interactive website features that can increase user engagement but you should pick the ones that suit your business goals. For example, if you are sell financial services, having an interest calculator in your website can prove to be very useful. Nonetheless, the most essential interactive feature that you just cannot ignore is responsiveness. Users will respond to your website on various devices only when it looks and feels presentable.
So what kind of interactive website features or elements can you utilize for your benefit?

  • Social Media Applications

There is no denying that Social media marketing can give you the visibility like no other marketing programs if done right. Provide your users with an option to like and share your content on social media platforms like LinkedIn Twitter or Facebook. Or just to be able to follow your page. You can also display live feed from your social media page to keep users updated. 

  • Simple Interactive Tools

Offer your users with simple interactive tools like Quizzes, short Games, math tools, tax calculators, etc. connected to your business objectives. Integrating simple software tools that can provide your users with instant results have proven to boost user engagement. 

  • Interactive Page Elements

You can enhance your page elements by adding something interesting and attractive to it. For example, colourful and dynamic hover-states on links or images, on-scroll or on-click loading/animation, navigation with clicks on image stories, and much more. Add videos or animations to say more about your business in an interactive way.

  • Forms and Feedback

Allowing users to get in touch with you via a contact form is a great way to connect with them. Not only does it let you increase your database of leads, it is a nice way of saying “We care”. Feedback forms lets you identify your strengths and weaknesses via the best source – your audience! 

  • Chat Widgets

What’s better than a live person chatting with you, answering all your questions about the products or services being offered?! That’s probably the highest level of interactivity you can offer in an interactive business website. If live chat sounds like too much commitment, you could also opt for Chat bots that can be configured to answer predictive questions.

  • User-generated Content

Letting users add their content on your website is a great way to improve interactivity. This can be done in the form of Comments (in your blogs/articles section), inviting them to write guest posts, submit images or even creating a small discussion Forum.

  • Other interactive website Features

You can get creative with the interactive features you want for your audience but here’s a short list of commonly used interactive elements –

  • Google Maps makes you a more trust-worthy brand and provide a great way to improve interaction especially when they are clickable.
  • Newsletters can keep your users coming back to your website for more updates.
  • Voting and showing them results of previous polls helps increase engagement.
  • Search functionalities eases the user from the pain of navigating through your website.
  • Ratings can be a quick and interactive method of getting instant feedback that can improve your products/services/work.
  • Slideshows offer a great way to engage users and can make them want to keep going to the next image.
interactive elements     
           Interactive Website Features and Elements 
                                         

Drupal for Interactive Websites

When you build your website with Drupal, you will come across multiple options in the form of modules and features that can instantly turn your static website into an interactive one. With Drupal 8, responsiveness comes out of the box. Which means that you don’t need any additional modules to make your Drupal website look great irrespective of the devices. In addition there are a variety of modules that encourage interactivity like the Search API, Contact forms module, Social Media module, Slideshow module,  SimpleNews (or newsletters) and much more! 

Aug 20 2019
Aug 20

It is no mystery why Drupal has been the chosen one for over a million diverse organizations all across the globe. Unsurprisingly, the reason behind the success of this open-source software is the devoted Drupal community. A diverse group of individuals who relentlessly work towards making Drupal stronger and more powerful every single day! To them, Drupal isn’t just a web CMS platform - Drupal is a Religion. A religion that unites everyone who believe that giving back is the only way to move forward. Where contributing to the Drupal project gives them meaning and purpose.

Recently, I had the privilege of interacting with a few of the most decorated and remarkable members of the Drupal community - who also happen to be Drupal’s top contributors. I questioned them about the reason(s) behind them contributing to Drupal and what do they do to make a difference. Their responses were incredible, honest and unfeigned.

Adrian_Cid_Almaguer

Adrian Cid Almaguer

Senior Drupal Developer. Acquia Certified Grand Master - Drupal 8

quotes I use Drupal every day and my career in the last years are focused to it, so I want to work with something that I feel comfortable and that meets my needs. If I find errors or something that can be done in a better way in projects I´m using or in the Drupal Core, I open an issue in the project queue and if I have the knowledge and the time, I create a patch for it. This is a way I can says THANKS to the Drupal community.

The strength of Drupal is the community and the contributes modules you can use to create your project, one person can’t create and maintain all the modules you will need, but if several of us give ourselves the task of doing it, all will be more easy, and is not just code, we need documentation, we need examples, translations and many other things in the community, the only way to do this is if each of the Drupal user give at least a small contribution to the community. So, when I contribute to Drupal, I’m helping you to have time to contribute to something that I may need in the future.

I maintain many Drupal modules, so basically the main contributions are create, update and migrate Drupal modules, but I contribute too in other areas. I contribute translating Drupal to the Spanish language and moderating the user translations, I create patches for some projects I do not maintain, sometimes I review some patches in the issue queue, I write and update modules documentation, I make some contributions creating tests for Drupal modules, I give support to the community in the Slack channels and in the Drupal Stack-exchange site and help new contributors to learn how to contribute projects to Drupal in the correct way. And as I’m a former teacher, I participate in regional Drupal events promoting how and why is important to contribute to Drupal projects and how to do it.

I will love to maintain a Drupal core module but I don’t know if I will have the time to do it, so for the moment I will continue migrating to Drupal 8, evolving and having up to date the modules I maintain.

Alex_Moreno

Alex Moreno

Technical Architect at Acquia

quotesContributing to open source is not just a good and healthy habit for the communities. It is also a healthy habit for your own projects and your self-improvement. Contributing validates your knowledge opening your knowledge to everyone else. So you can get feedback that helps yourself to improve, and also ensures that your project is taking the right direction. For example when patching other contributed modules with fixes or improvements.

I enjoy writing code. My main contributions have been always on that direction. Although more recently I have been also helping on other tasks, like Spanish translations in Drupal 8 Umami.

Baddy Sonja Breidert.

Baddy Sonja Breidert

Co-Founder of 1xINTERNET

quotes One of the reasons why I contribute to Drupal is to make Drupal more known in my area, get more people involved, attract new users, etc. I do my bit in contributing to the Drupal project by organising events like Drupal Europe and Drupal Camps in Germany and Iceland.

It is extremely gratifying to see new people from all over the world join the Drupal community - be it as developers, designers, volunteers, event organisers, testers or for example writing documentation. There are so many different ways to contribute!

And what happens over and over again is that people originally come for a very specific purpose, say a project they want to launch, and then stay in the community just because it is such a friendly, diverse and welcoming place! My work in the board of the Drupal Association confirms the old slogan over and over again: Come for the code, stay for the community!

Daniel_Wehner

Daniel Wehner

Senior Drupal Engineer at Times Higher Education

quotesUnlike many other projects the Drupal community tries to create a sustainable environment. Both from the technical site, but probably on the long run more important from the community side. Initiatives like Drupal Diversity & Inclusion lead the foundation for a project which won't just go away like many others

Jacob_Rockowitz>

Jacob Rockowitz

Drupal developer. Built and maintains the Webform module for Drupal 8

quotesContributing to open source software provides me with an endless collaborative challenge. My professional livelihood is tied to the success of Drupal which inspires me to give something back to the Drupal community. Contributing to Drupal also provides me with an intellectual and social hobby where I get to interact with new people every day.

Everyone has a personal groove/style for building software. After 20 years of writing software, I have come to accept that I like working towards a single goal/project, which is the Webform module for Drupal 8. At the same time, I also have learned that building open source software is more than just contributing code; it is about supporting and creating a community around the code. Supporting the Drupal community has led to also write documentation, blog about Drupal, Webform, and sustainability, present at conferences, and address the bigger picture around building and maintaining software

Joel_Pittet

Joel Pittet

Web Coder. Drupal 8 Theme System Co-maintainer

quotesI feel that I should give back to ensure the tools I use keep working. Monetarily or with my time. And with Drupal it’s a bit of both:

I started submitting patches for the Twig initiative for Drupal core, then mentoring and talks at DrupalCons and camps, followed by some contrib patches, then offered to co-maintain some commerce modules, which snowballed into more and more contrib module co-maintaining, mostly for ones I use at work.

I pay the Drupal Association individual membership to help the teams for all the Drupal.orgwork and event work they do.

Joachim_Noreiko

Joachim Noreiko

Freelance Drupal developer. Built and Maintains Drupal Code Builder

quotesI guess, I like fixing stuff, I like to code a bit in my spare time, I like to contribute to Drupal, and as a freelancer, it’s good to be visible in the community.

Lately I’ve actually been feeling a bit demotivated. I’ve been contributing to core a bit, but it’s always an uphill struggle getting beyond an initial patch. I maintain a few contrib modules, and my Drupal Code Builder tool as well.

Joris_Vercammen

Joris Vercammen (borisson)

Drupal developer, Search API + Facets

quotesBeing able to pull so many awesome modules for free really makes the work we all do in building good solutions for our customers a lot easier. This system doesn’t work without some of us putting things (code/time/blogposts/…) back into it. The Drupal community has given me a lot of things unrelated to just the software as well (really awesome friends, a better job, the ability to travel all over Europe, etc.). To enable others that come after me to have a similar experience, I think that it is important to give back, as long as it fits in the schedule.

Most of my contributions are under the form of code. I try to do some mentoring but while that is a lot more effective, it is really hard and I’m not that great at it, yet. I’m mostly interested in the Search API ecosystem because that’s what I got roped in to when I started contributing. A lot of my core contributions are for blockers (of blockers of blockers) for things that we need. I try to focus a little bit on the Facets module, since that is what I’m responsible for, but it’s not always easy or the most fun to do. Especially since I’ve still not built a Drupal 8 site with facets on it.

Malabya_Tiwari

Malabya

Open-source evangelist. Drupal Practice Head at Specbee

quotesCommunity. That’s what motivates me to contribute. The feeling I get when someone uses your code or module or theme is great. Which is a good drive to motivate for more contributions. Drupal being an open-source software, it is where it is just of the contributions by thousands of contributors. So, when we use Drupal it is our responsibility to contribute back to the software to make it even better for a wider reach

Apart from contributing modules, theme & distributions I help in organising local meetups in Bangalore and mentoring new developers to contribute and begin their contribution journey from the root level. This gives me immense pleasure when I can help someone to introduce to the world of Drupal and make them understand about the importance of contributions and community. Going forward, I would definitely strive towards introducing Drupal to students giving them a career choice and bring in more members to the Drupal community.

Nick_Wilde

Nick Wilde

Drupal developer at Taoti Creative

quotesMy main motivation has always been improving what I use - first OS contribution before my Drupal days was a bug-fix for an abandoned at the time project that was impairing my Modding of TES-III Morrowind ;). I like the challenges and benefits of working in a community. Code reviews both that I've done and those done on my code have been incredibly important to my growth as a developer. I also have used it as a portfolio/career advancement method, although that is important it is only of tertiary importance to me. Seeing a test go green or a getting confirmation that a bug is fixed is incredibly satisfying to me personally. Also, I believe if you use an open source project especially professionally, contributing back is the right thing.

My level of contributions vary a fair bit depending on my personal and professional level of busy, but mostly through contrib module maintenance/patch submissions. Also in the last year or so, I've been getting into a lot more mentorship roles - both in my new company and within the broader community. Restarted my local Drupal meetup and am doing presentations there regularly.

Rachel_Norfolk

Rachel Norfolk

Community Liaison at Drupal Association

quotes Contribution for me is, at least partly, a selfish act. I have learned so much from some of the best people in the industry, simply by following along and helping where I can. I have also built up an amazing network of people who, because they know I help others, are more prepared to help me when I need it. Both code and other ways of contributing. I’m occasionally in the Drupal core issue queues, I help mentor others and I get involved in community issues.

Renato_Goncalves

Renato Goncalves

Software Engineer at CI&T's Drupal Competence Office ()

quotesMy first motivation to contribute to the Drupal community is helping others that have the same requirement as mine. To be honest, I get very happy when someone uses my community code in their projects. I'm glad to know that I'm helping people. When I'm developing a new feature I check if my solution can be useful to other projects and that way I create my code using a generic way. - Usually, I'm the first to reuse the code several times. I think this is important to make Drupal a powerful and collaborative framework. I liked my first experience using the framework because for each requirement of my project, Drupal has a solution. I think contributing to the community is important for that. More and more new people are going to use the framework, and consequently new contributors, and in that way, it becomes increasingly powerful and efficient. An example of this is the Drupal Security Team, where they work hard to ensure that Drupal is a secure framework. I'm making contributions at the same time I delivery projects. Today I write my code in a generic way, that is, the code can be reused in other times. A good example of this model is the Janrain Connect project. This project is official in the community (contrib project) and my team and I w hard using 100% of the generic code, so we can reuse this code on other cases.

When we need to make some improvement in the code, the first point is checking a way to make this improvement using a generic solution. Using this approach we can help our project and help the community. In this way, we are contributing to making an organized and agile framework. The goal is that other people don't need to re-write code. It is a way of transforming the framework into a collaborative model.

Thomas_Seidl

Thomas Seidl

Drupal developer, “The Search API Guy”

quotesMy motivation comes from several sources: First off, I just like programming, and while fixing bugs, writing tests or giving support isn’t always fun, a lot of the time working on my modules is. It’s just one of my hobbies in that regard. Then, with my modules running on more than 100,000 sites (based on the report), there’s both a sense of accomplishment and responsibility – I feel proud in providing functionality for so many sites, and while, as a volunteer, I don’t feel directly responsible for them, I still want to help improve them where I can, take away pain points and ensure they keep running. And lastly, having a popular, well-maintained module is also the base of my business as a freelancer: it not only provides marketing for my abilities, but also the very market of users who want customizations. So, maintaining and improving my modules is also, indirectly, important for my income, even though the vast majority of my contributed work is unpaid.

Apart from participating in coding standards discussions, I almost exclusively contribute by maintaining my modules (and, increasingly rarely, adding new ones) – fixing bugs, adding features, answering support requests, etc. I sometimes also provide patches for other modules, but generally only when I’m paid to do so. (“My modules” being Search API and its add-on modules Database Search, Autocomplete, Saved Searches and, for D7 only, Solr, Pages, Location and Multi-Index Searches.)

And Lastly....

It’s not just brands that have adopted Drupal as their CMS – they are the cream of brands. From NASA to the Emmy Awards. From Harvard University to eBay. From Twitter to the New York State. These brands have various reasons to choose Drupal as their Content Management System. Drupal’s adaptability to any business process, advanced UX and UI capabilities for an interactive and personalized experience, load-time optimization functionalities, easy content authoring and management, high-security standards, the API-first architecture and so much more!

The major reason why Drupal is being accepted and endorsed by more than a million websites today is because Drupal is always ahead of the curve. Especially since Drupal adopted a continuous innovation model wherein updated versions are released every 6-months with seamless upgrade paths. All of this is possible because of the proactive and ever-evolving Drupal community. The goals for their contributions may vary - from optimizing projects for personal/professional success to creating an impact on others or simply to gain more experience. Either way, they are making a difference and taking Drupal to the next level every time they contribute. Thanks to all the contributors who are making Drupal a better place.

I’d like to end with an excerpt from Dries - “It’s really the Drupal community and not so much the software that makes the Drupal project what it is. So fostering the Drupal community is actually more important than just managing the code base.”

Warmly thanking all the mentioned contributors for helping me put this article together.

drupal community infographic
Aug 13 2019
Aug 13

When the open-source Accelerated Mobile Pages (AMP) project was launched in October 2015, Google AMP was often compared to Facebook's Instant Articles. Nonetheless, both of the tech-giants share a common goal – to make web pages load faster. While AMP can be reached with a web URL, Facebook’s Instant Articles aimed only at easing the pain for their app-users. Teaming up with some powerful launch partners in the publishing and technology sectors, Google AMP aimed to impact the future of content distribution on mobile devices.

Fast forward to today, and Google AMP is the hottest thing on the internet. With over 25 million website domains that have published over 4 Billion AMP pages, it did not take long for the project to be a huge success. Comprising of two main features; Speed and Support to Monetization of Objects, AMPs implications are far reaching for enterprise businesses, marketers, ecommerce and every other big and small organizations. With great features and the fact that its origin as a Google Initiative, it is no surprise that the AMP pages get featured in Google SERP more prominently. 

What is AMP?

With the rapid surge in mobile users, the need to provide a website-like user experience does not just cut it. Today mobile user’s come with a smaller attention-span and varied internet speeds. Businesses can cater to each of these challenge with a fast-loading, light-weight and an app-like website with Google AMP.

AMP is an open-source framework that simplifies the HTML, streamlines CSS rules, restricts use of Javascript (can use AMP’s component library instead) and delivers pages via a Google AMP cache (a proxy-based Content Delivery Network).

Why AMP??

Impacting the technical architecture of digital assets, Google's open source initiative aims to provide streamlined web pages to mobile browsers and other apps.

It is Fast, like Really Fast

Google AMP loads about twice as fast as a normal comparable mobile page and the latency is as less as one-tenth. Intended to provide the fastest experience for mobile users, customers will be able to access content faster, and they are more likely to stay on the page to make a purchase or enquire about your service, because they know it won't take long.

An Organic Boost

Eligibility for the AMP carousal that rests above the other search results on Google SERP, resulting in a substantial increase in organic result and traffic is a major boost for the visibility of an organization. Though not responsible for increasing the page authority and domain authority, Google AMP plays a key role in sending far more traffic your way.

ROI

The fact that AMP leverages and not disrupts the existing web infrastructure of a website, makes the cost of adopting AMP much lesser than the competing technologies. In return, Google AMP enables better user experience which translates to better conversion rates on mobile devices.

Drupal & AMP

With better user engagement, higher dwell time and easy navigation between content benefits, businesses are bound to drive more traffic with AMP-friendly pages and increase their revenue. The AMP module is especially useful for marketers as it is a great addition to optimize their Drupal SEO efforts.

AMP produces HTML that makes the web a faster place. Implementing the AMP module in Drupal is really simple. Just download, enable and configure!
Before you begin with the integration of AMP module with Drupal, you need -
AMP Module : The AMP module mainly handles the conversion of regular Drupal HTML pages to AMP-complaint pages.

Two main components of AMP module:

AMP Module : The AMP module mainly handles the conversion of regular Drupal HTML pages to AMP-complaint pages.
Two main components of AMP module:

AMP Theme: I'm sure you have come across AMP HTML and its standards. The one that are responsible for your content to look effective and perform well on mobile. The Drupal AMP theme produces the mark up required by these standards for websites looking to perform well in the mobile world. Also, AMP theme allows creation of custom-made AMP pages.

AMP PHP Library: Consisting of the AMP base theme and the ExAMPle sub-theme, the Drupal AMP PHP Library handles the final corrections. Users can also create their own AMP sub-theme from scratch, or modify the default ExAMPle sub-theme for their specific requirements.

How to setup AMP with Drupal?

Before you integrate AMP with Drupal, you need to understand that AMP does not replace your entire website. Instead, at its essence, the AMP module provides a view mode for content types, which is displayed when the browser asks for an AMP version.

Download the AMP Module

With your local prepped up, type the following terminal command:

drush dl amp, amptheme, composer_manager

This command will download the AMP module, the AMP theme and the Composer Manager module (suppose if you do not have the Composer Manager already).

If you have been a user of Drupal 8,  you are probably familiar with Composer and its function as a packaging tool for PHP that installs dependencies for a project. The composer is used to install a PHP library that converts raw HTML into AMP HTML. Also, the composer will help to get that library working with Drupal.

However, as the AMP module does not explicitly require Composer Manager for a dependency, alternate workflows can make use of module Composer files without using Composer Manager.

Next, enable the items that are required to get started:

drush en composer_manager, amptheme, ampsubtheme_example

Before enabling the AMP module itself, an AMP sub-theme needs to be enabled. The default configuration for the AMP module sets the AMP Theme to ‘ExAMPle subtheme.’

How to Enable AMP Module?

The AMP module for Drupal can be enabled using Drush. Once the module is enabled, the Composer Manager will take care of the downloading of the other AMP libraries and its dependencies.

drush en amp

Configuration

Once everything is installed and enabled, AMP needs to be configured using a web interface before the Drupal AMP pages can be displayed. First up, you need to decide which content types should have an AMP version. You might not need it for all of them. Enable particular content type by clicking on the “Enable AMP in Custom Display Settings” link. On the next page, open the “Custom Display Settings” fieldset. Check the AMP box, then click Save.

image

Setting an AMP Theme

Once the AMP module and content type is configured, it is time to select a theme for AMP pages and configure it. The view modules and the field formatters of the Drupal AMP module take care of the main content of the page. The Drupal AMP theme, on the other hand, changes the mark-up outside the main content area of the page.

Also, the Drupal AMP themes enables you to create custom styles for your AMP pages. On the main AMP config page, make sure that the setting for the AMP theme is set to the ExAMPle Subtheme or the custom AMP subtheme that you created.

Drupal-theme

Aug 08 2019
Aug 08

Back in early 2010, when Jason Grigsby pointed out that simply setting a percentage width on images was not enough, and that you needed to resize these images as well for a better user experience. He pointed out that if you served the right sized images on the original responsive demo site, more than 75% of the weight of those images can be shaved on smaller screens. 

Ever since, the debate on responsive images have evolved in what is the best solution to render the perfect, responsive images without any hassle.

We all know how Drupal 7 does a great job in handling responsive images with its modules. However, with Drupal 8, things are even better now!

Responsive Images in Drupal 8

The Responsive Image module in Drupal 8 provides an image formatter that maps the breakpoint of the original image to render a flawless responsive image using a picture tag.

When we observe how Drupal 8 handles responsive images when compared to Drupal 7, some of the features to be noted are:

Drupal 7 consists of the contributed module picture element, which in the latest version is known as Responsive Images.
In addition to this, Responsive images & Breakpoint modules are a part of the Drupal core in the latest version of the CMS.

The Problem

One of the major problems with the images in web development is, browsers do not know about the images, and are clueless about what sized images are rendering in relation with a viewport of different screens until the CSS & Javascripts are loaded.

However, the browser can know about the environment in which the images are rendering, which includes the size of the viewport and resolution of the screen.

The Solution 

As we mentioned in previous sections, responsive images use picture element which basically has sizes and srcset attributes which play a major role in notifying the browser to choose the best images based on the image style selections.  

So Drupal 8 has done a great job in providing the responsive images module in the core. This will download the lower sized images for the devices with lower screen resolution, resulting in better website load time and improved performance. 

Steps to reproduce

  1. Enable Responsive images and breakpoint module.
  2. Setup the breakpoints for your projects theme.
  3. Setting up the image styles for responsive images
  4. Creating a responsive image style for your theme
  5. Assigning the responsive image style to an image field.

Enable Responsive images and breakpoint module

Since it's a part of drupal 8 core, we will not require any other extra module. All you have to do is enable the responsive images module, since the breakpoint module will be installed with the standard profile. Else enable the breakpoint module.

To enable the module goto->admin->extends select the module and enable the module.

extend page

Setup the breakpoints for your project's theme
 

breakpoints

Setting up the theme’s breakpoint is the most important part for the responsiveness of your site.


If you are using a core theme like bartik , seven, umami or claro, you will already have the breakpoints file and you don’t have to create any new ones. 

However, if you are using a custom theme for your project, it is important that you define the breakpoints in "yourthemename.breakpoints.yml" which can be found in your theme directory, usually found in "/themes/custom/yourthemename".

Each breakpoint will assign the images to media query.  For example images which are rendering in mobile might be smaller i.e width less than 768px, where in medium screens will have a width between 768px to 1024px.


Each breakpoint will have: 

label:  Is the valid label given for the breakpoint.
mediaQuery:  Is the viewport within which the images are rendered.
weight:  For the order of display.
multipliers:  It's a measure of the viewport's device resolution normally 1x will be used for standard sizes and 2x for retina display.

Setting up the image styles for responsive images

Now we will have to create an image style for each of the breakpoints. You can configure your own Drupal 8 image styles at admin->config->media->image-styles. 

Click ‘Add image style’.  Give the valid name for your image style & use scale and crop effect which will provide the cropped images. If the images are stretched, add multiple image style for different viewports.

add image style

Creating a responsive image style for your theme 

This is where you provide the multiple image style options to the browser and let the browser choose the best out of the lot. 

responsive-image-styleresponsive image


To create new responsive Drupal 8  image style navigate to:
Home -> admin- > config-> media->responsive-image-style and click on ‘Add responsive image’. 

Give a valid name for your responsive image style & select the breakpoint group (choose your theme) & assign the image styles to the breakpoints listed 

There are multiple options for the image style configurations

  • Choose single image style: Where you can select the single image style that will be rendered on the particular screen
  • Choose multiple image style: Where you can select the multiple-image style and also specify the viewport width for the image style

At last, there is an option to select a fallback image style. The fallback image style should only appear on the site if an error occurs.

fallback responsive image

Assigning the responsive image style to an image field 

  • Once all the configurations are done, move to the image field by adding the responsive image style.
  • To do that go to the field’s manage display and select the responsive image style which we created.
  • Add content and see the results on the page with a responsive image style.assigning responsiveresponsive image style to an image field

Final Results 

responsive image style to an image field

 The image at a minimum width of 1024px (For large Devices).

minimum width of 1024px

Image at minimum width of 768px (For Medium Devices).

Responsive image style

Image at maximum width 767px (For Small Devices).

Aug 06 2019
Aug 06

Did you know that the term “One-Stop-Shop” is one of the most clichéd marketing taglines to use, according to Hubspot? Thankfully, I came across that article before I sat down to write this one. So, I’m NOT going to say that a Drupal distribution is a “one-stop-shop” for a quick and easy way to launch your website. Let’s put it this way instead – If you want to build a Drupal website and eager to see it go live real quick, while making sure that you want to save time on maintenance too, Drupal distributions are meant for you.  

What is a Drupal distribution?

A Drupal distribution is an all-inclusive package to get your website up and running quickly. This package consists of the Drupal Core (basic features), installation profiles, themes (for customized designs), libraries (consists of assets like CSS or Javascript) and modules specific to an industry. For example, if you run a publishing company, a distribution like Thunder can help you speed up your development process. Here you can find modules like Paragraphs, Media Entity, Entity Browser and features like Thunder admin theme, scheduled publishing and much more – all in one place. 

Why should you use a Drupal 8 distribution?

Let me give you a few reasons for that -

  • You don’t have to scramble your way through thousands of Drupal modules only to find a few that you really need.  
  • Configuring Drupal core is easier too as most part of it comes preconfigured.
  • The features and modules included in a Drupal distribution are time tested, optimized and proven for quality.
  • Maintenance of a Drupal distribution is simpler because updates for all modules and features can be performed on one shot!  
  • Since you don’t have to reinvent the wheel every time, you save on time. You save precious resource time. Which also means, you save on money! 
  • Now that you have saved some time, you can spend more time on customizing and personalizing these components to tailor-fit your business needs.

Top 15 Drupal Distributions (alphabetically sorted)

1. CiviCRM Starter Kit

The CiviCRM Starter Kit brings together the power of Drupal and the open-source CRM tool – CiviCRM. The popular CRM is used by more than 8000 organizations to centralize constituent communications. Along with core Drupal and CiviCRM, the distribution also packs in CiviCRM related modules like CiviCRM Cron, Webform CiviCRM, CiviCRM Clear All Caches, etc.

 2. Commerce Kiskstart

If you are looking to quickly get your e-commerce store up and running on Drupal Commerce framework, this one’s for you. Commerce Kickstart is a Drupal distribution made for both Drupal 7 and Drupal 8 and is maintained by Centarro (previously Commerce Guys). The Commerce Kickstart 2.x version comes loaded with beautiful themes, catalog, promotion engines, variety of payment tools, utility tools, shipping and fulfilment tools, analytics and reporting tools, marketing tools, search configuration, custom back office interface and much more.

drupal distributions

                                Source - https://www.drupal.org/project/commerce_kickstart

3. Conference Organizing Distribution

Creating a website for events and conference gets easier with this Drupal distribution. Conference Organizing Distribution (COD) was made for Drupal 7 but is being actively ported to Drupal 8. With COD, you can -

  • Create/manage tickets for event registrations
  • Create announcements for paper submissions
  • Moderate session selections
  • Provide an option for attendees to vote for their favourite sessions
  • Schedule sessions on any day and place
  • Easily manage sponsorships
  • Event management made easy with a powerful event management dashboard
  • Keep a track on multiple events and sessions
  • Sell tickets with Drupal commerce

4. Contenta

This API-first Drupal distribution provides you with a framework that is API ready. It reduces the complexity and pain of using or trying decoupled/headless Drupal. Contenta also comes pre-installed with code and demo content along with front-end application examples. Even if you are new to Drupal, Contenta offers simple and quick ways to get the Drupal CMS part ready and you can then focus on frontend frameworks you intend to use. If you’re looking for a complete solution for a headless Drupal project, ContentJS is your best bet. Content JS integrates Contenta CS with front-end framework NodeJs for a powerful, high performing digital experience.

5. Drupal Government Distributions (federal, regional, local)

The aGov Drupal 8 distribution was developed to meet the guidelines of the Australian government. It allows government bodies to follow standards like the WCAG 2.0 AA, Australian government Web guide, AGLS metadata and Digital Service Standard. However, the developers of aGov, PreviousNext, no longer develop of support this distribution as they are now focused on the GovCMS Drupal distribution. GovCMS was built on the foundation of aGov to build more secure, compliant and adaptable government websites. 
deGov Drupal 8 distribution was built for German government websites and used Acquia Lightning to offer more valuable features and functionalities. Some features common to all the Drupal government distributions-

  • Meeting all government standards
  • Workbench moderation
  • Citizen engagement portals
  • Responsive design
  • Example content
  • Intranet/Extranet

6. Acquia Lightning

True to its name, Acquia Lightning is a light-weight Drupal 8 distribution that you can use to develop and deploy a website in lightning speed (up to 30% lesser development time!). Developed by Acquia, Lightning aims to provide full flexibility and a great authoring experience to editorial teams and content authors. Built on Drupal 8, it offers powerful features like page layouts, drag and drop of assets using Panels, rich text, media, slideshows, Google maps, content scheduling and much more. You can also streamline the workflow process of publishing, reviewing, approving and scheduling content.

7. Open Atrium

OpenAtrium is a Drupal distribution built specifically for organizations to be able to create a collaborative intranet solution for social collaboration and knowledge management. It offers features like a drag and drop layout, events management (Events), document management (Files), issue tracking, granular access controls, media management, a worktracker (to monitor tasks and maintain transparency), and much more. It is also offers responsive layouts and themes.

8. Open Academy

Built on the Panopoly base distribution, the Drupal distribution is tailor-made for higher education websites which can be further extended and customized. It is an easy-to-use tool that does not need users to be technical. You can have a great website without any customizations too! Open Academy distribution consists of a Drupal 7 installation profile and features meant for managing courses, departments, faculty, presentations, news, events, publications and more. The themes provided are optimized and mobile ready.

9. Open Social

Open Social is a Drupal 8 distribution that allows organizations to create intranets, online communities and other social portals easily. It is being used by hundreds of organizations including NGOs and government bodies to facilitate communication and connection with their volunteers, employees, members and customers. It also has features like multi-lingual support, private file system, social login, Geo-location maps, etc.

drupal distribution social module

Source : https://www.drupal.org/project/social

10. Opigno LMS

Opigno Distribution is a Learning Management System built on Drupal. It is an easily scalable solution built not just for universities but also for organizations looking to create e-learning solutions. It allows to manage training paths that are organized in courses, activities and modules. It also provides with features like adaptive learning paths, management of skill acquisition, quizzes, blended learning (online modules + in-house sessions + virtual classrooms), award certificates, forums, live meetings and more.

opigno lms drupal distributions

                                               
 Source: https://www.drupal.org/project/opigno_lms

11. Panopoly

This is a base Drupal distribution – which basically means it also acts like a foundation or a base framework for many other distros to be built upon. Panopoly Distribution is powered by the magic of the Panels module and its features like In-place editor, Panelizer, Fieldable Panel Panes, etc. The Panopoly package consists of contributed modules and libraries. It offers cross-browser and responsive layouts, drag and drop page customizations, a powerful easy-to-use Admin interface, etc. It can also be extended through many Panopoly apps. 

12. Presto!

Want a Drupal 8 starter-kit that can meet all your content management needs and get you up and running, presto?! Count on Presto! Whats better, you can start using Presto right out-of-the-box! It is power packed with some great content features like Intelligent content editing, Promo bar (inline alerts for news/announcements), Divider (adding space), Carousel (interactive images), Blocks, etc. It also comes shipped with a responsive theme based on Bootstrap framework that can be further customized to add more layouts. It also lets you easily integrate with Drupal Commerce to make selling on your website easier. With Presto, you can reduce the development time by 20%!

13. Reservoir

Like Contenta, Reservoir too is an API-first Drupal distribution for decoupling Drupal. With this tool, you can build content repositories that are ready to be consumed by front-end applications. It is packed with all necessary web service APIs necessary to create decoupled websites. Reservoir was developed with the objective to make Drupal more accessible to developers, to provide best-practices for building decoupled applications and to provide a starting point for Drupal developers (with less or no Drupal experience) to build a content repository. Reservoir uses JSON API (a specification used for APIs in JSON) to interact with the back-end content. It also ships with API documentation, OpenAPI format export (compatible with a plethora of tools) and a huge set of libraries, SDKs and references.

14. Thunder

This Drupal 8 distribution is designed exclusively for professional publishing. Thunder was originally designed for and by Hubert Burda Media. The Drupal distribution is loaded with features meant for the publishing sector like the Paragraph module, drag and drop of content, Media Entity, Entity browser, Content lock, Video embed field, Facebook Instant articles, Google AMP, LiveBlog, Nexx.tv video player and much more. All of this along with Drupal core features and responsive themes. 

Drupal distribution module thunder


Source: https://www.drupal.org/project/thunder

15. Varbase

Are you lost in a mountain of Drupal modules and wondering which one to pick? Looking for a package that can jumpstart your web development process right away? Varbase is your go-to Drupal distribution then! Varbase provides you with all the necessities and essential modules, features and configurations to speed up your time to market. 

Pages

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web