The new drupal database API (known as DB:TNG) is built atop PHP's native PDO engine. The main objective behind Drupal’s database API is to allow developers to write one query that will work across different types of databases. So instead of writing specific queries for MSSQL, PostgreSQL, MongoDB, you can write one query. Then, a plugin is written to translate that query into native style and write the query in the initial language which is Database Abstraction layer. 
 
What are the new changes in Drupal 7’s new database API?
 
One of the biggest changes is Drupal 7's new database API, an object-oriented system which change  the way most developers will build database queries in Drupal. Every developer is familiar with basic sql query, Where we are used to writing a query in usual fashion.
E.g: select field1, field2  from table_name where value order by  asc;
 
In Drupal 7 we do the same thing using database API, here, a developer has to create a query as an object, fields, condition, order, range and other element should be added by calling methods. Thereafter, we need to call the execute() method. 
 
Below query is about drupal db select ‘student‘ of fields matched condition, order by student’s dob in descending order & limit would be first 10 result. And executing them by calling execute() method

$query = db_select('student', 's')
  ->fields('s', array('id', 'name', 'DOB'))
  ->condition('s.uid', $uid)
  ->orderBy('s.dob', 'DESC')
  ->range(0, 10)
  ->execute();
 
As per the Drupal Community “Drupal database API provides certain standards, where we should not make any database call directly until and unless we are in CORE APIs development.” 
 
Database API is designed in such a way that any newbies can also construct the drupal database query without any extra effort. Hence, it preserves the syntax making it more powerful like never before.
 
Some of points that I would like to point out are,

1. Support across multiple server. Like MySQL,MariaDB,Percona Server, PostgreSQL,SQLite,Microsoft SQL Server, Oracle, MongoDB
2. Provides a structured interface for dynamic queries.
3. Follow security guideline.
4. Provides clean interface to module, really good when we want to differentiate between functional codebase and query.

 
How to construct a query in Drupal using Database API  

• Enclosing table name in {} adds one level of security layer, where drupal need to select the right table for you.
• Conditions in the query is added by putting placeholder, this protects your system against sql injection.
• LIMIT syntax varies between databases if you have limit in your query then use drupal_query_range() instead of drupal_query()

 
 While working with Database Abstraction layer we have two types of queries - Static and Dynamic queries. Static queries are similar to PHP native function, there are just minor changes. 
 
Static queries support SELECT for faster retrieving and execution. On the other hand Dynamic queries have a lot of differences, it allows you to build a query step by step. Also, based on the different conditions you can manipulate your query. 
 
So, let’s have a look at query. From Drupal 6 to Drupal 7 there's not much difference. It’s just a shift of those who are used to manually writing the queries.
 

Static SELECT queries
 
A simple SELECT queries that do not involve entities, the Drupal database abstraction layer provides the functions db_query() and db_query_range(), which execute SELECT queries (optionally with range limits) and return result sets that you can iterate over using foreach loops.
 
/* Drupal 6 query */
$sql = "SELECT n.nid, n.title, n.uid FROM {node} n WHERE n.type = 'article'";
$results = db_query_range($sql, 0, 3);
 
/* Drupal 7 query */
$query = db_select('node', 'n');
$query->condition('n.type', 'article', '=')
      ->fields('n', array('nid', 'title', 'uid'))
      ->range(0, 3);
$result = $query->execute();
 
Both of the queries are doing the same thing, i.e., retrieving the id, title,uid from the Node table that match certain criterias, then sorting the results and ensuring only first three matches to be returned. 
 
In addition, the new object-oriented approach of running raw queries can be done in Drupal 7 with the db_query() function, and in mostly its more efficient. However, the advantage doesn't always help someone to write raw text queries. Some modules need to build a large number of similar queries.

Dynamic SELECT queries
 
For Dynamic SELECT queries where the simple query API described in Simple SELECT queries will not work well, you need to use the dynamic query API. However, you should still use the Entity Query API if your query involves entities or fields.
 
$result = db_select('example', 'e')
  ->fields('e', array('id', 'title', 'created'))
  ->condition('e.uid', $uid)
  ->orderBy('e.created', 'DESC')
  ->range(0, 10)
  ->execute();
 
 
