How do you create a news archive in umbraco?

Question

I'm trying to create a news archive in umbraco, where it would display a list of news pages organised by month. Each page would display a listing of the news items of that month.

I've followed the tutorial for creating news items, but I'm not sure how to create an archive. There doesn't seem to be any references to do this online either. Surely it's a common use case for the CMS.

Anyone have any ideas (preferably in razorscript if coding is required)?

Answer 1

I ended up using the datefolders package, which automatically sorts the news items into the correct year and month folder based on a predefined date field, much like @amelvin response. The benefit of datefolders is that it simplifies the user having to manually sort their articles into the right folder and maintain that organisation. They can just right click the news container item, create the article, set the date, and it'll just appear in the right folder. Also, it changes the folder when the date is changed.

In terms of the display of the archives, I had the following razor code, where NewsListing is the news items listing document type, and NewsItem is the news item document type:

Archive listing in the sidebar

<umbraco:Macro runat="server" language="cshtml">
@{
  dynamic newsListingNode = Model.AncestorOrSelf(1).DescendantsOrSelf("NewsListing").First();
}
<div class="archive">
  <ul>
    @foreach (var newsYear in newsListingNode.Children)
    {
      foreach (var newsMonth in newsYear.Children)
      { 
        @* Use format time to get the month string *@
        dynamic dateLabel = umbraco.library.FormatDateTime(newsYear.Name + " " + newsMonth.Name + " 01", "MMMM yyyy");

        <li><a href="@newsMonth.Url">@dateLabel»</a></li>
      }
    }
  </ul>
</div>
</umbraco:Macro>

Month archive page

  <umbraco:Macro runat="server" language="cshtml">
    @* Check the it is a month folder *@
    @if ((@Model.NodeTypeAlias == "NewsDateFolder") &&
         (@Model.Up().NodeTypeAlias == "NewsDateFolder") &&
         (@Model.Up().Up().NodeTypeAlias == "NewsListing")) 
    {
        dynamic newsMonth = Model;
        dynamic newsYear = Model.Up();

        dynamic dateLabel = umbraco.library.FormatDateTime(newsYear.Name + " " + newsMonth.Name + " 01", "MMMM yyyy");

        <div class="news">
          <h2>News archive: @dateLabel</h2>
          @{
            dynamic newsItems = Model.DescendantsOrSelf("NewsItem").OrderBy("sortDate desc");
          }
          @foreach(var newsItem in newsItems) {
            <div class="block-content">
              <h5><a href="@newsItem.Url">@newsItem.Name</a></h5>
              <p>@newsItem.summaryText</p>
              <a href="@newsItem.Url">more»</a>
            </div>
          }
        </div>

    }
  </umbraco:Macro>

Answer 2

The most obvious solution in Umbraco would be to arrange your folder structure in the 'Content' section to match how you want the site to arrange items and then use simple xsl transformations to build the index pages.

Code two templates ('Settings' section), one to show the index for each month and another to display the individual article.

So a folder structure like:

> Content 
> |--Home
>     |--2011
>         |--01 January
>             |--News article 1
>             |--News article 2
>             |--News article 3
>             |--News article 4
>         |--02 February
>             |--News article 5
>             |--News article 6
>             |--News article 7

Then use some simple xsl added as a macro to the index template (similar to the following) to run round the news articles (I got this from umbNewsListItems.xslt which I think came from the news sample site):

<xsl:template match="/">

<!-- The fun starts here -->

<div class="newsList">
<xsl:for-each select="$currentPage/* [@isDoc and string(umbracoNaviHide) != '1']">
  <xsl:sort select="@updateDate" order="ascending" />
   <h3 class="headline"> <a href="{umbraco.library:NiceUrl(@id)}">
      <xsl:value-of select="@nodeName"/>
    </a>
  </h3>
  <small class="meta">Posted: <xsl:value-of select="umbraco.library:LongDate(@updateDate, true(), ' - ')"/></small><br/>
  <p class="introduction">
    <xsl:value-of select="umbraco.library:ReplaceLineBreaks(introduction)" disable-output-escaping="yes"/>
  </p>

</xsl:for-each>
  </div>

</xsl:template>