Blog

On Codegarden '10 I entered the package competition on a whim, after installing the shiny new Umbraco 4.5 on my laptop there. I was inspired to try and see if the package that I had not completely completed would work on 4.5 and when it did, I just added my name to the list. I ended up winning the third prize with it (a brand new Xbox 360 Elite)!

I've since polished the code a little bit and it is now available to download from the projects section at our.umbraco.org.

Of course I expect to get as many votes on Our Umbraco as during the package contest (you rock)!

The PhotoMetaData package will extract meta data from images that you upload in your media section. This works in both Umbraco 4.0.x and 4.5.

When you create a property with the correct name it will be filled as soon as you upload an image in the media section.

Here a video with a quick overview of the package.

Photo by the wonderful Douglas Robar

Just a few weeks ago, someone showed me woorank, a very cool website analysis tool. Woorank tells you what you can improve on your website to help search engines find and evaluate your content better.

By giving you a score from 0 to 100, you can easily compare your site to others. The score is divided up in dozens of different indicators that all have a certain weight in the calculation of the score. All of the indicators are nicely explained to help you understand why they're there (and if you should care about them).

My site actually scored pretty well (56 at the time). Of course I don't have an entry in wikipedia and my Alexa rank really sucks, so no points there. Fair enough.

I found that I could easily improve my score by tweaking some things in my site, mostly using content that I already had available anyway. Umbraco makes this really, really easy. No programming needed, mostly tweaks to my templates / XSLT files. Here's what I did (and what anybody could do!).

Sitemap

Of course I already have a sitemap on my site thanks to my own fantastically simple sitemap package (it's just a bit of XSLT, really, have you voted yet?).

However, woorank told me that a sitemap was missing. Of course, I have no link to the sitemap anywhere and it's not called sitemap.xml. So I thought I'd find out how to let search engines (and woorank) know that I have one available to crawl.

First of all, you can include a meta tag in the head of your HTML. Easy enough, just add it to the template, but this won't always work. Google, for example, relies on the sitemap being in your robots.txt file. Unfortunately, the robots.txt can't be edited from within Umbraco, so I had to make this improvement by updating it manually.

Microformats

Jeff Atwood of Coding Horror and StackOverflow fame wrote a blog post in December about making crappy HTML even more crappy by putting extra crappy HTML in it to support microformats. In the end though, he concludes that it's too easy not to do.

I don't really see the added value at the moment, but it can't hurt to implement some of it.

The only microformat that I could think of would make sense on my site was the contact information, using the hCard format. So off I went, added some div's and spans in my footer XSLT and in the HTML on the contact page.

Dublin Core

What's this you ask? I had no idea either. As it turns out Dublin Core meta data is very structured information about the page you're currently on. Although, it seems only slightly better than the normal meta description / keywords tag.

As with the microformats, it doesn't hurt, so I spent 5 minutes updating my main template to include Dublin Core data (title, description, creator & publisher). This data was easily accessible from Umbraco and I'd already used most of it in the other meta tags, so a quick copy & paste in the template did the trick.

Geo Meta Tags

Oh boy, even more meta tags. Alright, geographic information. The content of my site isn't targeted at a specific geographic location, nor does it show any data that belongs to a location. I suppose it's nice to know that I'm in The Hague. Once again, too easy not to do, so I added the placename, region and coordinates to the template.

Conclusion

There is a lot of meta data out there. And apparently, search engines actually look for that information. I do get the impression, though, that there is too many different formats. Can we just pick one and stick with it? Oh wait, it's the web, when has that ever happened?

It took me a few hours to figure out what information was needed everywhere, but once I did, Umbraco made it painless for me to update my entire site using existing data.

This will be even more fun when I start adding the geo information to the site I'm currently working on that shows panorama pictures. Each picture already has GPS coordinates so it'll be a really quick XSLT addition.

Today, I had a little problem after adding some properties to a document type in Umbraco. I've had this problem before and I keep forgetting how to fix it.

When opening a node of this document type (in Umbraco's Content area, not the document type editor), I get the following (rather generic) error:

I must add that while creating some new properties on this document type, the property was added, but I did get and SQL time-out. Not sure why that was, but it must have interupted an update process on existing nodes.

This is probably the reason that the current nodes are now corrupt. As you can see in the exception, there was a problem adding a control to the page.

The solution is easy, you have to publish all of the nodes and its subpages to fix the error. Voliá!

Richard Soeteman adds some extra information on a similar error while deleting a property on a document type. The issues could be related, so if you still have problems, check out his blog post as well.

Wow, who would've thought 10 months ago when I was introduced to Umbraco that I would be nominated to be an MVP? I sure didn't expect that!

I'm not asking for votes, I'm proud to be listed among giants and you can make your own decisions.

However, I would like to promote the others on the list:

Chris Houston was the first one to reply on my first blog post and I love how active and involved he is in the community. I can't wait to see the cmsMailer package that he's involved in. Vote for Chris!

Chris Koiak has made some cool packages and seems to be a great developer with a passion for Umbraco. Besides, he's from Glasgow, he must have a great accent. Vote for Chris (no, not the other one, this one)!

Dan Drayne must have a very high accept rate on our.umbraco, his forum replies are always very helpful. Vote for Dan!

Darren Ferguson's source code makes me jealous! Awesome packages, I have a lot to learn from this guy. Vote for Darren!

Dirk De Grave is always helpful on the forum, always there (does he ever leave his computer?), patient beyond belief even though some people test his patience sometimes. Vote for Dirk!

Douglas Robar really is the best teacher I've ever met. His posts on the forum are long and complete, with amazing attention to detail. Vote for Douglas!

Jan Skovgaard also always seem to be online, helping out, asking questions. Plus he seems to like Dutch people, perfect! Vote for Jan!

Jesper Ordrup seems to be taking Umbraco to new heights with the projects he's involved in. Let's hope he keeps sharing his insights. Vote for Jesper!

Lee Kelleher is a busy bee, he seems to be everywhere at the same time and should be rewarded for all of his efforts in the community. Vote for Lee!

Lee Messenger's ideas to change the our.umbraco forum from "just" questions and answer to even more thought provoking conversations are great, keep up the good work. Vote for Lee (THIS one)!

Morten Bock: uForum, need I say more? Awesome coder. Vote for Morten!

Nik Wahlberg I don't know so well unfortunately, but he must be awesome 'cause he's wearing sunglasses, just like Niels. Vote for Nik!

Peter Dijksterhuis should win because he works on a farm one month a year. Also, he made the great calendar package, good stuff. Vote for Peter!

Petr Snobelt thumbs up for the MemberControls package, and his avatar. Vote for Petr!

Richard Soeteman is the number one Umbraco fanboy from The Netherlands. This guy might be singlehandedly responsible for the rise in popularity of Umbraco in the last year or so.. ;) Vote for Richard!

Ron Brouwer another fellow Dutchie and a very helpful guy, love his work. Vote for Ron!

Thomas Höhler must be the loneliest Umbracian in Germany, but that's great, gives him time to help everybody out on the forum and on Twitter. Also makes cool packages. Vote for Thomas!

Tim Saunders always helpful with a different take things, I love seeing alternate solutions. Vote for Tim!

Warren Buckley well, what's not to love about this guy, CWS is awesome, he's always looking to add value to the community, and it's working. Vote for Warren!

... I really can't choose, I might as well vote for myself now!

Of course, this is all a clever ploy to get everybody to vote for me anyway.. I trust you will all not find me out. ;-)

