Mark H's dashboard

Eric beat me too it but I was going to mention http://help.hahlo.com I'm just finalising some things to get Hahlo 3.1 out the door, then I'll get a chance to start customising my Help Center.

http://help.weekly.org/ is a development preview for the new PBwiki Help Center.

I just noticed due to the difference length of #aux-navigation between logged and not logged in states, it renders quite differently (also across different platforms, win, mac).

I have somewhat of a solution for now but would be interested in seeing how others deal with it.

http://help.vurbu.com/

And another one! Hahlo has just added a Help Center.

Thanks for the feedback Leslie! I've incorporated your first suggestion into the Development version of the Help Center ready for the next 'release' after sorting out the sidebar, and I'm also going to attempt to integrate the shopping cart into the help center before releasing build 2.

As for the links, sadly, I don't think my cart solution will let me do that. I'm using Interspire Shopping Cart, which is amazing, by the way.

Thanks! – Mark H, on May 28, 2008 22:26

How odd - not seeing a login-links.t file in my build (v0.5) – Mark H, on May 28, 2008 21:11

Thanks Ted!

I've applied your code to my development edition - it seems to be breaking the footer in some way though - see http://in20pages.co.cc/helpcenterdev/... for an example.

Any ideas? – Mark H, on May 28, 2008 21:07

Mark,

The file you're looking for is called login-links.t

/themes/default/templates/login-links.t

Nice Mark! That's a really great solution to creating a nice seam between your site and the Help Center. I'm keeping my eye open for great examples, and yours is definitely one of them.

I'd like to make a suggestions too. On the main site you call the front page "Home", in help center you call the main page store "Return to Store", you might try "Return to Home" to align that language. The "Contact us" and "Help center" links in the header navigation could also foreshadow the jump to the help center with a slight style variation like an underline or a little jump logo.

Great work!

I agree the sidebars in the sandbox theme are a little strange. Very much a wordpress theme.

Try this.

div.sidebar ul li {
padding: 8px;
background-color: white;
}
div.sidebar ul ul li {
padding: 0;
}


Wow, 60 in 60 would be impressive. One tip for people who are still implementing, if you want to have a live build with a basic design (like my current live one), you can also have a development build with the fancy stuff pre-deployment, running off of a second database.

That's what I'm doing, so I can work on the updates and then push them all out with no weirdness or downtime.

You'll need to empty /templates-c before starting up your dev build!

P.S. Make your first move to go to header.t and replace

<h1><span>{$company_name} Help Center</span></h1>

with

<h1><span>{$company_name} Help Center Development Edition</span></h1>

Trust me - you don't want human error to creep into to a live build

Ha, you can probably point that finger at me, since I did the first pass on the CSS, and formatted it the way that I often work. You can tell I don't often work on very complicated CSS. ;) – Leslie Chicoine, on May 28, 2008 20:38

I'll let you in on a little internal contest we've got going on here, which we're calling "60 in 60." As in, 60 Help Centers implemented in the 60 days after launch. Right now we've got 55 days remaining, and 5 Help Centers implemented, so that's 55 to go.

Not a bad start, but! We could be doing so much better! So If you've implemented Help Center, definitely post it here, let us know, and we'll add you to the list of companies. And especially if you extend or integrate it with your existing systems in interesting ways -- Help Center is an open source app, so we're definitely interested in hearing about and integrating back in significant improvements/additions.

I agree about the CSS spacing. Thor has the inhuman ability to understand CSS with zero whitespace, and I guess that rubbed off on Ted also. Us mere mortals have to resort to digging our eyes out before we can see the code. :p – Scott Fleckenstein, on May 28, 2008 19:03

I'd certainly love to see this feature too... canvas would be preferable, but images side by side is a good (and understandable) comprimise considering the Plasq's other products.

I'm going to start listing Help Centers that I've spotted so far functioning in the wild:

Joby

Skitch

MyBlogLog

Less time than I thought it would. After conception of the idea, it took around 90 minutes from a fresh install of the help center. It would have been quicker if the following things were present:

More commenting in the code, to say exactly which areas of the page would be affected (I still haven't figured out how to change the 'Hi [UserName]' text area at the top right for logged in users to a more legible font, for example)

More spacing in the code would have been handy too. The template for the store uses spacing for every function. For example, here's a comparison of the background code from Help Center to the store template:

Help Center

body {text-align:center;background: #fdfdf8 url(images/HelpBg.gif) repeat-x;font-family:"Verdana","Arial","Helvetica", sans-serif; font-size: 12px; color: #535353;}

Store Template

body {
background: #fdfdf8 url('../images/beige/PageBg.gif') repeat-x;
color: #535353;
}

Both of the code bases are perfectly legible, but the second (owing to its not clumping together the body text with the page background) is easier to distinguish.

If anyone knows how to add backgroud colours to the 'Find Topics', 'Questions about products' blocks e.t.c., and also how to change the aforementioned Hi text, it'd be much appreciated if you could point me in the right direction!

Impressive. How long did it take you to implement this?

Nice job, Mark! And great topic. Thanks for starting it. We're keen to see how others have implemented Help Center as well.