Domino Blog Template - Creating a new Theme Part 2

Steve Castledine  10 November 2006 15:30:00

In part one of this two part series, I showed you have to create the homepage and the services running off it such as the archives and RSS feeds etc. This article will show you how to edit the other parts such as the main document template, comments and search results etc.

There is a link to a download of the template I built at the bottom - in true Blue Peter heres one I prepared earlier style.

Document Template
Because we have created the homepage html and separated our html out into blocks this process is very straightforward. To start we copy the html from our homepage "Page Template" and copy it into our "Document" page template.


Where the tag <$ DXContent $> is located we replace this with the html from our "Default Item" Item template so we have final html as follows:



Save the template and we are done.

Specifying Alternative Document Templates
The default document template as set by the field "Document Page Template" within the Html Templates Wizard (from the default "Recent Content" view - "Wizards/Administration/Site HTML Templates") can be overridden either by the category the document is in (there is an "Overriding Document Template" field within the category documents) or by the document itself.

Images below show the location of the HTML Templates wizard and selecting the default document template.





For our "about" page, we do not want to display information on the document category or allow comments so we can choose another template to use for this instead. First of all we copy our default document "Page Template" and give the copy a name of say "Static Web Page".


We edit the html taking out some of the tags etc:



We then need to assign this new page template to the "about" static web page. So we go into this document (resources/web pages), and goto the tab "Misc" and select the "Static Web Page" template from the "Document Template" field.



Our "about" page now has a unique template (and we can use the same for any other static web pages we create if we wish):



Comments
We have a page template similar to the default document that we use for the page that displays the document and any comments added so far. This template also includes an "Add Comment" form that allows readers to submit their own comments.

First, we need to copy the html content from the "Document" page template to the "Inline Comments Document" page template.


We then need to add the tags to display the comments already entered, in addition to a form to add further ones. We use "<$ DXInlineComments $>" and "<$ DXCommentForm $>" for this.

The "Regulus" theme has the following html for the comments list:



The html is in two parts. The first being the wrapper html and the second the transactional html (each individual comment - highlighted in bold). We place the wrapper html within our comments document template and add the tag where the comments should list:



Comment Item Template

Each comment then is controlled by an "Item Template". From the default template this is called "Comment Item". Paste the html in there that is used for each comment (the html we replaced with the "<$ DXInlineComments $>" tag.


We then need to insert our tags so we have some dynamic content. I have used the following tags (in order of use):

• <$DXCommentNumber$> - Adds an automatic comment count
• <$DXCommentAuthor$> - Displays the comment author
• <$DXCommentEmailLink$> - Displays a link to the comment authors email address
• <$DXCommentSubject$> - Displays the subject of the comment
• <$DXCommentText$> - The actual text of the comment
• <$DXCommentCreation$> - Date/Time comment was posted

I have changed the html around a little, and the following is the finished html in the "Comment Item":



The tag "<$ DXCommentEmailLink $>" by default places a link to the email address of the author using their name as the link. For this example I am going to change this just to say "(email)" and then if they have not posted an email address nothing will show. This change can be made in the configuration document under tabs "Discussion/Basic".

The field "Email Link Option" needs setting to "Text" and then the field "Email Link Text" needs completing with "(email)".



This results in a comment looking like:



Add Comment Form
We need to place the tag "<$ DXCommentForm $>" where we wish our comment form to appear. This is placed in our comment document "Page Template" where we placed our inline comment tag. So we would have the resulting html:



The html that is inserted at the comment form tag is controlled by a template block. In the default template this block is called "Add Comment".


This add comment does not need any form tags as those are inserted automatically. All you need to worry about are which fields you want to use and where you want to place them. The only rules here are on field naming. Fields are placed using standard html such as:



The field names that you must use are (you can miss out email,website if you so wish):

• author
• subject
• email
• website
• textcomment
• submit

I have pasted in the html from the comment form for "Regulus", removed the form tags and made sure the input fields are named correctly. The final html is:



Within the website this now looks like:



You can add code so the system remembers you from a previous posting and adds your name, email and url for you. This will be covered in a separate article.

Month/Category Archive Pages
The next thing we need to do is setup the page template for how the month and category archive pages are displayed. This involves a page template for the general page layout and an item template for each blog entry that appears on this page.

In the default template, the page template is called "Archive". To setup our archive template it is as simple as posting the html from our homepage template into it.


We can then customise our archive page to show what archive we are showing, such as the month/category. We do this using the tag "<$ DXType $>". So I have inserted this as so:



The item template is called "Archive Item" and as with the page template we can copy the html content from another item template "Default Item".


We may wish not to display the full content for each item in the archives. So we can replace the full content tag "<$ DXItemContent $>" with "<$ DXItemDescription $>" to show a shorter version. Users can then click on the link to the item to see it all. This is the resulting html in the archive item template showing this:



The final web page looks like:



Search Page/Results
The last thing we need to configure is the search results page. As before we have done most of the work already, so we need to start by copying the html from our homepage template into the page template "Search Results".


The only thing we need to replace is the tag "<$ DXContent $>" with "<$DXSearchResults$>". Resulting in the html:



As with the archive page, each line of the search results is controlled with an item template. In the default template this is called "Search Results".


The search results item template works in a slightly different way in that it only has a small subset of available tags. These will be dealt with in a separate article. For the purposes of this template we can leave the html intact for the search results:



There are further options around the search results which again I will put in a separate article, however one thing we can do is add html before and after the results. We can do this in the configuration document tab "Search". There are two field "Begin Results Wrapper HTML" and "End Results Wrapper HTML".


I have just added a horizontal rule for now - you could perhaps be more adventurous.


You can find a download of the final database below. A link to a demo is here.

• Comments [13]