Tag: habari themes

Navigating Habari, the content management system – Part 1

It’s been over eight months since I migrated my blog (Jane Talks Tech!) from WordPress to Habari. It wasn’t done lightly and I did my due diligence by creating a test installation of Habari, making sure the importer worked, ironing out issues (credit entirely due to the devs in the Habari IRC channel) and finally pulling the trigger. That said, my experience with Habari has been a rollercoaster, but I’m still hanging on. 😛 I feel connected to this fledgling blogging system and believe it has a strong chance of surviving in the crowded content management space. Here are my thoughts on things that could make Habari even more of a contender today and ways you can help make it happen. So here goes:

There are a lot of Habari plugins listed in the official Habari repository. However, beating a dead horse, a small amount don’t work for the stable release version of Habari (i.e. v 0.6.4). Those that work are great at what they do and serves to tease me about the possibilities with Habari! I’m currently working on my bare-minimum and recommended list of Habari plugins. The list below picks on select plugins that would be pretty cool to have working in Habari v. 0.6.4:

  1. Polls: I found out about this plugin for creating polls, but it works with the bleeding edge or trunk version of Habari. According to a tweet by one of the Habari developers, version 0.7 of Habari might be hitting stores sometime in August. So until then, I’m hoping the community can help to polish some of the plugins.
  2. Video Embeds: Currently, besides grabbing the embed code from whatever video-sharing site you are on, there’s no relatively easy (as compared to WordPress) way to share videos. I’m thinking of a plugin that when activated, will allow you to plug in the unique ID number of the video and have it be recognized, etc. Not a biggie, but it removes yet another hurdle to the content-creation aspect of things. 🙂
  3. Photo Sharing support: When I started with Habari, I was a SmugMug user and I made good use of the fantastic SmugMug (#shamelessplug: coupon DGwxx0rcYaTWQ) silo plugin by Colin. Then, I switched to Zenfolio and wouldn’t you know it, no plugin for Zenfolio (#shamelessplug: Referral Code: WRC-655-RUY). Again, Zenfolio has code that can be embedded into blog posts as well as direct links, but man, I’d love to have a Zenfolio silo for Habari. 🙂 There are several photosharing sites and it’d be unfair to ask that the developers create site-specific plugins for the dozens of sites out there! This is where the community steps in and I’m hoping the next Habari developer on board has a Zenfolio website.
  4. Plugin/Theme discovery and updates: The official place to get plugins & themes from Habari is http://habariproject.org/dist/themes and http://habariproject.org/dist/plugins. One thing that would be nice is for there to be demo wherein people would preview themes without downloading, uploading and activating on a live blog or for the more technically inclined, a test blog. With the Habari plugin, I’d like to see some way to sort the plugins. Off the top of my head, perhaps it would be good to have folders corresponding to 0.x habari releases and then having *only* 0.x compatible plugins loaded in that directory. Plugin update notification is another pain, but so far, I’ve simply just check the plugin distribution site to see if there are changes. Perhaps an email subscription or a way to monitor changes to plugins would be a way of notifying users that plugins have been updated. Documentation with regards to plugin installation is an area that sorely needs help. A select few of the activated plugins on my blog use the neat ‘Help’ icon and some plugins lack readme files. Not a big deal because I’m a big fan of users educating themselves, doing due diligence by reading the manuals (in the case, the plugin.php files can be quite helpful) and asking for help before giving up. 🙂
    Habari Help icon

    One way I’ve been ‘trying’ to help is letting the devs know my problem(s) via Trac and writing on my blog about problems I’ve face and my workarounds or tweaks. Any CMS user will understand that with plugins and themes, there’s the almost-obligatory post-activation code and theme-tweaking (gravatar styling for comments, adding edit links to posts, adding code to certain parts of the themes as part of plugin installation, etc). Fact of life, but clearly documenting what needs to go where will go a long in easing the pain.

That said, I always find new Habari-powered blogs daily and I also check the Habari Plugins repository frequently. You can get an alternate listing of Available Habari Plugins and Available Habari Themes on the Habari Wiki. I also just found about an unofficial community theme repository called the Ziada Project which pales in comparison to the official repository so far.

Minor gripe: I’ve so many different Habari themes in the wild and speaking as a complete user & parasite, I selfishly wish that those coders who’ve created new/interesting themes should please consider releasing some themes. I’ll leave your link(s) in the footer/sidebar/wherever. 😛 Heck if I can’t get excellent themes for free, I won’t be opposed to paying for one! As I tweeted earlier, I can’t wait for the rise of premium themes in Habari. 🙂

So far, I’m still hooked on the Habari content management system for technical reasons I know nothing about and the fact that Habari comes with less cruft. The Habari cabal is aware of most of the shortcomings and from being a lurker on the habari-dev mailing list, they’re listening to feedback. With the demands of IRL work and personal stuff, they’ll get it done. 🙂 In fact, Trac is where much of the behind-the-scenes magic keeps happening as you’ll see stuff being fixed/updated.

For new users of Habari, if you run into trouble of *any* kind, the absolute best thing you can do is visit the Habari IRC channel.

Here’s how:

  1. Download and install an IRC client like mIRC or XChat or TurboIRC or .. My point is: there are several free options for getting an IRC client up & running.
  2. Once you have installed your IRC client, connect to the Freenode network which should be one of several options on whatever Chat/IRC client you have. Or you can click this link: irc://chat.freenode.net/ and it should allow you to open the Freenode network in your default IRC client.
  3. Once you have connected to the Freenode IRC network, connect to the #Habari channel by typing #Habari when prompted to connect to a channel.
  4. Once in the Habari IRC channel, ask your question and make sure you are able to make on-the-fly changes to your blog and provide feedback to the developers.
  5. OR, did you know that there’s a Live Help for Habari plugin? Yes, you can pretty much forget everything I wrote in the first 4 bullet points and simply install the LiveHelp plugin. It connects you directly to the Habari IRC channel from the comfort of your Habari blog administration panel! I love it and it’s frankly easier to do that installing and all the fun stuff. 😛
  6. OR, if you don’t care to be logged into your blog’s administrative interface to use IRC, simply visit http://webchat.freenode.net/ and join the channel #habari.

For users who have issues that could be considered bugs or if not fixable via IRC, you can always file a ticket in the Habari Trac system.

Here are some basic tips about using the Trac system:

  1. For issues that are NOT because of a plugin or theme being broken or incompatible, visit https://trac.habariproject.org/habari and create an account. It is extremely helpful if you can copy & paste the error codes you’ve seen into a text file and then upload that file as part of your bug filing. I’m also a fan of taking screenshots of the relevant details and uploading those as well. The point is that any helpful information that will lead to the solving of that bug is highly appreciated.
  2. For issues that ARE because of a plugin or theme being broken on incompatible, visit https://trac.habariproject.org/habari-extras and as you can see, I am rather whiny. 🙂
  3. Whatever you do, be honest about the severity i.e. if it’s a wishlist for a plugin or an ‘extra’, don’t mark it as a showstopping bug or as major or urgent. Remember the golden rule. 🙂

For users happily coexisting with Habari and want to help out:

  1. Spread the word about Habari via tweets, articles, blog posts and posts on your social networks. I haven’t been too shy about contacting people as asking/letting them know about the new kid on the block. 🙂
  2. Contribute to Habari via creating plugins or themes for Habari and/or contributing to the codebase or helping with documentation.
  3. Notify the developers of security issues or file tickets about bugs.
  4. Join a Habari working group to dedicate yourself to any issues you’re passionate about.
  5. Join the Habari forums, Habari Users mailing list and/or the Habari Developers mailing list to be of assistance to newbies like me and developers new to Habari.

Either way, I’m eager for v. 0.7 of Habari.

It is thisclose to release and I’m excited to be a part of this burgeoning community even if my most significant contribution was a plugin request. 😀 For a list of blogs running Habari, visit http://wiki.habariproject.org/en/Habari_Powered_Sites. I’m aware that because Habari’s still growing, it might not be for everyone. Here’s a link that describes how to migrate your content back to WordPress if that’s where you came from. Earlier this week, I did a test migration back to WordPress 3.0 with this same script and it worked. My posts, comments, user(s) and tags and pages were properly imported into the new WordPress installation, but my categories were gone i.e. all posts were listed as Uncategorized. I don’t think this is a dealbreaker. I’d be more worried if my tags weren’t imported because tags are another way of keeping things ‘categorized’ if you will. Just a FYI. 🙂

Tip for attempting a test migration from Habari to WordPress: use a new WordPress install with a new MySQL database and new username. It’s ridiculously easy to do on Dreamhost so you have no excuse not to. I just like things clearcut and that’s my only reasoning. 🙂

Habari-powered blogging: Tweaking your theme

First thing: I’m *not* a coder, but I’ve got the next best thing: search engines like Bing, Google and DuckDuckGo on my side. For every theme I’ve used on the blogging software running my blogs (janetalkstech.com and fadingwhispers.org/home), I’ve ended up editing the theme’s files to include some small features I admired in previously used themes (see a list of available themes for Habari). This particular post will attempt to go over little tweaks I’ve made to the current theme (Georgia by Thomas Silkjær) running this blog as of 06/15/2010. By the way, if you’re running Habari, try Georgia sometime or any of the other themes. It’s a beautiful two-column theme with an emphasis on gorgeous typography and excellent use of white space..

Before I continue, here are some assumptions I’ve made:

  1. I’m assuming that you’re familiar with content management systems. Examples of content management systems or CMSes would be the famous WordPress, Drupal, Joomla, etc. Habari is another such system and it powers janetalkstech.com currently.
  2. I’m assuming you’re able to edit files on your webserver. Bonus points for you if you even installed WordPress yourself.
  3. I’m assuming you have file backups of the original unedited files for your theme because you will (like I have) make some changes and attempt to undo said changes only to discover you made things worse. 🙂
  4. I’m assuming you are not averse to trying things and finding things by trial and error.
  5. Please don’t hold me responsible for any bad things that may or may not happen to your theme/files/blog/computer/person/house from using any code snippets posted here. I’m not a security ninja (see my About page).

That said, a vanilla (plain) installation of the Georgia theme for Habari will leave your frontpage (index.php) cluttered with the full-length posts. I say “cluttered” because I typically include pictures and/or embedded video in my blog posts. Leaving full-length posts on the main frontpage can cause problems. I wanted my posts on the frontpage truncated for the reasons below:

  1. Performance reasons: I have pictures and videos (usually) in each post. Have all the pictures and/or videos in all 4 posts load at the same time increases the load time of the homepage. Internet users are big fans of pages that load quickly so doing this will be a step towards that goal.
  2. Being smart and optimizing: Having the full posts loading on your home page is an example of information overload. Besides that, you’re essentially discouraging readers from clicking through to read the posts which will make any form of analytics hard to interprete.

Since I couldn’t very well code some plugin to do this, I had to mimic another Theme’s method of implementation. Specifically, I took a look at the theme files of the Dilectio theme because it shortened posts on the frontpage by default. After trial and error, I found what I was looking for. In the theme.php file, I found a line of code that specified how much of the posts to display before displaying the “read more” link. For preventing the full-length of the posts from being displayed on the home page of your blog, here’s the relevant snippet to alter (code culled from the theme.php file in the Dilectio theme for Habari):

<?php
// tell Habari which class to use
define( 'THEME_CLASS', 'Dilectio' );
class Dilectio extends Theme
{
	//Execute on theme init to apply these filters to output
	public function action_init_theme()
	{
	        //I snipped out a bunch of irrelevant (for this post) code
		// The snippet below puts out a reduced size version of the post when there are multiple posts displayed
		Format::apply_with_hook_params( 'more', 'post_content_out', _t('Read More') . ' »' , 100, 1 );
	}

That’s all you need to insert into your theme.php file under the public function action_init_theme() block to shorten posts. That done, the next issue I faced with my theme was figuring out how to allow gravatars to display with proper formatting.

With the gravatars plugin for Habari, you’re expected to install this code snippet in the ‘relevant’ files:

<img src="<? echo $comment->gravatar ?>">

It didn’t take me long to figure out where to insert the code, but the lack of a readme file with the plugin didn’t help matters. I can imagine how daunting this must seem, but then again, Habari is really young and forthcoming iterations will address these user interaction issues. In the case of the gravatar plugin, the relevant file to be edited was the comment.php file. Specifically, you should insert the code snippet as shown below:

<li id="comment-<?php echo $comment->id; ?>" <?php echo $class; ?>>
<img src="<? echo $comment->gravatar ?>">	
<h2 class="comment_author"><?php echo $comment_url; ?> <em>at</em> <a href="#comment-<?php echo $comment->id; ?>" title="Time of this comment"><?php $comment->date->out(); ?></a></h2>

If you’ve done that, you’ll see that your comments section will look like this:
habaricomment.png

I wasn’t quite satisfied with the layout so I added some changes and here’s the code that I added to make my comments section a little prettier:

<img align="left" style="padding:4px" src="<? echo $comment->gravatar ?>">

I added the align and style properties to the img tag which can alter the layout. See what my comments section looks like now:
habaricomment-2.png

Cheers and that’s all for now. I’ll update this post with corrections or additions. Feel free to comment on any inaccuracies, etc. 🙂 For those wanting to dive deeper into Habari and themes, check out the Geek media’s articles on Habari. As always, if you have questions, pop into the Habari IRC channel (#habari) on Freenode.

Here’s a tip: Join the Habari Dev list so you can get a feel for the developers behind Habari. Then, head over to IRC and use JibbyBot to pass messages to them! 😛 To do that, you say: “JibbyBot tell blah blah” and it’ll store your message for the next time the person logs in. Pretty nifty and I had a problem solved that way without me having to monitor IRC constantly. The IRC logs are here.

Using Habari from a user’s perspective

I’ve been a WordPress user for the longest time. I love the easy out-of-box experience of WordPress. However, I got bored and began wanting to something else that was different from all the content management systems out there. I’ve toyed with Drupal, but there are way too many things to click just to get things done. Then, I heard about Habari again and decided to give it a try.

The installation process is actually faster than the famous 5-minute install of WordPress. Habari’s schtick is about building a solid foundation and letting plugins do the rest of the work. This is good from a developer’s perspective, but cumbersome for a user. I will delve into the reasons which are exactly why I’m struggling a little bit with Habari.

Here are the issues (for me):

1) Habari has 2 main versions: the stable version and there’s trunk version of Habari. The developers, I’m presuming, play with the bleeding edge versions a lot and this is evidenced by the large number of plugins marked ‘-trunk’ under the Plugin directory of the Habari Project.
2) Half the time, plugins I have an interest in using either: don’t work for the version of Habari they are listed for or (ii)work for the ‘bleeding edge’ version instead of the stable version. I know developers like to live dangerously, but I wish there’s be a set of tried & true plugins that will make the experience of using Habari less frustrating. I suspect things are simply being labeled wrongly.
3)For the plugins that do work, there’s no smooth way of finding out if there are upgrades except for browsing manually to the plugin folder on the Habari site or visiting the author’s page. I’d recommend providing a subscription method (which won’t scale if they get bigger) for now so that I can subscribe to updates of plugins I’m interested in.
4)Lastly, a lot of the current themes for Habari that I’ve encountered require plugins to function as intended. I’ll use the Dilection Theme as an example. Currently, this theme requires the following plugins: blogroll, monthly archives and flickrfeed. I was able to get Flickrfeed to work after much guidance from the very helpful developers at the #Habari IRC channel on Freenode. The last two simply cause the plugins.php page to emit a 1-line message about a “fatal error” and I have to manually delete the plugin folder before that message will go away.

