s9y themes - Important

The Theme Contest

nospam@example.com (Garvin Hicking) — Wed, 08 Feb 2006 11:29:41 +0100

On this page you can see the competing entries. They are named after their creators and are numbered. Please select the theme you want to see in the dropdown on the left. You can also log in to the backend on the right, which will use your currently selected template. If the backend area does not change after you selected a different theme, please hit the RELOAD key in your browser.

These are the theme contributions:

Carl Galloway

David Cummins

Garvin Hicking

Current Default Template for Reference

The four themes can be fully downloaded here: s9y-theme-contest.zip

Voting and the vote procedure takes place on the forums: VOTE HERE

Comments and trackbacks

nospam@example.com (Jannis Hermanns) — Wed, 25 Jan 2006 01:25:42 +0100

Unlike other blogging engines the Serendipity designers have produced two different modes of displaying comments, either linear or threaded. Linear mode displays all comments in the order they were created, whereas threaded mode allows the comment author to select a parent comment that their reply applies to. The inspiration for this came from the many forums and guestbooks in use today, and allows your blog users to see at a glance which conversations are generating the most interest.

Trackbacks to your entries are automatic with Serendipity and in most cases your readers will never need to use a dedicated trackback address (URI).

Are you writing a new theme for Serendipity? If so, comments and trackbacks can be arranged in many different ways by changing your CSS in the template stylesheet or by altering the Smarty Templating files.
Continue reading "Comments and trackbacks"

Form elements

nospam@example.com (Jannis Hermanns) — Sun, 22 Jan 2006 17:47:43 +0100

Serendipity includes form elements within posts (comment form) and within sidebars (quicksearch, template chooser). As theme designers we should be aware of these and style our themes appropriately.

Form elements are input boxes, select drop downs, textareas, checkboxes, radio buttons, submit buttons etc. All of these elements are styled automatically by your browser, but can take on properties from their parent container. For this reason you owe it to your users to test them, and if necessary, to style them.
Continue reading "Form elements"

The 'continue reading' byline

nospam@example.com (Jannis Hermanns) — Fri, 20 Jan 2006 18:52:36 +0100

The continue reading "post title" is a tricky little devil, and in the default theme has no extra styling. In fact it is just part of .serendipity_entry_body, however, blogging is deeply personal and every user has different needs.

You should notice that some of the themes on this site don't style the 'continue reading' byline so it appears directly after the content, often breaking the designers hard work.

My belief is that the entries.tpl needs to be amended and the continue reading code needs a <p> placed around it. I also tend to add an additional class to my byline so that I don't have to worry that my paragraphs elsewhere will be affected. Lets assume you add the <p>, your entries.tpl code could look like this,



<p class="continue_reading"><

a href="{$entry.link}#extended">

{$CONST.VIEW_EXTENDED_ENTRY|

@sprintf:$entry.title}</a></p>

Now simply create the following style in your stylesheet,



.continue_reading {

     clear:left; }

This has the advantage of also allowing further styling, so you could for example change the color or add an image.

Images aligned right

nospam@example.com (Jannis Hermanns) — Thu, 19 Jan 2006 20:14:17 +0100

All of the images on this page are aligned right using media manager. I have deliberately added text around these images to space them out because otherwise they tend to ruin the page. Check out the photogallery to see it is possible to completely break a page.
Continue reading "Images aligned right"

Images aligned left

nospam@example.com (Jannis Hermanns) — Thu, 19 Jan 2006 20:12:08 +0100

All of the images on this page are aligned left using media manager. If the two top images are sitting too close together adjust the margin or padding around them. If the second image is sitting to the right of the first image then you may wish to add a 'clear:left;' to .serendipity_entry_extended
Continue reading "Images aligned left"

Images aligned to top

nospam@example.com (Jannis Hermanns) — Thu, 19 Jan 2006 20:06:48 +0100

All of the images on this page are aligned to top using media manager. Notice the difference between images without a caption (left-aligned) and those with a caption (centered).
Continue reading "Images aligned to top"

Using the quicksearch function

nospam@example.com (Jannis Hermanns) — Thu, 19 Jan 2006 20:02:53 +0100

Serendipity blog comes with an excellent search tool that allows users to find all posts that contain a certain word within your blog. As theme designers we need to be aware of how the quicksearch plugin works, and how to style the results appropriately.

At some time almost every users has noticed that the quicksearch tool doesn't work as expected, often because it can't find a result for a word the user knows to be in their entries. The quicksearch function relies heavily on the a similar php function, and a design feature of the quicksearch is that a word that appears in every post should not produce any results, after all what is the point simply reproducing the archives page.

To test the two different results that a user will experience, try searching for 'pluto' and 'column', now search for one of these words spelt incorrectly. If your theme is fully compatible with serendipity blog you should be happy with the results.