14 Days Free Technical Video Training from WintellectNOW

  

A foray into the installation, setup, and configuration of an Orchard site.

Tags: Orchard, WebMatrix

I've recently migrated this blog, previously running GraffitiCMS, to Orchard 1.0, then upgraded to Orchard 1.1 During the Orchard exploration & migration process, I took down some notes so I can share them here, for others considering creating or moving a blog to Orchard.

Orchard is currently a Version 1.1 product, with version 1.1 just recently released on Apr 15th. At version 1 it was quite impressive and easy to work with and I didn't need to plow through a ton of documentation either. Version 2.0 is even more user friendly, enhanced, and more solid as some bug were fixed.

Orchard Overview

Orchard is an open source CMS built by the good folks on the Microsoft ASP.NET team. As a full featured CMS product, it includes many features you'd expect such as blogs, pages, content types, and the like.

From the technical side, the team built Orchard on ASP.NET MVC 3 with the Razor View engine, taking into account HTML 5/CSS, modern web development techniques, and patterns. Because of the module-based architecture, you can download modules and widgets to add features to your blog, and alternatively, you can create and publish your own modules and widgets.

From the end user side, Orchard guides users of any skill through the easiest setup, configuration, and publishing experience. Within minutes, anyone can have a site or blog up and running. Both savvy end users and developers alike will enjoy themes based on CSS and small customizable scripts in views.

The initial setup.

Setup - that was like having real life "easy button". Just open up the Web Platform installer and choose the latest version of Orchard. The installation takes about 1-2 minutes depending on connection speed, and I'm not exaggerating (or under-exaggerating?). Upon completion, the Web Platform Installer (Web PI) launches WebMatrix with the Orchard site opened. From WebMatrix, just click the "run" button on the ribbon and your fully installed, ready to go, Orchard site launches its Welcome page, where you can enter your site name, user name, and password.

In version 1.1 you can choose a "recipe" when installing Orchard. Recipes are just pre-set configurations for features like blogs or lists (which happen to be the two recipes available to choose).

Basic CMS site administration.

Upon finishing the initial setup, Web PI launches a new Orchard web site, and logs you in as an admin, where you'll arrive at the Orchard CMS administration dashboard.

The links along the left hand side allow you to create blogs, configure site, blog settings, choose themes, and many more administrative customizations. The image below shows a default install of Orchard with the blog recipe. Notice the options under the Blog link show that Orchard did indeed install the Blog recipe, as there links confirming you can manage  the blog or its posts.

image

The first few things most folks want to do after the initial installation are...

  • Configure basic site & blog settings
  • Change Theme
  • Add Modules
  • Add Widgets

You can find all the above options in the administrative menu along the left hand side of the page. The settings and themes really need no explanation (I went with Floral Black for production, and Contoso for test sites), however a few notes on modules and widgets are necessary.

Customizing Orchard with Modules & Widgets

Modules

Modules are feature sets rolled into components that you can plug into Orchard and enable or disable. Modules often perform behind the scenes work, but you might also see them in action on pages. You can create your own modules, and publish them if you wish; however, you'll need to do so in Visual Studio as you'll deploy modules as .dlls.

There are many modules out there to choose from, and developers are always adding more. After installing 1.0, the modules I went with are the Vandelay.TagCloud, Vandelay.Favicon, Vandelay.MetaTags, and Facebook.Like modules. (Hint: Go ahead and try out the Facebook recommend button on my blog posts!  ;-) )

Although they all install the same way, modules manifest themselves in different ways. You can set the Vandelay.Favicon settings inside the General site settings.

image

However, if you want to implement the Recent Blog Posts, Vandelay.TagCloud, Facebook.Like module, and so on, you'll need to configure them under the Widgets tab instead (more on this later).

Widgets

Widgets are snippets of content that you can create and place in any section of a page (called zones). Great uses for widgets are tag clouds, advertisements, recent posts, twitter feeds, etc... You can create widgets yourself by using the Orchard admin UI since no developer tools are necessary. That makes it really quick and easy to get some pieces of staple content out the door quickly.

Since widgets live inside layers, we need to look at what layers are first. Layers are a lot like Master Pages as they define an overall layout that a group of pages use as a base for their layout, look, and feel. Out of the box, Orchard contains some built-in layers you can use, regardless of theme. Inspecting the layers from a  default Orchard installation shows a few of the "Master Pages"/layers that you can customize.

image

Currently, the default site contains five layers, and the two layers of primary focus are the TheHomePage and Default layers, unless you need to customize further. TheHomePage layer is meant  for the home page layout, look, and feel while the Default layer works everywhere else. Reviewing the image below reveals zones (place where you can add content) inside each layer.

image

Note: If you're a Web Forms developer, you can think of zones as <asp:ContentPlaceHolder> tags.