db_select() and similar functions are wrappers on connection object methods. Mostly, in classes, you should use dependency injection and the database connection object instead of these wrappers. 
 
What I have shared with you is just an introduction on Database API as well as Dynamic queries and Static queries. Below is the Drupal  Database structure 

for Drupal 7 db schema:
 
 

For Drupal 8 db schema:
 

To get more detailed information on Database API Abstraction layer, visit drupal.org official site.

The network effect of Web platforms has now come into light which has been existing long. This term has been coined from economics also known as the demand side economics of a scale and it is the effect created by the value of a product upon a user. With a network effect in action - the value of the platform depends on its users.

A network effect is comparable to a telephone connection, where positive connections are categorized as network effects and negatives as congestion.

The stability of a platform comes from a loop of the positive connections as the network effect.

The beginning

Network effects was a central theme in the creation of the first Telephone. But the monetized advancements came more into effect with the researchers.

Uses of this effect

The network effect comes into action once the platform/service gains a large percentage of subscribers. This tipping point of the number of subscribers gives a value of the service or the product which is better than or as good as the price paid for the making of the service. Which means that the value of the platform can be well defined by the number of signups and user bases. The more the number of user base the more the value of the service or platform is.

One of the key aspects of the growth, therefore, lies in luring customers and the underlying force would be the value that the service or product is providing. This essentially means that value and customers are directly proportional and entirely depends upon each other. To build a loyal band of customers will give the need to build a natural system without the presence of this network effect - who are known as early adopters. This can be done by giving additional values, sneak peak into more premium features otherwise known as the freemium now. More accessible the system is to the wider base of the targeted users, more will be the sign up adding valuation to the platform.

In some of my previous writings, I have established Why a Platform Enabled Business Model over Traditional Business Model? and How is the ecosystem of a Platform Strategy?

Beyond the tipping point of a number of subscribers, networks tend to become congested or stop adding value. This can be again compared to a telephone network. As long as the number of users is below the limit of the network capability, is is a win-win, but as soon as the number of nodes in the network tops the number of possible slots, call drops. At this point, each new user decreases the time duration for call drop increasing the decay and rate of decay of the network.

Same happens with the analogy of a number of the device to the capability of routers in a network connectivity or a host connection. New technologies like peer to peer connectivity solves issues of the kind and defies congestion. This P2P system is used by torrents where each user adds value to another user.

Classical economies of scale are on the production side, while network effects arise on the demand side.

The network effect of web platforms has similarities with the torrent networks where word of mouth can be a leading example of a user based value addition to the network. The network effect positively affects the society in forms of Creative Commons, Open Source development network and non-profit businesses.

A classic example of user based value creation is Facebook where the company does no work to add value to a user but to maintain the platform. It is through network effect that a group of like-minded individuals could connect and be present where each one of them adds to the value of another.

Types of network effects

Broadly, there are two kinds of networks effects:

Direct network effects: An increase in usage leads to a direct increase in value for other users. For example, telephone systems, fax machines, and social networks all imply direct contact among users. A direct network effect is called a same-side network effect. An example is online gamers who benefit from the participation of other gamers as distinct from how they benefit from game developers.

Indirect network effects: Increases in the usage of one product or network spawn increases in the value of a complementary product or network, which can, in turn, increase the value of the original. Examples of complementary goods include software (such as an Office suite for operating systems) and DVDs (for DVD players). This is why Windows and Linux might compete not just for users, but for software developers. This is also called a cross-side network effect. Most two-sided markets (or platform-mediated markets) are characterized by indirect network effects.

Additionally, there are two sources of economic value that are relevant when analyzing products that display network effects:

Inherent value: I derive value from my use of the product

Network value: I derive value from other people's use of the product”

Some of these concepts have been studied from the ideas of Sangeet Choudary and in my next knowledge sharing about the studies of the Network effect - I will deal with the negative impacts of the Network Effect.

Have you ever thought of the word ‘expanding’? Which means it’s not limited till the boundaries but spread out around everywhere. The industry of Application Development is also similar to that. In terms of development, people who want to push their limits hard and spread it to the variety of platform, allow accessibility to a variety of people and Increases usability. 
 
