Cheese can be a wonderful thing, but not all cheeses are created equal. For example Easy Cheese is filth, whereas Stinking Bishop is pure gold.

The Cheese Macro in Confluence is great, but it’s a bit generic. It obviously wasn’t written with quality or localisation in mind. I find that it’s a bit too limited in scope for my needs.

To resolve this problem, I’ve created British Cheese, a user macro that celebrates the quality milk-based food products of the British Isles.

## Macro title: British Cheese
## Macro has a body: N
## Body processing: n/a
## Output: Selected output option
##
## Developed by: David Simpson <david@davidsimpson.me>
## Date created: 2012-05-08
## Installed by: My Name

## @param Type:title=Variety|type=enum|enumValues=Caerphilly,Cheddar,Cheshire,Cornish Yarg,Derby,Double Gloucester,Lancashire,Red Leicester,Shropshire Blue,Stilton,Wensleydale,White Stilton|default=Shropshire Blue|desc=Choose your favourite British cheese

#set ($url = $paramType.replaceAll(" ","").toLowerCase())

I love <a href="http://www.britishcheese.com/${url}">$paramType</a>!

If you like this user macro but don’t agree that Britain produces the finest cheese on the planet, why not create your own localised version of it. Maybe call it something like {käse} or {fromage}.

Photo credit: Stilton

This post is a short video tutorial that shows how to create custom reports in Webtrends based on custom event tracking and custom dimensions.

An important aspect to note at this point is that in sometimes Webtrends takes a long time to number crunch its reports — long after it reports that data analysis has completed, reports can still be empty.

Be patient. Build the reports, reanalyse the data, then wait (often serveral hours) for the reports to be populated. If you’re using Webtrends On Demand, likely you’ll be used to the waiting for the data analysis job, so will already be conditioned.

How to add a custom report

Check the short video below for details on adding a custom report

Further reading

• Making your first Custom Reports

This post is a short video tutorial that shows how to add custom dimensions to Webtrends.

Having setup event tracking on Webtrends, you’ll likely want to build reports in the Webtrends admin UI. Even after adding event tracking JavaScript, reporting of your dimension or measure doesn’t just happen magically. Webtrends needs to know what to look for. So, before you can create reports, you’ll need to add the dimension.

When creating custom dimensions or measures from events tracked via dcsMultiTrack, example query parameter DCSext.w_custom_identifier will be converted into w_custom_identifier in Webtrends, so this is the name of the query parameter that you then add in the Webtrends Admin UI.

How to add a new dimension

Check the short video below for details on adding new dimensions:

How to add a new dimension based on a lookup table

Lookup tables are a great way of converting one metric into another within Webtrends. The easiest way to create a lookup table is to add a CSV file under the Webtrends installation directory here:
.\wtm_wtx\datfiles\datasources\MyLookupTabel.csv
If you use Webtrends On Demand, then you’ll have to submit the lookup table to Webtrends for them to install.

Check the short video below for details on adding a new dimension based on a lookup table

Recently I was helping a chemistry lecturer with some of her course notes. She authors her course notes in Confluence, then uses the “Export to PDF” functionality to create versions of her notes for distribution to the course participants. This workflow was suiting her nicely until she tried to export her pages.

The course involves mathematics, so she was using the ASCIIMath macro — the newly released Confluence LaTeX plugin would likely be preferable for Confluence 4.x. This macro uses client side JavaScript to render the correct formula to the page.

The ASCIIMath and Confluence LaTeX plugins both do a good job of client side rendering, but this is no good for printing to PDF. On export to PDF, ASCIIMath simply prints the raw LaTeX syntax. For our purposes, this was not acceptable.

The lecturer requested a new macro with the same or similar syntax to the ASCIIMath macro (science academics are often LaTeX geeks), but which successfully exports to PDF. The obvious choice here would be to extend the current ASCIIMath macro with the relevant functionality. In theory, this would fix the lecturer’s problem without her having to update any content. Unfortunately, I didn’t have the time to do this.

Instead, I quickly hacked together a user macro which fits the requirements. Here it is:

