PermaLinkHow I Modified BlogSphere For My Resources Site, Part 1: The Features
09:01:04 AM

I mentioned yesterday that the new Notes & Domino Community Resources site I put up is based on a modified version of the BlogSphere template. Today I'll explain the modifications that I've made.

Let's start at the beginning, with something that isn't actually a template modification. BlogSphere normally launches to a Navigator in order to force a Navigator Template form to be invoked. The Navigator Template embeds a view. This is a well-known workaround for the fact that Domino doesn't support a launch option that specifies a particular view. The embedded view brings in the HTML from most recent articles that have been published. I'm not, however, using a chronological navigation motif for this site. I'm using menu navigation instead. You may ask "Why use BlogSphere for this?" and my answer is two-fold. First of all, I like the way the BlogSphere template manages CSS and layout, and secondly... it could be done, so why not? :-) Solving the launch problem was done simply by creating a URL Redirection mapping entry in the Web Configurations view of the server's Domino Directory, and pointing it to the URL of a static page that I created in the BlogSphere-based resources.nsf database.

Now, let's get to the actual template modification...

The most recent version of BlogSphere, version 1.3.1, has a new DbLookup block feature. It's very useful, but it's mis-named, however, because it really does an @DbColumn call to get the block contents, not an @DbLookup call. You can use it to pull a column of HTML from any view in any accessible database on the server into one of the left or right blocks in your blog layout. I had originally requested this feature from the BlogSphere team in order to enable me to do things like pull in the BlogRoll in my blog from my Bloggregator database, which I use to read a few hundred RSS and Atom feeds in the Notes client. I'm way too lazy to keep long lists of URLs in two places! The disadvantage of using an @DbColumn instead of an @DbLookup to populate a list in a block, however, is that you'll need to have a separate view for each block, and I wanted to divide my blogroll into categories for "Domino Bloggers", "Other Bloggers", "News Feeds", etc. I only had one view, categorized, for that in my Bloggregator database.

Now, for my new Power of The Schwartz blog, I worked around the @DbColumn limitation quickly simply by adding some new views to the Bloggregator database, but I definitely wanted a better solution for the Notes & Domino Community Resources site. In this case, I want to do my lookups of information that is stored within the BlogSphere-based resources.nsf database itself, and I don't want to load that database down with a large number of additional views. I want to use a single categorized view, so I implemented a true @DbLookup feature in the template.

Here is where I'm using the feature:

Block-based Menu Navigation

The first of the two blocks, the "Resource Categories" block, is an HTML block. I could have coded this as a @DbColumn, and I may go back and do that at some point, or I may not. As it stands now, simply adding a new category to a document in the database isn't sufficient to get that category to show in the Resource Categories list, and this might actually be a good thing. For now, I figure that hidden categories may come in handy and this makes it easy, and since the number of categories is going to stay small the inconvenience of maintaining this block by hand is tolerable. The second block shown above is empty except for a heading that says "No Category Selected". If you click on one of the entries in the "Resource Categories" block, e.g., "Spam", two things will happen.

Block-based Menu Conditional Dependent Display

The title of the second block has changed to "Spam", and the body of the block has been populated with a list of relevant resources. The second block is conditionally dependent on the first.

If you take a careful look at the original URL (generated by the redirection mentioned earlier), and the changed URL after the click on "Spam", you will undoubtedly get a pretty good idea of what I did:

The original URL:

The new URL:

In both the redirection and in the HTML code within the "Resource Categories" block, I've added a &ShowBlock argument to what is otherwise an ordinary-looking Blogsphere URL. The @DbLookup feature had required that I add a lookup key to the block configuration, and what I did was give myself two options. The key can be configured directly in the block definition within the database, or the key can be indirect, which means that it is pulled from a URL argument whose name is configured in the block definition.

Implementation of the conditional indirect @DbLookup feature required modifications in several places.

  • The Block Definition form
  • The D6 Sideblocks subform
  • The Lookups\leftblocks and Lookups\rightblocks views
I'll describe the actual code changes in a follow-up post soon. There's no rocket science to the changes, though. If you've explored the code in the BlogSphere template, you can probably guess what I did -- or even come up with a better way :-)

The other things I did to implement the Notes & Domino Community Resources site didn't involve template changes. The "Suggest Resources For This Site" block is simply an HTML block containing a link to an ordinary Blogsphere article. It hard codes the &ShowBlock argument value and actually does specify a category that I keep hidden otherwise. The linked article simply says "Use the comment form below to suggest resources". This is a case of data masquerading as design. One thing you may notice is that even though there are no comments currently entered (a situation that I hope changes soon!), you won't see the "No documents found" message.