In a similar way, Drupal has a Core module called ‘Aggregator’. This Drupal module will help you to read the Feeds. It can fetch syndicated content (content that is available from one site to another). Provides the summary or full rendering of content that have been added recently. Web syndication also refers to the content license of reuse.

 

 

The Aggregator module in Drupal can fetch not only text but also image & other variety of content. After fetching those feed data, display those data in Drupal regions. Aggregator makes feed items available from a Drupal site using RSS, Atom, and RDF. 
In another way, you can also say that aggregator is an RSS feed reader. 
 
Some of you are hearing this for the first time and few of them are really aware of but didn’t get a chance to explore and use. 
 
Once you go to Drupal module page ‘Aggregator’ would be the first listing in the core module. 
 
For example: if you want to include YouTube video to your site. Youtube provides integration of iframe, using that you can integrate YouTube video to your site and without writing any additional plugin for a player. A smooth video with nominal feature can be played without any interruption. Similar to that world of content allows you to share the content to other a . That will be pointing to parent source. Those content get updated time by time from source owner and get listed on your site.
 
Let’s go through the step of enabling and using Drupal Feed Aggregator.

Step 1: Enable module from module list.

 

Step 2: Do the normal installation as we do for rest of the module. Once it’s enabled click on configuration available under Operation Column.

 

Step 3:  Clicking of Configuration will redirect to Feed Aggregator Configuration page. Having Allowed HTML Tags, No of items to be shown, Discard item older than, Select categories using, and length of trimmed description etc.
 
Location: admin/config/services/aggregator/settings

 

Allowed HTML tags:  HTML Tags mentioned in this box is only allowed. rest of the tags discarded.

Number of items shown in listing pages: How many items do you want to display in a listing page.

Discard items older than: How long do you to keep those feed.

Select categories using: Category selection should be limited[radio] or unlimited[checkboxes].

Length of trimmed Description: Max length of Document. and thereafter content would be trimmed.
Once you have made the necessary changes, you can save the configuration.  I am not making any changes. I’m happy with the existing configuration.
 
 
Step 4:  click on LIST quick tab available in extreme right top corner. From, this page you can add Feed, Category and also Import OPML.

Location: admin/config/services/aggregator
 
Let’s add a category. To do that click on ‘Add  category’ Fill up Title & description and click on save button.

 

Once it's saved. You can view the category from Feed Aggregator page.

 

It’s time to add Feed. To do that click on ‘Add Feed’ fill up title, URL, Update interval, News items in block, Categorize news items,
 
Title: The name of the feed.
 
URL: fully qualified Feed URL from external URL. Ex; https://www.drupal.org/node/feed this could be any feed url.
 
Updated interval: How frequently feed will be updated. time need to select.
 
News items in block: How many items do you want to display in a block.
 
Categorize news items: Select the category that you need to assign and then click on save.

 

 

 
Now it’s time to pull those feeds from external links. By clicking on update item.

 

As you can see a total 28 item has been pulled out from https://www.drupal.org/node/feed the Last update was 3 seconds ago and next updated should be in another 59 min 57 sec later. 
Incase if you don’t want to keep item available in your feed then you can clean it by clicking ‘remove items’. Or in case of update the feed click on ‘Update items’. 
 
Now it is time to display those feeds on our Drupal site. Go to structure -> block  assign those feeds block to your region and saved the block. I‘m assigning block to  sidebar_second, that displays the sidebar on the bottom right side of my page. Given below is my display

 

There is no hard and fast rule and you can assign the place of the sidebar like you want.

 
NOTE:

1. Drupal feeds Displayed in site can’t be imported. And feed link point to real content owner site.
2. Need to set up Cron tab to manually updated the feed on each cron run.
    

Automation Testing allows pre-scripted tests to run executable codes of web applications to check that it meets the requirements of the result.  In this blog, I will discuss in a step by step manner about how to execute Automation Testing using Selenium in the presentation below. Before we begin, I will briefly point out - Selenium as a software testing framework.

Selenium is an open source portable software-testing framework for web applications.  Selenium has a record/playback tool for creating and running tests without the need to learn a test scripting language. It provides test domain specific language to author tests in popular languages like Java, C#, PHP, Python, Ruby and more. Selenium enables testers to run their tests against modern web browsers and deploys on Mac, Windows, and Linux.  