I pride myself on having a very little bit of a technical bent, but so far, Habari’s making me feel pretty helpless. However, it’s not all gloom and doom. The Habari Project obviously hopes that competent people will be willing to step up to the plate to develop for the platform. The plugin ecosystem is what will make or break Habari and I truly hope that by this post, more people will be interested in knowing more about Habari and might even get inspired to building themes & plugins! 🙂 In fact, if I visited the #Habari channel on IRC, the chances are very good that I’d stumble into one of the Habari devs and they WOULD talk me through figuring out what the problem with a particular plugin is. That’s just how awesome the Habari developers are. 😀 It’s just that after doing that 3 or 4 times, I worry about being too imposing or that I’m bugging someone.

As a content management system with a somewhat stable assortment of plugins, Habari works great. There are a few design bugs here and there, but I’m mostly happy with it and that’s why I’ve stuck with it thus far. For thiose out there who are wondering what does work with Habari 0.6.2, here are some recommended plugins I’ve got enabled & working on my blog:

  1. Code Squeezer 0.4 is the first plugin I’d recommend you install. It literally allows you to insert any code you like into the header, sidebar or footer. I use the Code Squeezer for squeezing in my Google Analytics tracking code and some super-secret other stuff. 🙂
  2. The Flickr plugin comes with a default install of Habari. It’s a beauty and I highly recommend it if you have a Flickr account. Unlike the built-in Habari media management silo, the Flickr plugin allows you to insert image thumbnails and is configurable! In this post about viewing chkdsk logs, the pictures were uploaded using built-in media management utility in Habari, but it inserts the pictures at the uploaded file size! Not good behaviour at all.
  3. Habari Media Silo: I love that they built media managment into Habari, but right now, it’s rather rudimentary. If I uploaded a huge image file and wanted to insert a resized version of the picture into a post, I can’t do that right now. Yes, I could google for the html code to manually resize the picture myself, but I would recommend that they borrow a page or two from the Flickr plugin’s playbook and provide an option to insert a thumbnail of the picture or a resized version of the picture.
  4. Habari Backup 1.5 by Scott Merrill (thanks to Michael Harris, one of the cool Habari developers for turning me on to this plugin in my post on backing up data). It works as advertised and I’m sleeping much easier at nights. 🙂
  5. Youtube Media Silo – need I say more? It simplifies insertion of my uploaded Youtube videos to my blog and again, it works as advertised!
  6. Smugmug Media Silo – again, excellent plugin for simplifying insertion of my media from my Smugmug account
  7. WordPress Importer – a clear must for people migrating from WordPress to Habari. They are smart to have this feature developed and working because Habari has some WordPress features in terms of the administrative backend layout.

Before I finish, I *have* to commend the Habari developer(s) behind the design of the administrative interface and the default “Charcoal” theme. Go to my front page (Jane Talks Tech!) and you can see how tasteful the greys and text mix together. In composing a post, I love how the focus is on the title bar and the textarea for entering your blog post or page. Any plugins that are enabled are simply available in a row of clickable buttons and they expand very gracefully when clicked. If you are curious about what I’m talking about, take a chance and install Habari. Before moving my tech. blog over to Habari, I installed several test installations of Habari and had a chance to make sure that there were no showstopping hindrances to successfully running my blog with Habari. So far so good. I hope this post will be seen in the light of constructive criticism with which it was meant.

Shoutout of members of the Habari cabal who have helped me on my road to becoming a Habari user (andyc, michaeltwofish, dmondark, mikelietz, lildude, rmullins, ringmaster, and many others in the #Habari channel on the Freenode IRC server! 🙂