“Equation” User Macro

## Macro Name: equation
## Macro Title: Equation
## Categories: Confluence Content, Formatting
## Visibility: Visible to all users in the Macro Browser
## Macro has a body: Y
## Body processing: Render HTML
## Output: HTML
## Icon URL: http://png.findicons.com/files/icons/2394/stroke_text/72/equation.png
##
## Developed by: David Simpson <david@davidsimpson.me>
## Date created: 2012-02-19 v1.0.1
## Installed by: Your Name Goes Here
##
## A very light-weight replacement for the {math} macro.
## It is syntactically more verbose, but should give exactly the same results across browsers and allow for export to PDF.
## Test out your syntax here:
## http://www.forkosh.com/source_mathtex.html#latexmarkup
##
## Usage {equation}x^2{equation}
##
## 1. Raw URL encode the plus signs in the body (this is revisited in step 4.)
#set( $body = $body.replace("+", "%2B") )
##
## 2. URL encode the body (spaces are converted to "+" rather than "%20")
#set( $body = $generalUtil.urlEncode($body) )
##
## 3. Encode the spaces as %20
#set( $body = $body.replace("+","%20") )
##
## 4. Fix double encoding on plus signs
#set( $body = $body.replace("%252B","%2B") )
##
##
## IMPORTANT: After testing, replace "http://www.forkosh.com/mathtex.cgi" belowwith the location of your local installation
##
<img src="http://www.forkosh.com/mathtex.cgi?\gammacorrection{1.25}%20$body">

The user macro above relies on mathTeX and which of course relies on LaTeX. I very much recommend that you install both of these locally. Do not piggy back off of John Forkosh Associates, Inc. installation.

Examples

The examples below use wiki markup (remember that?) to add the equation to the page. For Confluence 4.x users, you can either use insert wiki markup and paste each example into your page as is or remove the {equation} prefix & suffix.

Example 1

Usage:

{equation}x^2{equation}

Output:

Example 2

Usage:

{equation}f(x)=\int\limits_{-\infty}^x~e^{-t^2}dt{equation}

Output:

Example 3

Usage:

{equation}\frac{{d}}{{\left.{d}{x}\right.}}{f{{\left({x}\right)}}}=\lim_{{{h}\to{0}}}\frac{{{f{{\left({x}+{h}\right)}}}-{f{{\left({x}\right)}}}}}{{h}}{equation}

Output:

Example 4

A somewhat more complex example, taken from this page. This time, we get a diagram rather than just an equation.

Usage:

{equation}\png\definecolor{blueblack}{RGB}{0,0,135}\color{blueblack}\begin{picture}(4,1.75)\thicklines\put(2,0.01){\arc{3}{3.53588}{5.8888}}\put(.375,.575){\line(1,0){3.25}}\put(1.22,1.375){\makebox(0,0){\footnotesize$ds$}}\put(.6,.5){\makebox(0,0){\footnotesize$x=0$}}\put(3.36,.5){\makebox(0,0){\footnotesize$x=\ell$}}\dottedline{.05}(1.0,.575)(1.0,1.10)\put(1.0,.5){\makebox(0,0){\footnotesize$x$}}\dottedline{.05}(1.5,.575)(1.5,1.40)\put(1.5,.5){\makebox(0,0){\footnotesize$x+dx$}}\put(1.22,.65){\makebox(0,0){\footnotesize$dx$}}\dottedline{.04}(0.6,1.12)(1.25,1.12)\put(1.0,1.14){\vector(-1,-1){.45}}\put(.58,0.83){\makebox(0,0){\footnotesize$T$}}\put(.77,1.05){\makebox(0,0){\scriptsize$\theta(x)$}}\put(1.18,1.16){\makebox(0,0){\scriptsize$\theta(x)$}}\dottedline{.04}(1.5,1.41)(2.1,1.41)\put(1.5,1.44){\vector(4,1){.67}}\put(2.22,1.59){\makebox(0,0){\footnotesize$T$}}\put(1.95,1.45){\makebox(0,0){\scriptsize$\theta(x+dx)$}}\end{picture}{equation}

