In the previous tutorial, we jumped right into using Display Suite. We selected a layout and configured fields for the Teaser and "Full content" view mode. In this tutorial, we’ll look at how to create a custom view mode, use view modes within the Views module, custom wrappers and custom CSS classes.
What is a view mode? View modes allow you to display content types in multiple ways. For example, the Article content type comes with a Teaser and "Full content" view mode. When you go to an article content page (node/1) you’ll be shown the "Full content" view mode of the article. Whereas if you view the article node on the homepage, you'll be shown the Teaser view mode of the article.