Hi Greg,

I have trying to see how I can help you and I think I have found a good solution or at least a starting point, where you can build on

In my example I have used the Txt starter kit. The first thing I do is to add the tags proerty editor to the news item documen type.http://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/built-in-property-editors/Tags Then you can add a tag for each news item, (I haven´t found a way where you can more than one tag for each news item therefor it can be a startering point or a soulution if it´s fine that you one have one tag for each news item)

So these lines of code should be place in the Partial view or Partial view macro for the news item

@{
    if (CurrentPage.HasValue("tags")){
        <ul>
            @foreach (var tagItem in CurrentPage.tags.Split(',')){
                <li><a href="@CurrentPage.Parent.Url?tag=@tagItem">@tagItem</a></li>
            }
        </ul>
    }       
}                

And in my case I have given the tags property on my newsitem document type an alias of tags, remember to change it so it match yours alias http://umbraco.tv/videos/umbraco-v7/implementor/fundamentals/document-types/properties/. As you can see I also create a link which link to the news overview page, with a query string of the tag. (e.g news)

Then I have made some change to the news overview where you are displaying the list of your news item.I have made an if else statement to make it possible to show the full news list if there are no querystring in the URL.

But if there is an querystring in the URL then I filter the news items, so it only shows the news that match the querystring. It looks like this:

@{ 
     string filterList = Request.QueryString["tag"];
 }

@if(!string.IsNullOrEmpty(Request.QueryString["tag"])){
    foreach(var item in newsItems.Where("tags == @0", filterList)){ 
     // If the editor has not explicitly provided the "Page title" property page 
                            // then just show the name of the page otherwise show the provided title
                            var title = string.IsNullOrWhiteSpace(item.Title) 
                                ? item.Name 
                                : item.Title;


                            // If the editor has not explicitly set the publishDate property then show the create date
                            var dateTime = item.PublishDate == default(DateTime) 
                                ? item.CreateDate 
                                : item.PublishDate;
                            
                            <section>
                                <h3><a href="@item.Url">@title</a></h3>
                                <span class="byline">@item.SubHeader</span>
                                <ul class="meta">
                                    <li class="timestamp">@dateTime.ToString("f")</li>
                                </ul>

                                @if (string.IsNullOrWhiteSpace(item.Image) == false)
                                {
                                    <a href="@item.Url" class="image image-full"><img src="@item.Image" alt="" /></a>
                                }

                                @Umbraco.Truncate(item.BodyText, 200)

                                <a href="@item.Url" class="button">Continue Reading test</a>
                            </section>    
    
    }


 }

else{

    foreach(var item in newsItems.Where("Visible")){ 
     // If the editor has not explicitly provided the "Page title" property page 
                            // then just show the name of the page otherwise show the provided title
                            var title = string.IsNullOrWhiteSpace(item.Title) 
                                ? item.Name 
                                : item.Title;


                            // If the editor has not explicitly set the publishDate property then show the create date
                            var dateTime = item.PublishDate == default(DateTime) 
                                ? item.CreateDate 
                                : item.PublishDate;
                            
                            <section>
                                <h3><a href="@item.Url">@title</a></h3>
                                <span class="byline">@item.SubHeader</span>
                                <ul class="meta">
                                    <li class="timestamp">@dateTime.ToString("f")</li>
                                </ul>

                                @if (string.IsNullOrWhiteSpace(item.Image) == false)
                                {
                                    <a href="@item.Url" class="image image-full"><img src="@item.Image" alt="" /></a>
                                }

                                @Umbraco.Truncate(item.BodyText, 200)

                                <a href="@item.Url" class="button">Continue Reading in esle</a>
                            </section>    
    
    }
}

The tags in this line below agin refers to the propertyalias of the field where you add the tags.

  foreach(var item in newsItems.Where("tags == @0", filterList)){ 

As I said in the beginning of my post with this solution it's not possible to see news item there has two tags, if it´s okay that your news item only can have one tag this could be a solution that you use.

If it should be possible for a news item to have more than one tag, and still be filterable this could be a good starting point, and then you need to modify it, so it suits your needs.

Hope this helps, and make sense, if you have further questions keep asking and I will try to help if possible.

/Dennis

This looks great... 1 tag per item might be a deal breaker though. I really appreciate the thourough response!

I think what I'm going to do instead is build the tags and pass them to Angular, then use a javascript solution... similar to how Isotope works - http://isotope.metafizzy.co/filtering.html#combination-filters

I'll add some JS paging too. 

I'm going to take a good look at this though.

Hi

I found that if use

foreach(var item in newsItems.Where("tags.Contains(@0)", filterList)){

instead of line

foreach(var item in newsItems.Where("tags == @0", filterList)){

it will work with nodes that has few tags selected

Other thing that one can do is to take nodes that has tag equal to tag that is in query string:

@if (!string.IsNullOrEmpty(filterList))
{
    newsItems= newsItems.Where("tags.Contains(@0)", filterList);
}

and then use foreach loop once only.

is working on a reply...