Rather than making a long post with a lot of images, I decided to do something new for this post: a nice little 6 minute screencast!

It's just a quick run through of how I create a new Umbraco installs on my dev machines. It's easy!

I noticed after the recording that I didn't change the path for the database files. During the creation of the new database, you can easily change the path of where the database files are stored here (buttons marked yellow):

I tend to mumble a little, I'll work on that for future screencasts (also, I didn't shave, sorry). ;-)

Hopefully this will help some people setting up their Umbraco install manually.

Recently, I've been working on a site that presents 30 to a 120 items from Umbraco's media section in the frontend of the website.

In the past few weeks, I've been tweaking the site for performance and noticed that there were an aweful lot of SQL queries being performed in the database. As it turns out, calls to the umbraco.library:GetMedia() method are being sent directly to the database. This meant that for each media item, three queries are being performed. Times a 120... That starts to hurt a little.

Also, it is impossible for us to turn on caching on this macro completely because updating the media item with a new image would not expire the cache.

I had to come up with something else that would cache calls to the media library. So today, I'm presenting you the Cultiv MediaCache package.
This package provides an XSLT extension that provides a caching mechanism for calls to the "GetMedia" method.

It's very easy to use:
In your XSLT files, instead of doing calls to umbraco.library:GetMedia(), you do them to Cultiv.MediaCache:GetMedia().
That's it! Told you it was easy.

Read all about it on the project page, download it, use it, vote it up. Okay, thanks! :-)

Tiny update dec 20, 2009 - 17:28: Now compatible with .net 2.0 installs of Umbraco (previously only worked on .net 3.5).

This site has been the target of comment spam attacks for a while now. I tried to stop the spammers by using the "Honeypot Captcha" technique as described by Phil Haack. Unfortunately, the spammers apparently already have pre-existing knowledge about the comment forms and were not fooled by the hidden textbox.

So today I was ready to waste a few hours on getting a proper captcha system implemented. I have always really liked reCAPTCHA because it's not only fighting spam, everybody filling one out is also helping to digitize books, cool.

