Community Server on my mind

Add/Remove buttons from the Paperclip Theme

If you run your blog at the root as I do, you might want to get better use of the toolbar of the blog. In my case I use a modified version of the Paperclip theme.

As you can see in the picture above, I have modified the toolbar by adding 2 buttons (Media and Downloads). Since I use feedburner as RSS feed, I really could also remove the Atom 1.0 button together with the RSS 2.0 button and add one Subscribe button or similar.

To add or remove buttons from this toolbar, open up the LayoutTemplate.acsx under the /Themes/Blogs/Paperclip/ directory and look for the section containing:

<div id="nav">
	<div id="navbar">
		<ul>
			<Blog:HomeLink runat="server" id="Homelink1" />
			<Blog:ContactLink runat="Server" id="Contactlink1"/>
			<Blog:AboutLink runat="Server" id="Aboutlink1"/>
			<Blog:RssLink id="rss" runat="Server" />
			<Blog:AtomLink id="atom" runat="Server" />
			<Blog:ControlPanelLink id="cp" runat="server" />
		</ul>
	</div>
</div>

As you can see, here we'll find a row for each button showed on the blog. Now let's say I want to add the Media button that you can see on the picture above. The Media button should be linked to my Video gallery. So I change the section in LayoutTemplate.ascx to:

<div id="nav">
	<div id="navbar">
		<ul>
			<Blog:HomeLink runat="server" id="Homelink1" />
			<Blog:ContactLink runat="Server" id="Contactlink1"/>
			<Blog:AboutLink runat="Server" id="Aboutlink1"/>
			<Blog:RssLink id="rss" runat="Server" />
			<Blog:AtomLink id="atom" runat="Server" />
			<li><a href="/forums/videos.aspx">Media</a></li>
			<Blog:ControlPanelLink id="cp" runat="server" />
		</ul>
	</div>
</div>

I just add a <LI> tag with a link within it. I save the LayoutTemplate.ascx, and when I go back to my blogs home page, there's the new button. Simple, right?

I have always found it hard to find the regular navigation bar for the whole CS site on most of the blog skins I have tried. So using just the blog toolbar is for me a better option. You could delete the regular CS navigation bar from your blog by editing the Skin-BlogSideBar.ascx in the /Themes/Blogs/Paperclip/Skins/ directory. From that file, remove the following snippet:

<div id = "NavSideBar">
<h3><cs:resourcecontrol runat="Server" resourcename="mainnavigation" id="RC1" /></h3>
<cs:navigationmenu runat="Server" id="nm" />
</div>

The procedures in this article should be very similar if you want to do the same with another CS Blog Skin, depending on how it's built of course.