Adding a widget is as easy as choosing the zone in the layer you want, and then choosing the desired widget. Here the Facebook and Tag Cloud modules previously installed show up ready for action alongside the built-in widgets.

image

Once you've chosen a widget to add, you can modify it if you wish. In the case of the Recent Blog Posts widget, you'll want to select the layer and zone where it should live, as well as the post title and number of recent posts to display. All widgets must live inside a zone and layer.

image

In the following illustration, the Recent Blog Posts widget displays recent blog posts along the right side of TheHomePage layer in the ContentAside zone:

image

Note: This is a test site using the Contoso Theme, your mileage may vary.

Migrating the current blog and deploying the site

If this is a clean site then all you need is to add content and perhaps a few more aesthetic customizations.

Migrating current blogs

Otherwise, you'll find yourself tasked with getting your old blog posts over to Orchard. Most blogs support the BlogML format for storing blog posts, meaning that you should be able to easily import/export blogs between platforms. A BlogML importer exists in Orchard as a module, which you can use to import your current blog(s). You'll need to add and enable the BlogML module if you don't have it.

Because Graffiti doesn't have an export feature, I couldn't export my posts. There is a BlogML exporter that I saw while looking online but it didn't work for me, as I've modified Graffiti beyond recognition.

If you can't find an exporter for your blogging platform, you can take the following steps to migrate the posts manually, as well as kick off the deployment:

  • Backup current blog
  • Pull down posts using Windows Live Writer, and keep them handy.
  • Delete current blog
  • Deploy customized but blog post free blog. You can use the WebMatrix Publish feature to FTP or Web Deploy the files and database.
  • Publish posts from Live Writer to new blog

Because of needing to manually migrate, I moved most of my technical, and a few other categories of other blog posts. There weren't a whole ton of posts and therefore not so tedious. I can't claim this is the best way to migrate your old posts, but it worked fairly well for me.

Deploy the site

Deploying the site is easy, with FTP or Web Deploy as your choices in WebMatrix from the Publish ribbon button. Most web hosts, like Orcsweb that hosts this site, allow FTP, and should have .NET 4.0 installed. Of course, you can also use your favorite FTP client, as all Orchard files are published. If you're looking for new web hosting for your new Orchard site, use the "Find Web Hosting" option in WebMatrix .

image

Note: Upgrading from Orchard 1.0 to 1.1 was a simple matter of following the procedures here on the Orchard site.

Summary

Even at version 1.1, Orchard is a flexible, modular, and modern CMS and blogging platform that even end users can use to get great sites up and running in minutes. Developers can extend Orchard to do anything via module development, and designers can use standards based CSS for themes. All around, Orchard is a solid CMS/Blogging platform for everyone.

Resources:

OrchardProject.net

Orchard Project Home on CodePlex

Bertrand Le Roy, Orchard Team PM

12 Comments

  • Jason Lee said

    Thanks for the info Rachel. I am diving in next week with a small project to get my feet wet in Orchard.

    Do you recommend any hosting that works best/well with Orchard? I deployed a basic site test on my site but it seems initially slow.

    Suppose it could be the fact that I used Sql server compact.

  • mark said

    Nice article--it inspired me to try Orchard, too!

    A question:
    I have created a new layer called “ArticlesLayer” and created a new page called “ArticlesPage”. How do I get the new ArticlesPage to use the ArticlesLayer?

  • mark said

    My last question did not seem to post to your comments section(oops!). Anyway, I found my answer: to make a page use a widget layer, you add an ironruby rule to the widget layer. For example, if I put this rule on my ArticlesLayer: url '~/Articles', and if the ArticlesPage is at ~/Articles, then the ArticlesLayer will be used on the ArticlesPage.

  • Rachel said

    @Mark,

    The comments go to an approval queue to avoid spam.
    You've out-geeked me, I was offline last night (though I've known to rip out some code on a Sat eve).

    Adding a rule should work though.

    LOL! IronRuby!!

  • Rachel said

    Way better! But then, I could be biased. ;)

    Seriously, I haven't used Umbraco in any production sense, and have barely looked at it, so I can't really speak to that.

  • clinton said


    Great post Rachel. I like the screenshots, actually looks like a nice enough interface... makes me want to give it a try.

    Mostly looking forward to playing with MVC and Razor part.

    Cheers,
    C

  • hid ballast said

    Such a good post! Thanks for sharing and guess i will be back soon on your blog!

  • cheap handbags said

    This is a great inspiring article. I am pretty much pleased with your good work. You put really very helpful information. Keep it up. Keep blogging. Looking to reading your next post.

  • AM said

    hello and thanks for your article, I stumbled with adding / changin layout of a page.

    Can you please add a walk through sample on how to customize the layout and apply a layer to a page?

Comments have been disabled for this content.