I wish there was some complicated problems that I could explain here, but once you sign up for reCAPTCHA, you can go to the asp.net plugin page and follow the instructions. I was finished in a matter of minutes and now have an evil, but necessary captcha widget on my comment forms.

This is a really short tip: Don't create a new documentType with the alias "Folder". This alias has already been used by folders in the media section.

In normal day-to-day use this is not a problem, but it becomes one when you try to programatically access the documentType by alias (DocumentType.GetByAlias("Folder")). I ran into this problem the other day and couldn't figure out why I was getting unexpected results until I had a look at what the ID actually represented, a media folder.

Today, I was handed a piece of HTML which featured a login form. My assignment: create this in Umbraco, using the default Membership provider.

This could be considered as an "Umbraco tip of the week", however this applies to ASP.NET webforms in general as well.

I thought about applying styles and maybe some Javascript hacking to make the login form look exactly like the design. Then, after some searching on the internet, I found out that it is actually extremely easy to apply any layout to your login form.

I started out with this:

<form runat="server">

 <asp:Login id="Login1" runat="server" />

</form>

The designer had made some prettier input boxes with background images and the "Login" button was actually style link.

You can actually use something called a LayoutTemplate from
within your login control.

The easiest way to do this is to:

• Open up your master page in Visual Studio
• Go to the designer view Right-click the Login control and choose "Convert to template"
• Start customizing the HTML

However, if you want to do this manually (and who doesn't love some manual tinkering), you have to keep in mind that you need to put at least three controls in your login control:

• An asp:TextBox control* with an ID of: UserName
• An asp:TextBox control* with an ID of: Password
• Either an asp:Button an asp:ImageButton or an asp:LinkButton control with a property: CommandName="Login"

* When I say a TextBox control, I actually mean a web control that implements ITextControl.

If you want to show an error when the login fails, add an asp:Literal with an ID of: FailureText

In the end, you'll end up with a piece of code that looks a bit like this (custom styling removed to keep this nice and short):

<form runat="server">

 <asp:Login id="Login1" runat="server">

  <LayoutTemplate>

   <asp:TextBox ID="UserName" runat="server"></asp:TextBox>

   <asp:TextBox ID="Password" runat="server" TextMode="Password"></asp:TextBox>

   <asp:LinkButton ID="submitLoginBtn" CommandName="Login" runat="server">Login</asp:LinkButton>

   <asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal>

  </LayoutTemplate>

 </asp:Login>

</form>

Update: As Dirk and Jan point out, this method will still produce a table surrounding the login controls. This is only a wrapper though, no table element go between the input tags, not to worry.

Dirk is actually working on getting the ASP.NET 2.0 CSS Friendly Control Adapters to work with Umbraco. Mind you, these adapters are available for .NET 2.0 only.

I personally set-up all my Umbraco installations with the .NET 3.5 config, so this method would not work for me. I don't view this as a big problem, I just style the wrapping table and ignore it.

This morning, I thought I'd protect my site a little better to get some understanding of what would be required to do so.

First of all, I thought I'd enable Windows authentication om my /umbraco folder. Couldn't be easier, right? Wrong.
Apparently, since I am using the .net 3.5 configuration to run Umbraco in integrated pipeline mode in IIS7, some weird problem was introduced:

I could not disable forms authentication on the /umbraco folder. Googling for this, did not get me a lot of good results. However, I finally figured it out and it was actually a quite easy fix, the following section in the web.config needs to be disabled:

 <authentication mode="Forms">
  <forms name="yourAuthCookie" loginUrl="login.aspx"
   protection="All" path="/" />
 </authentication>

After disabling the forms authentication section, I could easily enable Windows authentication on my Umbraco folder and disable anonymous access. Great!

This seems to be an unintentional "bug" that I've submitted (you can vote, if you care) to the core team for future consideration.

After that, I thought I'd also make it impossible to show the debug information on my live site. I had actually linked to an Umbraco book about this in an earlier post, so that should be easy, right? Wrong.

I immediately saw a glaring mistake in the rewrite code, it relied on me having ".aspx" in all of my URL's. But since I have set "useDirectoryUrls" to true (so that none of my pages end in ".aspx"), this would not work.

Maybe this book was written before you could even enable useDirectoryUrls, I'm not sure. I've made a new wiki article for it though.

The solution is as follows, any URL with a querystring in it, starting with umbDebug should be rewritten:

 
 <!-- Prevent the umbDebug querystrings from being used -->
  <add name="nodebug"
   virtualUrl="(.*)umbDebug.*"
   rewriteUrlParameter="IncludeQueryStringForRewrite"
   redirect="Application"
   destinationUrl="~$1"
   ignoreCase="true" />

Updated: Or... as Dirk and Shannon point out, in Umbraco 4 you can just disable the debugging by using:

<add key="umbracoDebugMode" value="false" />