Output:

Recap

This user macro is useful for any technical author with Confluence pages containing equations who needs to export pages to PDF. It will also help users who utilise the Scroll Wiki Exporter range of products to publish their content. This user macro is dependent on an external installation of mathTeX which in turn requires LaTeX.

Aside

The code (or at least some of the thinking) behind this user macro would make an excellent fail-back/export solution to bundle with the Confluence LaTeX plugin. I think I’ll open a JIRA…

Thomas Emil Hansen recently wrote How do I write a user macro with “sections” and “panels” using the 4.0 HTML template?

With Confluence 4, the storage format has changed from traditional wiki markup to an XML based storage format. This means that all those old wiki-markup based user macros are now overdue some TLC. Luckily, there’s always the “Insert Wiki Markup” dropdown in the Confluence editor to fall back on.

To convert your macro…

1. Create a new page and use the “Insert Wiki Markup” function to add your wiki markup:

   {section}
     {column}
       $body
     {column}
     {column:width=300px}
       {panel}
         *Contents:*
         {toc:maxLevel=3}
       {panel}
     {column}
   {section}
   

2. Save the page
3. From the Tools menu, select View Storage Format. This will give you:

   <ac:macro ac:name="section">
       <ac:rich-text-body>
           <ac:macro ac:name="column">
               <ac:rich-text-body>
                   <p>$body</p>
               </ac:rich-text-body>
           </ac:macro>
           <ac:macro ac:name="column">
               <ac:parameter ac:name="width">300px</ac:parameter>
               <ac:rich-text-body>
                   <ac:macro ac:name="panel">
                       <ac:rich-text-body>
                           <p><strong>Contents:</strong></p>
                           <ac:macro ac:name="toc">
                               <ac:parameter ac:name="maxLevel">3</ac:parameter>
                           </ac:macro>
                       </ac:rich-text-body>
                   </ac:macro>
               </ac:rich-text-body>
           </ac:macro>
       </ac:rich-text-body>
   </ac:macro>
   

4. Paste this into your user macro rather than the old-fangled wiki markup.
5. Repeat this procedure for all user macros you wish to convert.

From a recent comment on Atlassian Answers, Norman Hills asked “Is it possible to reverse the order in which comments appear?”

This is straightforward if done client-side, so I’ve written it up here.

If you just want to reverse the order for good, browse to Confluence Admin | Look & Feel | Custom HTML

Add this to At the end of the HEAD:

<script>
  AJS.toInit(function(){
    $comments = AJS.$('#page-comments');
    $comments.children().each(function(i,li){$comments.prepend(li)});
  });
</script>

Job done.

For extra points

If you want to be able to reverse the order, then it’s slightly more effort.

Browse to Confluence Admin | Look & Feel | Custom HTML

Add this to At the end of the HEAD:

<script>
  function reverseCommentOrder(){
    $comments = AJS.$('#page-comments');
    $comments.children().each(function(i,li){$comments.prepend(li)});
  }

  AJS.toInit(function(){
    // reverse the comment order
    reverseCommentOrder();

    // add a link to reverse the order
    AJS.$('#comments-section-title').append('<a id="page-comments-reverse" href="#">(Reverse Order)</a>');
    AJS.$('#page-comments-reverse').css({ 'color':'#999','font-size':'0.65em'})
                                   .click(function(e){
      reverseCommentOrder();
      e.preventDefault();
    });
  });
</script>

That’s all. Have fun.

Want to use some “hot” new web fonts to pimp your Confluence wiki?

It’s really straightforward. This post describes a method by which you can change all the headings to use web fonts hosted by Google.

Site-wide web fonts

Using Rokkitt font

Browse to Confluence Administration | Look and Feel | Custom HTML

In At end of the HEAD paste:

<!-- Fonts for headings -->
<link href='http://fonts.googleapis.com/css?family=Rokkitt:400,700'
      rel='stylesheet' type='text/css'>