Hiding Documents Not Found Message

I used a simple variation on one of the many documented techniques for accomplishing it. I simply added the following little bit of CSS to my configuration:

.StoryContents H2 { color: red; visibility: hidden; }

This, unfortunately, leaves the empty box that would otherwise surround the "No documents found" message (or the comments if there were any) visible. I'll work on that eventually.

There's one more neat thing that I did, which you can see in this graphic.

Hiding Documents Not Found Message

If you refer back to the URLs I showed above, you may notice that they refer to documents in the "htdocs" view. If you're a BlogSphere user, you'll recognize that documents in that view are "static pages". They can be composed either as Notes rich text, or as HTML. When you click on a new category on the Resources site, the change in the conditionally dependent block -- which was originally the only change that occurred -- is easy to miss. In order to give a more obvious visual cue that a user has successfully switched categories, I figured I had to change something else. I could have created one static page per category and set up the links in the Resource Categories block to switch between them, but using a single dynamic page seemed like a much better idea. It seemed that way initially, that is, until I actually tried to make a static page behave dynamically. For a variety of reasons (good ones, I'm sure), BlogSphere does not leave your Notes rich text alone when you save either a story or a static page. It processes it by saving it in MIME format and then extracting the HTML rendering into a text field. Unfortunately, this processing loses passthru HTML. I wanted to use a computed text element to create the dynamic behavior, but knowing that passthru HTML doesn't work I figured that computed text wouldn't work anyhow. I didn't test this (I think I mentioned being lazy already :-)), but since I wanted to use passthru to precisely control the formatting anyhow it didn't make sense to go down that road anyhow. So, the dynamic part of the page, where it says "Selected Category: Spam" is generated by JavaScript code that reads the URL and pulls out the information from the &ShowBlock argument. Here's the JavaScript

<script type="text/javascript"><!-- uri = location.href; indx = uri.indexOf("&ShowBlock="); if ( indx > 0) if (uri.substr(indx+11) != "None") document.write("Selected Category: " + URLDecode(uri.substr(indx+11))); //---></script>

I've left out the defintion of the URLDecode function. I used a modified version of the code that I found on this handy URLEncode/URLDecode page. The modification was simply to make their function take an argument and return a value instead of working directly with the field elements on their form through the DOM.

There are a lot of little hacks in the Notes & Domino Community Resources site, which is typical of a lot of my work. I'm fine with a little pragmatic hacking to get a job done quickly and effectively. As far as I know, these particular hacks do what I want them to do. If they don't, tell me, and I'll fix them :-)

This page has been accessed 522 times. .
Comments :v

1. Ray03/30/2005 02:09:59 PM

Hi Richard,

Just to let you know at least I read your Blog!

I have a few days R&R and downloaded the latest version that Christian and Dec worked on. I have made all of my alterations and I am a happy chappy. I should create a page as you did to show my changes. Basically I add a field called "StoryNoProcessing" that I use for pure rich text that does not go into RSS etc. It's basically a Static page but so much more.

In the Static pages I have and extra status for an Iframe. Here is a link but the shop is way out of date . I have a new (free!) copy af Actinic V7 (CGI with Perl on Domino) I recieved today that I will use to update the shop. The iframe will allow me to display any web site like a Domino Teamroom in the blogsite!

I have other small changes as well.

I may just blog about it!


2. Christoph07/02/2007 07:11:14 AM

Hi all,

maybe this is the wrong place to write about my problem in adding a new static page in Notes. It simply doesn't work at ends with the message: "field: 'permalink': incorrect data type for operator or @function notes".
Do you know something about this? All other items work correctly in notes.
Notes rocks!

Blocked Response!04/09/2008 03:51:34 AM

This response from IP Address was blocked by the owner of this blog.

4. ylq jake08/17/2017 04:47:19 AM,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,

Enter Comments^

Email addresses provided are not made available on this site.

You can use UUB Code in your posts.

[b]bold[/b]  [i]italic[/i]  [u]underline[/u]  [s]strikethrough[/s]

URL's will be automatically converted to Links

:-x :cry: :laugh: :-( :cool: :huh: :-) :angry: :-D ;-) :-p :grin: :rolleyes: :-\ :emb: :lips: :-o
bold italic underline Strikethrough

Remember me    

Monthly Archive
Responses Elsewhere

About The Schwartz


All opinions expressed here are my own, and do not represent positions of my employer.