Walking Through the Orchard Part 1

I spent some time last week working on converting my blog that you are reading at http://johnpapa.net from Graffiti CMS to Orchard CMS 1.1.3. This post explains pretty much everything I had to do from beginning to end, so it is pretty lengthy. But it should be helpful to anyone moving from Graffiti to Orchard, or for that matter, moving from any blog to Orchard. In fact, after I went through the process once for my main blog, I used these same notes to convert another blog. I plan on 3 parts to this series, which this is the first.

This is Part 1 where I will cover how I used WebMatrix to install orchard and set up its initial settings, setup a theme, install some fundamental modules, and configure them.

NOTE: Quick callout to a few folks who helped me tremendously during this process. Much of what’s written in this series, while depictive of my experiences, is due to the help given by these folks. Because of them I can share this with all of you.

- Drew Robbins had gone through a conversion from WordPress and assisted me with the setup of Orchard, its modules and various questions along the way. He authored the FollowMe module and my theme.

Sebastien Ros of the Orchard team helped with various key problems I ran into. The biggest of which you’ll find I wrote about in parts 2 and 3 of the series where rewrite rules and content display problems came into play. His quick responses were extremely helpful. He even published a brand new Rewrite Rules module while I was chatting with him, that fixed some of my problems.

-Scott Forsyth, of ORCSweb Managed Hosting, and his support team continued to give me the best support I have ever received from a hosting provider by a long stretch. These folks know their stuff, are quick to respond any time of day, and talk to me on my level (no talking down). Point blank: without ORCSweb’s support this would have been a much longer process.

Web Platform Installer

Before you get started, I recommend installing the Web Platform Installer. I used it for WebMatrix, SQL Server CE and for Orchard CMS. It’s a quick install and really simplifies the process.

Setup of Orchard using WebMatrix

I used WebMatrix to install Orchard and handle a few other tasks along the way. It really did simplify things so I highly recommend using it. Once installed, I ran WebMatrix and clicked on the button to create a new site from Web Gallery. I then search for orchard, entered the new site name (JohnPapa.net) and clicked the next button. This took about 15 seconds and I had a site up and running locally.

The next step is to configure the settings for the site, which I did by clicking the link to the localhost url in WebMatrix. This brings up the new Orchard site’s Get Started page (shown below). I entered the name of the site, chose a user name for the admin user, and a password. I chose to use a SQL Server CE database for the simplicity and portability of the sdf file. Then I also chose the blog Orchard Recipe type.

NOTE: If you choose SQL CE and want to migrate to SQL Express or SQL Server later you can.

The recipe gets baked and within seconds the blog is appears in the browser using a default blog template.

Themes

Looks and layout are important, so the first place I headed was the Themes gallery. You can get there by going to the Dashboard, selecting the Themes section and selecting the Gallery tab. From here, I looked for themes that fit my idea of a blog. The Super Classic one is not bad.

Note: I am using a custom theme not in the gallery, for now.

Once you find a theme you like, install it. Then click on the Themes / Installed tab and find the theme you want. Then click it’s Set Current button. The theme I chose has a side panel on the right where I planned to put my widgets (just like the Super Classic and Classic themes above). You can change themes at any time.

Orchard Modules

One of the best parts of Orchard is that they follow the model of many other popular blogs by allowing you to import modules to add functionality. The first thing I recommend doing is adding several key modules from the Orchard Gallery. Easiest way to do this is to go to your new blog’s Dashboard, select Modules, then select the Gallery tab. From here you can search for and install (or download and install) the modules.

Note: Once you install a module, if there is an update for the module available in the online gallery then an alert will appear in your site in the module section. Nice feature!

I installed most modules right from this page. However, I found it easier to search the http://orchardproject.net/gallery site online in some cases.

Here are the modules I added and some important notes for each:

Module	Notes
BlogML	I needed this module to import the BlogML file that I exported from Graffiti.
Google Analytics	For Google analytics. Once installed, go to Settings and enter your analytics tracking ID. I installed the one from Nathan Heskew and Sebastien Ros (there are 2 with the same name )
Rewrite Rules	I needed these to keep my old links pointing to the same content where url’s changed. More on this later
Messaging	Required by Email Messaging module
Email Messaging	Required for some other modules, like the Contact Us module. Once installed, go under Settings in the Dashboard and enter your information.
Contact Us	There are a couple of “contact” forms. This one was most simple for me to tweak.
Indexing	required for the Search module
Lucene	recommended for the Search module
Search	For searching your site (I had issues with this one and the made the team aware. more on this later)
FollowMe	Nice social module that allows you to add a small widget to your side panel with links to Twitter, Facebook, email, Linked In, or your RSS feed. A colleague of mine, Drew Robbins wrote this one.
LatestTwitter	One of a few Twitter modules. I liked this one because it was easy to template the display of the tweets in my side panel by changing its cshtml file.