Components

Selenium has a set of components that form the core layer for the functionalities, each has its specific use.  

Selenium IDE

Selenium IDE is an integrated development environment (IDE) for Selenium tests. It can be implemented as a Firefox Addon,  it allows tests to be recorded, edited, and debugged.

Selenium client API

As an alternative to writing tests in Selenese ( a scripting language for authoring tests), users can also write tests in other languages, which then communicate with Selenium by calling methods in the Selenium Client API. Selenium currently provides client APIs for Java, C#, Ruby, JavaScrip, and Python.

Selenium RC (Remote Control)

Selenium Remote Control (RC) is a server, written in Java, Selenium RC accepts browser commands via HTTP and allows to write automated tests in any programming language, that helps Selenium to integrate better with existing unit test frameworks.

Selenium WebDriver

Selenium WebDriver has been introduced after Selenium RC.  Commands which are sent in Selenese or via Client API are accepted by Selenium WebDriver and are sent to a browser.

Selenium Grid

Selenium Grid is a server that uses web browsers running on remote machines to run tests. With Selenium Grid, one server acts as the hub which accesses browser instances.  This helps to spread the load of testing.

Choosing Your Selenium Tool

A lot of beginners prefer to start with Selenium IDE. If you do not have a prior experience with a programming or scripting language you might find IDE ease to get familiar with Selenium commands for creating simple tests fast, within seconds.

Flexibility and Extensibility

Selenium is highly flexible. There are a lot of ways to add functionality to both the Selenium test scripts and Selenium’s framework for customizing your test automation. This might be Selenium’s greatest strength in comparison to other automation tools. Also, Selenium is Open Source, hence the source code can always be downloaded and modified.

Below given is a presentation on how we run Automation Testing for our Web Applications.

Highly customizable business logic is the core of any e-commerce solution. For such functionality, Order processor comes in picture which helps us to define flexible pricing with dynamic discounts.

In this article I will walk you through order price manipulation and use of custom adjustment to fulfill complex business logics in Drupal commerce 2.x module.

What is Order Processor?

E-commerce order processing is part of the order refresh process. This is executed on draft orders to ensure that it has up to date adjustments and that its order items are up to date. E-commerce order processing is a part of e-commerce workflow in drupal commerce 2.x.

What are Adjustments in Drupal commerce 2.x compared to Drupal 7?

We know that from Commerce 1.x  each product place in the order was defined as a Line item. In Commerce 2.x, the line item is renamed to Order item, but it only holds purchasable products, wherein Drupal 7 line item was used for shipping costs and discounts.

Order Processor in Commerce 2.x

Let’s fulfill a basic business logic where, if the product has price more than 20$ and quantity less than 10, it should get a complete discount and get that product for free.

For programming business logic, first we will create a custom module named commerce_customization. In that we will create a custom adjustment for the discount feature.

We Create a yml file to initialize the custom adjustment

Now we need to create orderprocessor.php for our custom module as CustomOrderProcessor.php under Src folder of the module.

Code Snippet to set the custom adjustment.

 

$adjustments[] = new Adjustment([
           'type' => 'custom_adjustment',
           'label' => 'Discounted Price - ' . $product_title,
           'amount' => new Price('-' . $new_adjustment, 'USD'),
         ]);

Now, we need to set the priority for our custom order processor to be called at first place then the default order processor. For that we need to write services.yml as commerce_customizartions.services.yml

Hence, when we purchase a product having unit price as 10$ and taking in a quantity of 5, our business logic gets applied due to the order processor in our cart.

Order processor plays a key role in manipulations of prices and adjustments in Drupal Commerce 2.x for building complex ecommerce portals with programming business logic.

So here we achieved to implement a simple business logic of applying discount for products with quantity less than 10 and base price less than $20 by order processor.

Code Source : https://github.com/chishah92/commerce-customizations

It's easy to make a slider in Drupal 8. There are several modules available to render Drupal view slideshow. But for specifics in terms of requirement, it may change like we need different arrows, dots, the number  of slider items and so on. The important part of slideshow should allow responsive too.

