Related Stories {% include 'components/related/related-stories' %}
#
HTML
<div class="grey-section border-both">
    <div class="article-inner">
        <h4 class="related-stories-title">
            Related Stories
        </h4>
        <div class="related-stories">
            <div class="related-story">
                <div class="related-story__image-container">
                    <div class="related-story__image circular-image">
                        <a href="#">
                            <img src="http://placehold.it/160x160">
                            <div class="circular-image-hover">
                                <div class="circular-image-hover__read">Read</div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="related-story__content">
                    <h1 class="related-story__header">
                        <a href="#">Title of article</a>

                    </h1>
                    <div class="related-story__summary">Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150</div>
                    <div class="related-story__meta">
                        <div class="related-story__post-meta">Posted on Jan 15th 2015 by Author Name</div>
                        <div class="related-story__author-image circular-image">
                            <img class="social-share-sticky__avatar-image" src="http://placehold.it/200x200">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="related-stories">
            <div class="related-story">
                <div class="related-story__image-container">
                    <div class="related-story__image circular-image">
                        <a href="#">
                            <img src="http://placehold.it/160x160">
                            <div class="circular-image-hover">
                                <div class="circular-image-hover__read">Read</div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="related-story__content">
                    <h1 class="related-story__header">
                        <a href="#">Title of article</a>

                    </h1>
                    <div class="related-story__summary">Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150</div>
                    <div class="related-story__meta">
                        <div class="related-story__post-meta">Posted on Jan 15th 2015 by Author Name</div>
                        <div class="related-story__author-image circular-image">
                            <img class="social-share-sticky__avatar-image" src="http://placehold.it/200x200">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="related-stories">
            <div class="related-story">
                <div class="related-story__image-container">
                    <div class="related-story__image circular-image">
                        <a href="#">
                            <img src="http://placehold.it/160x160">
                            <div class="circular-image-hover">
                                <div class="circular-image-hover__read">Read</div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="related-story__content">
                    <h1 class="related-story__header">
                        <a href="#">Title of article</a>

                    </h1>
                    <div class="related-story__summary">Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150</div>
                    <div class="related-story__meta">
                        <div class="related-story__post-meta">Posted on Jan 15th 2015 by Author Name</div>
                        <div class="related-story__author-image circular-image">
                            <img class="social-share-sticky__avatar-image" src="http://placehold.it/200x200">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
Twig
<div class="grey-section border-both">
	<div class="article-inner">
		<h4 class="related-stories-title">Related Stories</h4>

		{% for related_story in related_stories %}

			<div class="related-stories">
				<div class="related-story">
					<div class="related-story__image-container">
						<div class="related-story__image circular-image">
							<a href="{{ related_story.url }}">
								<img src="{{ related_story.image }}">
								<div class="circular-image-hover">
									<div class="circular-image-hover__read">Read</div>
								</div>
							</a>
						</div>
					</div>
					<div class="related-story__content">
						<h1 class="related-story__header">
							<a href="{{ related_story.url }}">{{ related_story.title }}</a>
						</h1>
						<div class="related-story__summary">{{ related_story.summary }}</div>
						<div class="related-story__meta">
							<div class="related-story__post-meta">Posted on {{ related_story.date }} by {{ related_story.author }}</div>
							<div class="related-story__author-image circular-image">
								<img class="social-share-sticky__avatar-image" src="http://placehold.it/200x200">
							</div>
						</div>
					</div>
				</div>
			</div>

		{% endfor %}

	</div>
</div>
{
    "related_story_title": "Related Stories",
    "related_stories": {
        "0": {
            "title": "Title of article",
            "date": " Jan 15th 2015",
            "author": "Author Name",
            "summary": "Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150",
            "url": "#",
            "image": "http:\/\/placehold.it\/160x160"
        },
        "1": {
            "title": "Title of article",
            "date": " Jan 15th 2015",
            "author": "Author Name",
            "summary": "Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150",
            "url": "#",
            "image": "http:\/\/placehold.it\/160x160"
        },
        "2": {
            "title": "Title of article",
            "date": " Jan 15th 2015",
            "author": "Author Name",
            "summary": "Sher Bahadur Sole and his wife Thuli survived the Nepal earthquake but their lives were left hanging by a thread in the awful aftermath. Max Chrac 150",
            "url": "#",
            "image": "http:\/\/placehold.it\/160x160"
        }
    }
}