From BBlog

bBlog v.7 Template Documentation

Overview

bBlog's template system uses the Smarty templating library. This provides an easy to use templating system, while maintaining great power. Templates are stored in the directory bblog/templates/template-name where template-name is the name of the template set in your options admin panel.

Inside that folder are a collection of templates such as header.html, index.html, footer.html and post.html. Also there is a css file there, lines.css.

When a visitor goes to the blog index page (index.php) the index.html page is displayed, which means all Smarty tags are changed into HTML. Inside index.html are Smarty tags which include the header.html file, get recent posts and any other plugins.

An example of a Smarty tag is

   {include file="header.html"}

It should be fairly clear, the header.html file is included in the index.html file, replacing the Smarty tag. A great feature of Smarty is that it compiles the templates which means that the templates are converted into pure PHP files and stored for use rather than converting the tags every time the page loads.

A good place to learn more about Smarty is the website at http://smarty.php.net/ . There is documentation there over and above the bBlog specific tags. There is also a forum, however please don't ask them any bBlog specific questions, they should be directed at the bBlog forum.

Creating a new template

Best to start from an existing template - duplicate it's folder in the bblog/templates/ directory, and rename it. The gotcha here is that there are limitations on what you can rename it. Stick to an alphabet (no numbers) string, less than 8 characters, and you should be fine. You will then be able to select this template from the Admin->Options page. If your new directory/template doesn't appear as an option, it could well be that it's named something the system doesn't understand.

To install someone else's new template, just unpack it in the bblog/templates/ directory, and since its name is already OK (presumably), it will appear as a template you can select from Admin->Options

General Syntax

The { character signals the start of a Smarty tag and the } character signals the end.

TIP: if you want to use javascript or the { or } characters in your templates this will confuse Smarty, so surround the javascript with the {literal} {/literal} set of tags.

Lets break down a couple of sample tags :

• 1 - {$comment.body|nl2br}
• 2 - {links cat="navigation"}

The first tag is a type of tag called a variable . A variable tag has the symbol $ after the { symbol. That particular tag outputs the main text ( body ) of a comment. However after ther $comment.body there is the | (pipe) character and nl2br. The |nl2br after a variable is called a modifier. A modifier's purpose is to change the variable some way, usually formating. In this case, the modifier is called nl2br and converts carriage returns ( pressing enter ) into html breaks ready for the web page.

The second tag is called a function plugin and performs some action, in this case fetch a list of links out of the bBlog database. The cat="navigation" part of the tag tells the links plugin to only return links in the navigation section. ( Links are arranged into sections ).

There are are few other types of Smarty plugins, but at this stage they are not used in bBlog templates.

Conclusion

I hope this guide has proved helpful, and I think when you get the hang of Smarty templates you will agree that bBlog being Smarty centric makes creating templates for bBlog with Smarty easy, flexable and powerful.

Happy bBlogging!