Note: Once you install the modules there appears to be now way to remove them. However you can disable them. I did this when I tried some modules and found better ones.

There are many more modules, some which I already added and other that I plan to add soon. But these are the core ones I felt I needed just to get my blog up and running, so let’s start here. here are a few special notes regarding setup of some of these modules.

Email Messaging

For the Email Messaging module I went to the Settings area in the Dashboard and found there were a few new settings sections for the new modules I installed. The Email settings required the sender’s email address, host name, port number, and credential information for my blog’s SMTP server.

Contact Us

Once this module is installed and set up, you’ll need to enable this module as it is disabled by default. Next, I went to the Contact Us section in the Dashboard and I added the recipient user name to be me. Then I went to the Users section in the Dashboard and edited my user, set it as an admin, and set the user’s email address. This was needed for the email modules I used. Without it, the Contact Us module did not work (as it would not know where to send the messages).

a simple page was available at /contact as shown below:

Search

I debated whether including this or not, but since I feel search is pretty important on my site and I am still trying to get it to work I figured I’d share my experience anyway. Search is a simple module as it allows me to include a widget in the side panel of my site to allow searching of content. It allows you to re-index the content on demand and allows you to select which fields the search will look at. All in all it looked great. In fact, it worked fine for a while but at some point it stopped working and instead of searching it brought up an odd page with search information and comments (like it was a blog post). I won’t go any further one what else it did wrong, but suffice to say I alerted the Orchard team and some folks there are looking into it. Hopefully its just something I did. I’ll report back on this either way.

Widgets

Next I wanted to set up my layout. The theme I chose had some sections filled in with placeholder content, which is nice since it gives you an idea of where things will appear. But of course you’ll want to remove those and add content where you want them to appear. So I first went to the Widgets section in the Dashboard and removed the content I did not want to appear. Then I started working on my right side panel. For my theme this was the AsideSecond section. Here I added a series of widgets from top to bottom. You can add new widgets, re-adjust the order in which they appear, disable them, edit them, or remove them.

I added a Search widget here first, but later disabled it as it was not working consistently for me. I could have removed it, but again, I plan to put this back in later.

I then added an Html Widget which is great for adding any HTML content. In this case I added a small headshot of me and a few tiny images I wanted to appear on top. Next I added the Follow Me widget, then the Twitter widget, followed by a series of Html widgets for other content.

FollowMe

The FollowMe module was written by Drew Robbins and is a clean and simple module that adds something like this image:

When I added the widget, I edited its settings by entering the Twitter Url, Facebook Url, Rss Url, and Flickr Url. You can also add one for email and YouTube. I left these latter 2 blank, which made the widget not display them (which is what I wanted).

Note: You can add a title to the widgets, but I generally avoid this as I think it adds clutter to the panel.

Notice the widgets in the image below are displayed in gray when disabled. Also notice that many of the widgets say Html Widget (their type). I would prefer that I could add a title but mark it as hidden. This would allow me to see the name of the widget in the dashboard instead of seeing a ton of Html Widget types.

LatestTwitter

I tried a few of the Twitter widgets and there are several nice ones. The one I ended up with is a simple widget with few features called LatestTwitter. I like it because its pretty basic and does what I need yet allows me to customize the appearance.

Note: There is also a widget called Twitter which allows you to create a scrolling list of tweets, shows searches, and much more. I installed it and it works nice. I just did not need that for now.

Coming in Part 2 … Walking Through the Orchard Part 2 – Conversion from Graffiti

In Part 2 of this series I will walk through the export from Graffiti to BlogML and the import process from the BlogML file I created and all of the tweaks I made during the conversion. This included the import process, rewrite rules, and fixes due to conversion problems.

Coming in Part 3 … Walking Through the Orchard Part 3 – Fixes, Tips, and Performance

Then in Part 3 I’ll hit a few other changes I made and cover some tips and tricks. These included database migrations, webdeploy tips, IIS 6 and IIS 7 differences, content display problems, and performance.