The slick plugin allows responsive functionality without doing any extra effect in jQuery by nature. By using this plugin, we can add/remove arrows, dots, no of items in a slide based on device, no of items to scroll in a slide based on device, etc.

Create View Block

1. Create view block for slideshow contents and add your format to “unformatted list” and fields like “content”  or anything else that you want to the field settings.

2. View format should be “unformatted list” else we would need to alter the format by using CSS or render the contents in twig file.

Download slick library

1. Download the slick library and paste it into /libraries folder in your Drupal site directory.
2. Link: https://github.com/kenwheeler/slick.git
3. Create a custom module and add the below code in module_name.libraries.yml file

Use hook_preprocess_page(&$variables)

 

Attach the library in Drupal hook_preprocess_page. Wherever you want to be based on the condition we can attach this library. Here I have attached on the front page.

Call Slick() function in js file

Here’s the trick for making the Drupal view slideshow responsive using jQuery by calling slick plugin function and attributes.

Calling slick function with the parent class of a view, slick starts rendering ultimately.

We should add .view-content while we call the slick function then only slick attributes will be added automatically with the generated HTML structure.

Add the below code in your js file i.e., custom.js

view-slideshow is nothing, but the parent class name of the view that we created here. For example, if the view name will be “slideshow” the view parent class will be as “view-slideshow” by calling the slick method from slick plugin it will automatically trigger the slider to slide.

By default, slick slider arrows are not showing because of white background. We can alter this through CSS or if you want to overwrite the arrows also possible in CSS by adding a background image.

Result will be like this

So now we have successfully integrated slick plugin and created the slideshow in Drupal 8. In the next blog, I will be discussing how we can make this plugin responsive using custom js.

I have been studying about platforms for sometime now. I wrote about the transforming business model of the platform enabled web. How traditional business model used the already present resources to create a platform, where the new product was not the product itself but the Platform which became a product. Like we have known, a platform enabled ecosystem sets the rules of how the business is supposed to be ruled by the leaders, provides a direction and brings together people who provide value to each other.

But before we put together an ecosystem, we need to understand what makes a platform and changes ecosystem. To successfully build a platform there is a lot to be learnt and unlearnt. For a change in business model and make a platform, there has to be a vision which looks at the broader aspects of a problem and aims to solve it. A platform always caters to the larger audience. For establishing a functional platform, a clear understanding of the business and technology is fundamental to its success.

Platforms mostly focus on reusing resources and sharing it among common elements in a network.  Most platform definitions focus on the reuse or sharing of common elements across complex products or systems of production. It has an architecture that enables features to be added or existing ones to be removed.

To build a platform that adds value and enables businesses or individuals to connect is a challenging task. To design a platform, it is an absolute necessary to keep the vision in place. The core value that is the driving force of the platform. For Amazon, it is to connect sellers and buyers, establish a place or platform for their interaction. This should be inevitable and the most important aspect that will shape the platform.
 
A platform will necessarily consist of a few elements like the following :

• Infrastructure
• Roles and rules
• Network
• Data

The infrastructure is the skeleton and backbone of any platform. It will be the product of the platform. For Uber it is the main phone application that acts as an infrastructure along with its main mission and values. The roles and rules make the platform a functional entity and the network acts as a matchmaker to bring on drivers and riders to the platform. In all of these data acts as the heart of the operation and makes it moving forward.

The future will see more and more transformation of traditional businesses and products into platforms. That will build services and ad values instead of tapping on our pockets like products do.

But the underlying question to all of these remain as to how would you create a platform that adds value?

In Drupal, many a time we come across a situation where we want to hide certain URL part from end users.

To achieve this we often use Drupal modules like Pathauto to hide node IDs, taxonomy IDs from URL and replacing them with some patterns (eg. Titles).

The above scenario can not be achieved for Drupal commerce checkout flow(URLs) as the Drupal modules like PathAuto do not support this. To achieve this in Drupal 7 we often used one of the following ways mentioned below:

• Commerce Checkout Paths Module.

• Combination of hook_url_outbound_alter and hook_url_inbound_alter.

In Drupal 8, At the point of writing this blog Commerce checkout paths module is yet to be ported and URL bounding hooks have been replaced by a certain way which will help us to achieve e-commerce security by hiding sensitive information from URL.