<style>
#com-atlassian-confluence h1,
#com-atlassian-confluence h2,
#com-atlassian-confluence h3,
#com-atlassian-confluence h4,
#com-atlassian-confluence h5,
#com-atlassian-confluence h6 {
	font-family: 'Rokkitt', serif;
	font-weight : bold;
}
</style>

Please note that adding inline styles is not big or clever, but it is quick and easy for the purpose of this blogpost.

This results in a layout similar to the screenshot below:

Using Leckerli One font

Was that too corporate? Then lets have some handwriting…

Browse to Confluence Administration | Look and Feel | Custom HTML

In At end of the HEAD paste:

<!-- Fonts for headings -->
<link href='http://fonts.googleapis.com/css?family=Leckerli+One:400'
      rel='stylesheet' type='text/css'>
<style>
#com-atlassian-confluence h1,
#com-atlassian-confluence h2,
#com-atlassian-confluence h3,
#com-atlassian-confluence h4,
#com-atlassian-confluence h5,
#com-atlassian-confluence h6 {
	font-family: 'Leckerli One', cursive;
}
</style>

Now, you’ll get something like this:

I’m not sure that this is a good look, but never mind.

Web fonts for a single space

Want to just mess up the fonts in a single space?

Then, duplicate the content of the Google hosted stylesheet — for example http://fonts.googleapis.com/css?family=Leckerli+One:400 and add to the space stylesheet…

Browse to Browse | Space Admin | Look and Feel | Stylesheet.

Click on Edit and paste in:

/* Duplicated from http://fonts.googleapis.com/css?family=Leckerli+One:400 */
@font-face {
  font-family: 'Leckerli One';
  font-style: normal;
  font-weight: normal;
  src: local('LeckerliOne'), url('http://themes.googleusercontent.com/static/fonts/leckerlione/v2/S2Y_iLrItTu8kIJTkS7DrKRDOzjiPcYnFooOUGCOsRk.woff') format('woff');
}

/* Targetting Confluence heading  */
#com-atlassian-confluence h1,
#com-atlassian-confluence h2,
#com-atlassian-confluence h3,
#com-atlassian-confluence h4,
#com-atlassian-confluence h5,
#com-atlassian-confluence h6 {
	font-family: 'Leckerli One', cursive;
}

This will only affect the space in which you add the CSS and will override the global styles.

I’m not sure whether the URL for the font will remain constant in the long term though, so you may have to repeat this process.

Be careful

There are plenty of web font services and many, many fonts to choose from. With great power comes great responsibility, so be careful.

This is the second book by Luke Wroblewski that I’ve bought. His previous Web Form Design: Filling in the Blanks is a book that I’d still recommend to anyone who’s likely to write a <form> tag. However the speed of change in browsing habits has been extraordinary since that book was published in 2008.

This leads us nicely onto his current book — Mobile First. Elaborating on a very concise blogpost from November 2009, it is such a simple idea that almost anyone in your organisation can easily grasp (with minimal persuasion).

Embracing constraints (rather than fighting them) will ultimately get you to better designs

The rise of mobile has lead to very different usage patterns and this book succinctly documents the current state of affairs. For example, Luke describes mobile users’ engagement with content on a mobile device as being —

one eyeball, one thumb

This forces you to remove distractions and simplify the interface to the task at hand — even in distraction free environments, this is helpful.

He quotes usage data from Read it later showing when people are reading saved articles.

• Desktop – builds til noon & falls off after work
• Mobile – 4 peaks – breakfast, commute/start of work, end of work/commute, couch time/prime time/bed time
• iPad – small peak at breakfast, but mostly evening-bed time.

He firmly agrees with Rachel Hinman from Nokia’s analogy –

the desktop is “diving” while mobile is “snorkeling”

My experience would also extent this to rock climbing vs. bouldering too.

There are sections on navigation; touch-target sizing; the familiar topic of form design (use smart defaults); input labeling (top aligned labels are good, labels within text fields sometimes not so); input masks; and responsive design.

