Add a Tout div at the bottom of the article (called in the macro [% opt_articleBodyBottom %]) by adding this div code to the Design / Templates / Components / _Site / macros / option.article.utl. This will display the video related to the article being viewed.

---

NOTE: Class names may vary per individual setup.

---

Div to add:

<div class="tout-sdk tout-mid-article"></div>  

 You can call this only on certain sections by using the cms.url module. In this example you would only call the Tout div on the /sports section:

[% if cms.url | contains('/sports/') %]  

•  <div class="tout-sdk tout-mid-article"></div>  

     [%- end; -%]  

Add this javascript to the Design / Templates / Components / _Site / macros / option.head.utl file (called in the macro [% opt_headBottom %]).

---

NOTE: propertyUid. and script source will/may vary:

---

[%- macro opt_headBottom(); -%]  

   <script>window.TOUT = {propertyUid: "eee12f"};</script>  

<script src="http://platform.tout.com/sdk.js" ;="" async=""></script>   

[%- end %]  

---

NOTE: The platform.tout.com/sdk.js must reference the Tout propertyUid (eee12f or whatever ID is provided) in order for the asset UUID to be matched to the related video. Without a match videos cannot be displayed. A working script and correct ID must be provided.

---

If you are adding Tout Videos to article pages only be sure to wrap the code in logic restricting it to only article pages.

[%- macro opt_headBottom(); -%]  

[% if this.asset.type == 'article' %]      

   <script>window.TOUT = {propertyUid: "eee12f"};</script>  

<script src="http://platform.tout.com/sdk.js" ;="" async=""></script>

   [%- end %]  

[%- end %]  

Add this meta tag (which has the article id) to the Design / Templates / Components / _Site / macros / option.head.utl file (called in the macro [% opt_headBottom %]).

---

NOTE: Used to match an article to a Tout video by UUID

---

[%-   

/** Tout article id meta property */   

if this.asset then cms.page.add_meta('name':'article:id', 'content':this.asset.uuid, 'ns':'tout');   

-%] 

Create a new custom block with the code below, and add it to the index pages where the site wants the Tout video block to display:

---

NOTE: Class names may vary per individual setup as will feed IDs.

---

Use this code to create a custom block called Tout | custom-tout | Video

<div data-tout-feed-uid="72cceef" class="tout-sdk tout-right-rail-embed"></div>