Let’s demonstrate how to achieve e-commerce security in Drupal Commerce module by the following method: 

• Create a custom module. In my case, I will be creating a module name Example.

• Create a example.info.yml file.

• Create a example.services.yml file. In this file, we will be creating tagged service with tags ‘path_processor_outbound’ and ‘path_processor_inbound’. This tags will help Drupal to call this service automatically which defines the purpose of tagged services. In our case, I have created below services.yml file. 

• Create the service class ExamplePathProcessor as mentioned in service definition and this class file is located at /modules/custom/example/src/PathProcessor/ExamplePathProcessor.php.

  • This class will implements interfaces, ‘InboundPathProcessorInterface’ and ‘OutboundPathProcessorInterface’.

  • These interfaces are located at namespace 'Drupal\Core\PathProcessor\OutboundPathProcessorInterface’ and 'Drupal\Core\PathProcessor\InboundPathProcessorInterface’, so we must use this interfaces in our class file.

  • Our class file should look like below:

• Please note that we have used other namespace like 'Drupal\Core\Render\BubbleableMetadata’ and 'Symfony\Component\HttpFoundation\Request’ which are required by our interface functions.

• In the class definition the functions:

  • processOutbound is provided by OutboundPathProcessorInterface  interface and this function behaves exactly same as hook_url_outbound_alter of Drupal 7.

  • processInbound is provided by InboundPathProcessorInterface  interface and this function behaves exactly same as hook_url_inbound_alter of Drupal 7.

So, we are ready with our module and file structure. Now in Drupal commerce, there are various checkout steps where Order ID can be seen in the URLs. Our goal is to hide this Order ID from the end user. 

Let’s understand how the Order ID encryption/decryption process will work. 

Step - 1:  Let’s say user will come to the checkout page. This checkout page URL will be pass to Drupal.

Step - 2:  Drupal will find all the tagged services in it’s database and will come across our path processor service called example.path_processor_example.

Step - 3:  This service class will receive the path URL in the $path variable of the processOutbound function. This function will help us in encrypting/hiding our order id.

Please note,

• We can use any of the encryption algorithm/business rules to encrypt our order ID in the $path variable and return it as the function output.

• Example, The URL '/checkout/123/order_information’  will become ‘/checkout/###/order_information’.

• The ‘###’ is the encrypted hash.

Step - 4: As the URL '/checkout/123/order_information’  has become ‘/checkout/###/order_information’, the service will also execute it’s inbound function where we can decrypt/unhide the ‘###’ and find out it’s original value(Order ID).

So, this is how we can use interfaces ‘OutboundPathProcessorInterface' & ‘InboundPathProcessorInterface’ along with their functions ‘processOutbound' & ‘processInbound’ to encrypt/decrypt the URL in checkout process of Drupal Commerce module.

Hope this helps you, Please feel free to reach out to me in the case of any queries and improvements.

Reading and Entertainment has always been a social activity, print took to digital and digital to being connected. The emphasis on social and collaborative reading has garnered a lot of enthusiasm.
 
Much has been studied by scholars on this front about the impacts but the question remains as to What will the future of Publishing hold?
 
Kevin Kelly describes his thoughts about what the future holds in “What Books Will Become ":

“Prototype face tracking software can already recognize your mood, and whether you are paying attention, and more importantly where on the screen you are paying attention. It can map whether you are confused by a passage, or delighted, or bored. That means that the text could adapt to how it is perceived. Perhaps it expands into more detail, or shrinks during speed reading, or changes vocabulary when you struggle or reacts in a hundred possible ways”.  
 
Determining what the readers want is a difficult task, and the Media and Publishing industry is looking out for something that is in tune with the times. When technology is built for publishers broader aspects of disruption like Artificial Intelligence. Working with AI throws at us questions which are yet to have better answers from human prospects.

Downfall of the traditional news publishing industry

Traditionally news used to be about what has already happened, but today it is more about predicting what will. People are no more just pay to passively look through pages of texts but are engaging, interacting and popularizing information digitally. And there has been a massive fall in paid circulation from 1990 to the early 2000s.

Why has this happened?

