Using Serendipity as CMS for Small Websites

This is a short tutorial, it might not even be a tutorial really, but the information is solid. Let me give you a bit of background. Now and again we (Ceejay and I) do webdesign for small business, mostly 4 or 5 page websites.

An issue we frequently come across it that if we use static HTML pages, then either we need to update the pages when the site owner needs it, or the site owner needs to learn HTML to do this themselves.

Our latest project is a site that only has static pages, it also needs to be multilingual, and the site owner wants to be able to update the pages herself, and this is the sticky point, she doesn’t want to learn HTML. She has her reasons, she’s busy running a business and these days with WYSIWYG being so ubiquitous she shouldn’t be forced to learn HTML.So, what I’ve done for her is create a website using Serendipity, then I changed entries.tpl so that it removes the link around the title, then I removed all of the entry footer stuff, and also everything to do with comments, trackbacks, the comment form, and even the page footer.

In fact the new entries.tpl looks like this;

{foreach from=$entries item="dategroup"}
{foreach name="dategroup" from=$dategroup.entries item="entry"}
<h3 class="serendipity_title">
{$entry.title|@default:$entry.id}</h3>
<div class="serendipity_entry">
{$entry.body}
</div>
{if $entry.has_extended}
<div class="serendipity_entry">
{$entry.extended}
</div>
{/if}
{if $entry.is_entry_owner and not $is_preview}
<br /><a class="edit_entry" href="{$entry.link_edit}">
{$CONST.EDIT_ENTRY}</a>
{/if}
{/foreach}
{/foreach}

As you can see, very short and sweet yet also very effective for giving the appearance of being a regular static page.

The next step is to create a theme layout with a configurable navbar, or two in this case, one each for the two languages being used, then simply link to the relevant post, er page, and wow, suddenly you have the makings of a static CMS.

Those of you who know Serendipity will be wondering how to get the respective navbars to show up, well that’s the easy part, in index.tpl, simply add a couple of lines of smarty like this;


<ul>
{if $lang=="de"}
{foreach from=$navlist item="navlist"}
<li><a href="{$navlist.href}" title="{$navlist.title}">
{$navlist.title}</a></li>
{/foreach}
{else}
{foreach from=$navlinks item="navlinks"}
<li><a href="{$navlinks.href}" title="{$navlinks.title}">
{$navlinks.title}</a></li>
{/foreach}
{/if}
</ul>

Note that each of the navbars has a different name, one is navlist, the other is navlinks. Each navbar can now be correctly set to the respective languages within the theme config screen and since Serendipity correctly handles UTF-8 you don’t need to worry about anything getting screwed up.

To make this work correctly there are two final things you need to do. The post, er page, that is going to be your homepage should be set to sticky. Also, make sure you change the default number of posts to display from 15 down to 1, otherwise you’ll get all of your pages on the first screen and this defeats the purpose of the entire tutorial. Good luck.

Comments are closed.