I was particularly taken by the chapter on “Organization” (partially for the inclusion of a favourite xkcd comic). This aligns well with the positive changes I’ve noticed in successive versions of mobile applications (e.g. from LinkedIn or Facebook). The first generation of these applications started with a list or grid of navigation options. Subsequent versions of these companies apps emphasize content to be of primary importance so navigational options have become much smarter.

Reading this slender volume suggests that Luke really practices what he preaches. He has embraced the A Book Apart constraints and fitted so much that is currently so very relevant into such a small package.

Here’s a quick and simple timesaver…

1. Open the current Finder folder in Terminal

Setup

Download “> cd to …“, copy it to your Applications folder, and then from the applications folder drag it into the Finder toolbar.

Usage

To use, just click the “> …” button on the toolbar

2. Open the current Terminal directory in a new Terminal tab

Setup

First, we’ll need to add some AppleScript to ~/.profile

# Open a new tab on Terminal with the current  directory
# See: http://elsethenif.wordpress.com/2009/06/11/open-a-new-tab-on-terminal-with-the-same-path-on-mac-os-x/
function nt {
        osascript -e "
                tell application \"System Events\" to tell process \"Terminal\" to keystroke \"t\" using command down
                tell application \"Terminal\" to do script \"cd \\\"$(PWD)\\\"\" in selected tab of the front window
        " > /dev/null 2>&1
}

Usage

In terminal, now type:

nt

3. Open the current Terminal directory in Finder

To get back to the Finder window, type…

open .

And finally…

To wrap it up, a demo video:

When writing plugins using the Atlassian SDK, sometimes the builds take a little while and you go off doing other things. Maybe you’ll get diverted and lose a few minutes.

It would be nice to have some kind of feedback/notification to let you know when the build is a success, fails or just when Tomcat is finally up and running.

On OS X, Growl is my first choice for notifications, so this post shows you how to hook together the Atlassian SDK (well, maven really) with Growl

You will need:

• Atlassian SDK of course
• Growl — a notification system
• growlnotify — a command-line tool to post Growl notifications
• Some pretty icon images

Install all of the above.

The Atlassian SDK acts as a wrapper for maven functionality. It uses a copy of maven 2.1.0 located at:

/path/to/atlassian-plugin-sdk-3.x/apache-maven/bin/mvn

This path appears to be hard coded into a lot of the atlas- prefixed commands, so we have to get a bit hacky and move the original mvn file elsewhere and swap in a new mvn wrapper command.

cd /path/to/atlassian-plugin-sdk-3.x/apache-maven/bin/
mv mvn mvn.DIST

The new mvn file should look something like this:

#!/bin/bash

# See: http://blank.jasonwhaley.com/2009/02/growl-maven-integration.html

mvn.DIST $* | awk '
{
print;
if($0 ~ ".*BUILD ERROR.*")       system( "echo \"Build failed : (\" | growlnotify \"Maven\" --name maven --image /Users/david/Pictures/mvn-growl/fail.png > /dev/null 2>&1"  )
if($0 ~ ".*BUILD SUCCESSFUL.*")  system( "echo \"Build completed successfully : D\" | growlnotify \"Maven\" --name maven --image /Users/david/Pictures/mvn-growl/success.png > /dev/null 2>&1" )
if($0 ~ ".*CTRL-C.*")            system( "echo \"localhost is now available : D\" | growlnotify \"Maven\" --name maven --image /Users/david/Pictures/mvn-growl/atlassian-charlie.png > /dev/null 2>&1" )
}
END {
}'

Note that we’ve got some hard coded image paths here. Store them wherever suits best and update the mvn script.

Add execute permissions

chmod +x mvn

That’s about it really.

Next time you successfully build from maven, you should get this:

A build failure should give this:

When you type atlas-run and Tomcat is ready, you should get this:

I know, this is not exactly a life changer, but it is a really handy way to get some feedback on build progress — particularly for when localhost is ready.

If you have a more elegant solution, let me know.

—

Note:

Here are the icons used:

• RubiksIcons by memoryboy (I just converted them to PNG)
• The Charlie figure was mangled from the Atlassian website
• Growling polar bear (while featured on the home page) by lincolnblues