Because one size doesn’t fit all. Personalization needs to be in practice and it needs to be real time. We are all focused towards experiences because that is what will drive user engagement. Clubbing AI and Real Time Personalization will be big and will take user engagement to bigger heights. Based on previous user data or real time tracking Publishers will have the ability to serve readers what spikes their interest right at that point. Machine Learning will help to enable personalization of content in real time.

What is the relevance?

Content creators, publishers, and their audience will be influenced by search engines and more relevant information. But like we have been thinking, it will not overthrow journalists. What it will do is produce content in more volume.

Take a look at Netflix, because we are all familiar with it. It started way back in 2006 with the announcement of The Netflix Prize:
 
“In 2006 we announced the Netflix Prize, a machine learning and data mining competition for movie rating prediction. We offered $1 million to whoever improved the accuracy of our existing system called Cinematch by 10%. We conducted this competition to find new ways to improve the recommendations we provide to our members, which is a key part of our business.”
 
What Netflix did way back then has been getting better and today they use ML to continuously improve user experience through personalization. They published an article on the recommendation system Netflix Recommendations: Beyond the 5 stars and this relates to the industry in a much deeper manner because here the end user plays the ultimate role to shape the content being displayed or recommended.

The Contributed module Display suite (“DS”) allows you to take control on How do you want to render them using interface. admin has ability to arrange nodes, comment,user data, views etc. provides drag and drop after as we do for managing field section.

If you want to build a drupal custom page and really don't have any drupal technical knowledge or coding skill or, you don’t want to write custom templates, and  for smaller stuff then you can go ahead with this Display Suite module. Is really helpful when it comes to replacing the default view of an entity to user defined view using application interface. It’s straightforward and simple that is why developer build this for community.

To enable Display suits in Drupal 8 site it required layout_plugin as it has dependency
 

So, let’s get started. Download “Display suits” and “layout plugin” module from drupal.org and place it in your module directory as you do for enabling your module. Once the module is enabled  you can find “Display suit” available in  admin >> structure page. 

 

 To Create a Display Suit for your node create test node first for test purpose. Below content i have created in one of my local system.

To create/change the layout go to admin >> structure >> ds
On this page you will find “Manage display” for all the entity type. This manage display apply not only to the content type but also to all the entity on the site. On this page you will find 2 more menu item in quick tab.  

   1.Classes
     -- You can create custom css classes for your new region and assign back to them.
   2.Fields
     -- You can manage different display field to your region. By assigning some of the block , view or tem to the region.
 

 

So, let’s go ahead and create display suits for article node.by clicking on “Manage display” 
Admin >> structure  >> types >> manage >> article >>display 

At the bottom you will find Layout for article in default tab, Select a layout and click on save button. As soon as you will select the layout you will get a layout preview. I have selected Three column

 

As soon as you save the configuration you will find the page layout with some of the group called left, middle, right. Assign your field to those group using drag and drop feature. And you are almost done. The below screen will help you to build drupal custom layout.

After rearranging my page looks like below screen. 

Let’s check out the entity view for article. As you can see page having 3 column left, middle, right

 

 

Did you we have discussed #2 Classes quick tab, you can access them from below path 
Admin >> structure >> ds >>classes

This page is used for adding extra classes to the section you assign. We have seen it earlier, while creating Display suit it provide their own classes. If you want to add your own class then you can do this here.  
 

As i have created three classes cust_class_left,cust_class_middle,cust_class_right

 

So far we already created our custom class. It’s time to assign those classes to our region. Follow below path to add classed to the article bundle.
Admin >> structure >> types >> manage >> article >> display

You will find your new classes under custom classes quick tab.

I have assigned for layout cust_class_left for left region , cust_class_right for right  region and cust_class_middle for middle region.
 

So let’s see how does it work in browser. Ok Perfect

To add a Custom Wrapper to each region of you article entity you can add them from below path
Admin >> structure >> types >> manage >> article >>display
Go to “Custom wrappers” and select wrapper for each of the region.

You will find new markup available for left, middle, center and outside container. So without writing any custom code you can add wrapper.

So far you must be familiar of Display suites and their usage. Some of the front end Developer must be thinking it’s similar to Panels. Yes you are absolutely right.  In this blog i have gone through creating a Display suit assigning their field to different region and adding custom wrapper & classes.