Dynamic page layouts

In this chapter, you'll learn how to create dynamic page layouts that change automatically when a staff user clicks on a check box on the Article Edit page. 

The example we show here features an Article Type with a custom switch 'breaking_news'. This custom switch can be added to the Article Type in the Newscoop administration interface. The journalist or editor then sees a checkbox for 'breaking_news' in the Article Edit screen, which they will click whenever they consider the story they are working on to be particularly important.

The result of a staff user clicking this checkbox can be detected in the template. Inside list_articles a constraint is added, collecting only articles where the custom switch called 'breaking_news' is turned on. If there's an article that fulfills that criteria, then it's listed. If not, the layout remains the same:

{{ list_articles length="1" ignore_section="true" order="bypublishdate desc" constraints="breaking_news is on" }} 

That tells $gimme to list one article with the following constraints:

• Display articles regardless of the section they're in
• Present the articles in descending chronological order according to their published date
• Only display articles where the "breaking_news" custom switch is on

The whole template looks like this:

{{ list_articles length="1" ignore_section="true" order="bypublishdate desc" constraints="breaking_news is on" }} <div id="breakingNews">     <h3><a href="{{ uri options="article" }}">{{ $gimme->article->name }}</a></h3>     {{ list_article_images length="1" }}     <div id="breakingNewsLeft">         <img src="{{ uri options="image width 435" }}" alt="{{ $gimme->article->image->description }}" />         <p class="footnote">{{ $gimme->article->image->description }} {{ if $gimme->article->image->photographer }}(Photo: {{ $gimme->article->image->photographer }}){{ /if }}</p>     </div>     {{ /list_article_images }}     {{ if $gimme->prev_list_empty }}     <div id="breakingNewsLeft">         <img src="/templates/images/breaking-news-{{ $gimme->language->code }}.jpg" alt="Breaking news" />     </div>     {{ /if }}     <div id="breakingNewsCenter">         {{ $gimme->article->publish_date|camp_date_format:"%M %e, %Y" }}         <p>{{ $gimme->article->deck }}</p>     </div> </div> {{ /list_articles }} 

For more on using custom switches, see the chapter titled Topics, switches, keywords to structure content.