Everyone knows DotCMS is crazy-flexible as it is. Now, you can do even more with our new Multi-type Containers in version 3.0. Multi-type Containers allow you to pull content from more than one content structure. One structure was good back in the day, but now, the new cool is multi-type containers. Rethinking Templates and Containers will introduce you to how to build sites that content contributors can't break... not that it ever happens that way. You'll be giddy with all the possibilities.

2. Crazy Contained
Rethinking Templates and
Containers in dotCMS 3.0

3. Who am I?
• Jason Smith
• 15 Years w/ dotCMS
• jason@dotcms.com
• @fishsmith
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

4. Overview
• What are Multi-content Containers
• How do they work
• What are the benefits
• What are some of the challenges
• Examples & recommendations
• What could this mean for the future
• Questions and Answers
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

5. What Are Multi-content Containers
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

6. Product
News
Location
Event
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

7. Video
Event
Event
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

8. Product
Event
Event
Location
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

9. How Does It Work
• Reusing Content
• Adding New Content
• Create a Multi-content Container
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

10. Reusing Content
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

11. Add New Content
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

12. Create a Multi-content Container
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

13. What Are The Benefits
• Fewer Containers
• Fewer Templates
• Increased Flexibility
• More Control for Designers
• Happier Users
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

14. What Are The Challenges
• Using the same code in multiple containers
• Managing styles and classes
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

15. Examples & Recommendations
Ideas
• Create VTL files for each content type.
• Create Containers that make sense
• xs-container, sm-container, md-container
• left-column, center-column, right-column
• Organize your Less or Sass to mirror you
content types
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

16. VTL for each Content
Type
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

17. Taking it a Step Further
Pre Loop:
1
2
#set($container = “medium-column”)
<div class=“medium-container”>
Code:
1
#dotParse(‘/application/vtl/containers/news.vtl’)
Post Loop:
1
<div>
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

18. news.vtl
1
2
3
4
5
6
7
8
9
10
11
12
#if($container == “medium-column”)
<div class=“news”>
<div class=“news-headline”>
<a href=“/news/$urlTitle”>$title</a>
</div>
<div class=“news-lead">
$!{lead}
</div>
</div>
#elseif($container == “large-column”)
<div class=“news”>
<img src=“/contentAsset/image/${ContentInode}…
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

19. VTL for each Content
Type
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

20. VTL for each Content
Type
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0

21. Question & Answer
Crazy Contained - Rethinking Templates & Containers in dotCMS 3.0