Try Now
More in this section
Blogs RSS feed

Tags (aka Categories) for Sitefinity Blogs

by Ivan Osmak
This post explains how to implement tags functionality for Sitefinity blogs. Note that this functionality on blogs.sitefinity.com is called "Categories", however from version 3.1 due in mid September tags and categories will be something rather different.

The idea of this post is to show how to achieve this functionality, which is not yet part of the standard Sitefinity installation, but will become part of it in version 3.1

Tags functionality explained

The idea of tags is to be able to tag any blog post with one or more tags. All the tags are displayed on the pages through a Tag control. When user clicks on any of the tags she will see the list of all posts.

Admin side

First thing we need to do is find a way to attach tags to the blog posts. The obvious way to do this is to add Tags meta field to Blogs module. When it comes to choosing tags we want to be able to choose from the already existing tags and don't want to type tags every time. So the control that will provide Tags metadata for blog post will be a custom control, which will open RadWindow when we click select tags. Take a look at the screenshots below to see what I mean.

Tags Admin UI

Public side

The public side of tags functionality is very similar to the one I've already explained in Archives. We have two controls here :
  • Tags control - displays all tags and has one important property "TagsPageUrl" which is the url of the page that holds TagsPostList control.
  • TagsPostList control - display all posts tagged by a particular tag. This is a user control that simply wraps Telerik.Blogs.WebControls.PostList control and sets its CustomDataSource property to display only posts tagged with a particular tag.
To see how this works, take a look at the following diagram :

Tags Page / Controls structure

Step-by-step instructions for implementing tags functionality

1. Download the needed files to your computer from here.

2. Unzip the file, you should see six folders :
  • Temp.Tags
  • Temp.Tags.Data
  • UserControls
  • MyPages
  • ModifiedTemplates
  • NewTemplates
3. Folders Temp.Tags and Temp.Tags.Data are VS Projects. This two projects provide needed funcionality for working with tags (adding, deleting, editing, selecting...). Temp.Tags project also contains TagInput control which you will use to select tags for the post. Add these two projects to your website and in effect create a solution.

4. Reference these two projects from your web site.

5. Build solution, if build fails make sure projects have correct references (reference to your local files/versions)

6. Open web.config and in meta fields for blogs add Blogs.Tags meta field. The line should look like this :
<add key="Blogs.Tags" valueType="ShortText" visible="True" sortable="False" searchable="False" defaultValue=""></add> 

7. While in web.config add section for tags in sectionGroup name="telerik". The line should look like this :
<section name="tempTags" type="Temp.Tags.Configuration.SectionHandler, Temp.Tags" requirePermission="false" /> 

8. Still, in web.config add tempTags section. Make sure it's immediate parent is <telerik>. The section should look like this :
<tempTags defaultProvider="Sitefinity"
        <add name="Sitefinity" type="Temp.Tags.Data.DefaultProvider, Temp.Tags.Data" connectionStringName="DefaultConnection" visible="true" tagInputTemplate="~/Sitefinity/Admin/ControlTemplates/Tags/TagInput.ascx"></add> 

9. Next thing we need to do is modify the edit/insert templates for blog posts so that they can be tagged. Open folder ModifiedTemplates that came in the zipped file. If you have not changed the default templates (in folder ~/Sitefinity/Admin/ControlTemplates/Blogs/) that came with Sitefinity you can overwrite them with those two, otherwise you'll have to make changes manually. If you are making changes manually you'll need to register the TagInput control like this :
<%@ Register TagPrefix="sfTempTags" Namespace="Temp.Tags.WebControls" Assembly="Temp.Tags" %> 
and also add the control to the page (it is above the publication settings control, so you can see how it is done).

10. Copy the folder Tags which is inside of the NewTemplates folder to folder ~/Sitefinity/Admin/ControlTemplates. Inside of this folder you'll find only one file TagInput.ascx which is the external template for TagInput control (this control is in Temp.Tags.WebControls). NOTE : Do not copy NewTemplates folder, only the Tags folder inside it.

11. Copy the folder MyPages which came with the zipped file to ~/Sitefinity/Admin folder. This folder contains page for working with tags that is opened in RadWindow.

12. Now all you need to do is upload and set up public controls. The principle here is exactly same as for the archives, so you read this post if you need more information on how to do that.

And that's it...


Obviously, this is not the perfect tags solution, hence the Temp prefix to it. In Sitefinity 3.1 a much more powerful tags implementation will be provided by default, but till then I hope this'll work. Also, when 3.1 comes out I will try to provide a user control to transfer your tags.

If I have forgot something or you have any additional questions, please do not hesitate to comment. :)

1 comment

Leave a comment
  1. Ben Jul 17, 2007
    Thanks for all the hard work. Sincerely, Ben

    Leave a comment