Al Nyveldt

Balsamiq Mockups Review

Al Nyveldt — Fri, 28 Aug 2009 17:12:20 -0500

I’m pretty late this this game, but… I got here in the end. I needed to make a few mockups recently and I wasn’t really excited about any of the options that I had before me.

Until this time around, I used my trusty pencil and paper or white board depending on the situation. This was always less than ideal and my attempts to use software to build them always took way to much time to do the same thing. This time around, I gave Balsamiq Mockups a try. It was exactly what the mockup experience should be.

The simple interface made the process take just about the same amount of time as using a whiteboard. You drag and drop buttons, controls, etc right into your work space. Double click to edit the default text and done. While this may take a slight bit longer, it has the advantage that you can just move the items on the screen with your mouse instead of having to erase and redraw. The resulting mockups have a hand drawn feel to them which gives the feel of mockup as well. I was able to quickly make a few mockups of forms AND when I was done I had a nice electronic copy to share with my client.

Balsamiq Mockups runs on Adobe AIR so it runs great on a Mac, PC and in a web browser. ( I used the desktop version on my Mac, but I did install the desktop version on my PC so I’m ready for next time.)

Disclaimer: I received a free license to this product. I didn’t need a license to do the work I did with it or to make the fine mockup you see before you, but I did get one so I wanted to be upfront.

BE Theme Tip: Adding default images for each category

Al Nyveldt — Tue, 28 Jul 2009 09:00:00 -0500

When I looked around at blog templates on different sites, I’m running across more and more templates that expect each post to have an image or two with it in the display template. I think it looks great, but I also think I would post even less if I had to have images in the certain sizes for each and ever post I wanted to make.

In thinking about it however, I decided it would work out pretty well for me if I picked out an image for each category and let my theme put the correct image into the template as needed. In my theme, I have only 2 image sizes and there are different enough that I decided to make images for both sizes, but if they were more similar, you might be able to get away with a single image and resizing it on the fly.

Since these images are part of how the post is displayed, the work for this is part of the PostView.ascx of your theme. I used the code behind file for this as well and added the following into my custom PostView class.

        1: protected string CategoryImage;

       2: protected string FeaturedImage;

       3: protected void Page_Load(object sender, EventArgs e)

       4: {

       5:     string imageRoot = Utils.AbsoluteWebRoot.ToString() + 

       6:         "themes/myTheme/images/categories/";

       7:     string catImageName;

       8:     if (Post.Categories.Count > 0)

       9:         catImageName = Post.Categories[0].Title.Replace(".", "");

      10:     else

      11:         catImageName = "NoCategory";

      12:     

      13:     CategoryImage = imageRoot + catImageName + ".jpg";

      14:     FeaturedImage = imageRoot + catImageName + "Featured.jpg";

      15:  

      16:     base.Page_Load(sender, e);

      17: }

Now I had a CategoryImage and FeaturedImage url string that I could use in my PostView.ascx to show the correct image for each post.

       1: <img src="<%=CategoryImage %>" alt="<%=Server.HtmlEncode(Post.Title) %>" />

It is a relatively simple trick, but gives you some neat customization on your blog. This concept can be used to do countless customizations to the PostVIew, CommentView and even the Site.Master pages in your theme.

BE Theme Tip: Make the front page look different

Al Nyveldt — Sat, 25 Jul 2009 13:19:46 -0500

I spent some time over the past few days working on a new theme for this blog. It had been a while since I had made a BlogEngine theme, but the process is still the same as it was 2 years ago. It is a fairly easy process and it really allows for a lot of customization with just the smallest amount of code.

I thought I would share a few of the techniques I used in making this theme over a few blog posts. Hopefully, they will come in handy for someone making their own theme and maybe inspire some more interesting themes in the BlogEngine realm.

One of the most interesting parts of the new theme is the different look on the front page of my blog. The front page on a BlogEngine blog is usually a list of posts (although this can be overridden to be a particular page in the admin section). The list of posts or post list is simply a display of a set number of posts one after another. Each post is displayed using the PostView.ascx of the specific theme. The number of posts depend on the settings you have chosen in your admin section. There is also a setting that determines if the post is displayed in full in the post list or if just the description (or first so many characters) are displayed.

Armed with this basic information, we know that all we need to do is put a little custom code in the PostView.ascx to change the look of the page based on what type of page it is. In my case I really only care if I’m displaying the post list or not, but you could easily write your code to check for a specific page, a particular categories or whatever.

The first thing I did was to make an enum called PageStyle with 3 values (Page, Front, and Featured). Page is for general formatting. Featured is the top item on my front page and Front is the other items on my front page. I then added a ViewStyle variable to my theme’s PostView class in PostView.ascx.cs and the code in in the page load to set ViewStyle based on what page is being displayed. A trimmed down snippet of this code is below.

        1: protected PageStyle ViewStyle;

       2:  

       3: protected void Page_Load(object sender, EventArgs e)

       4: {

       5:     string path = Request.RawUrl.ToLower();

       6:     if (path.LastIndexOf('/') > -1)

       7:         path = path.Substring(path.LastIndexOf('/') + 1);

       8:     if (path.StartsWith("default.aspx") || path.StartsWith("blog.aspx") || path == "")

       9:     {

      10:         ViewStyle = PageStyle.Front;

      11:  

      12:         // Latest Post?

      13:         BlogEngine.Core.Post temp = Post.Next;

      14:         if (temp == null)

      15:             ViewStyle = PageStyle.Featured;

      16:     }

      17:     else

      18:     {

      19:         ViewStyle = PageStyle.Page;

      20:     }

      21:  

      22:     base.Page_Load(sender, e);

      23: }

Now that I have ViewStyle set, I can use this in my PostView.ascx page to dramatically change the look of the html that will result for the different type of pages being called. I’ve put a few samples in the snippet below.

       1: <% if (ViewStyle == PageStyle.Page) { %>

       2: <div class="post-page">

       3:   ...

       4: </div>    

       5: <% } %>

       6:  

       7: <div class="<%=ViewStyle == PageStyle.Page ? "post-title" : "junk" %>">

       8: ...

       9: </div>

Personally, I like changing the classes of my divs and span tags where possible and use CSS to make the changes. Sometimes however, I’ve needed to actually use an if block to make the display look as I’d like.

A quick note for those trying this with an existing theme. Most themes I’ve seen do not have a code behind file for the PostView.ascx. You can make one, but make sure you reference it in the PostView.ascx file and that your cs file inherits from BlogEngine.Core.Web.Controls.PostViewBase. If you forget this, you won’t get anything to work.

Hopefully, this is helpful to someone. If you have questions or I need to be more clear, let me know in the comments.

5 iPhone apps that have changed the way I work

Al Nyveldt — Thu, 28 May 2009 23:19:33 -0500

I've been a big fan of my iPhone since I got it back in October 2007. It was a game changing device for me back then. I went from carrying a phone and an iPod to work to a single device. I had mobile web browsing, good email access, and a solid phone which was a major upgrade from my Audiovox Smartphone and I could load up my audio as well.

After 3rd party apps became a reality, I've slowly started to add some to my device. As I was driving home from work today, I was thinking about all the different ways the iPhone has change my work day. Since most people are already aware of the included iPhone apps, I thought I'd share some of the 3rd party apps I use on a regular basis and have added them into my routine.

Todo - This is the most expensive iPhone app I've purchased and it is also the one I'd miss the most if I lost my iPhone. The iPhone doesn't have a good todo list option and I really need something to help me management my tasks. I've become a huge fan of Remember the Milk (RTM) for managing all my tasks, but the RTM iPhone app just wasn't exactly what I wanted. Todo is. Someday I'll likely write a detailed post on my task management process which after many years of struggles, I'm really happy with.

Jobs – Jobs is basically a fancy timer. It helps me keep track of time I spend working for clients. I keep my hours log right there and I don't have to bother to remember how long I spent on this, I simply need to start and stop the timer. I got onto this system using the Freshbooks app, but since I stopped using Freshbooks, Jobs is my time tracker of choice. This is another area that I always struggled with until I got into a system with the iPhone.

Bible - I really like reading the Bible on my iPhone for some reason. I think it was the first app I downloaded and I still use it all the time. I haven't tried any Bible apps other than this one, but I can’t imagine finding anything better. I love how I quickly change versions of the Bible and search to find the verse I was looking for. It is a great reading or studying tool.

Simplify Music 2 - This is an incredible app. I have an 8GB iPhone and I like to leave space for music, podcasts, audiobooks, apps, and files. I don't get to carry all the music I might want to listen to while at work or on the road, but with this app, I can just stream it off of my Mac or PC at home.

Air Sharing - I picked this one up when it was a free app while I thought it was neat I didn't realize the flexibility it gave me. Its basic function is to give you a wireless "USB key", but when you put files on it, you can read them or listen to them as needed. I use the file transfer on occasion as it is a nice option, but I'm more likely to download something I want to listen to on the way home from work or read a document I stored on it from this app. I use this the least of the apps listed here, but I'm always amazed by how it really transforms the iPhone to a computer in my mind. I no longer need to move the file to PC or sync it up to actually access the file.

There are other apps that I use on a regular basis, but I don't view them as routine changing. What iPhone apps have really changed your work habits?

BlogEngine.NET 1.5 Upgrade Guide

Al Nyveldt — Mon, 13 Apr 2009 19:40:52 -0500

With the final release now out the door, I want to take a little time to walk you through the process of upgrading your version of BlogEngine.NET.

As you’d expect, the upgrade process is fairly easy, however, I try to go into lots of details to cover as many different scenarios as I can. While the following guide is long, I fully expect, most of you will be able to skip a section or two along the way and be upgraded quickly and painlessly.

This guide was written from the perspective of upgrading from 1.4.5 to 1.5. If you were one of the people who tried out the 1.5 release candidate, this will work fine for you too. If you are using an older version, it would be best to read this over, but also to look at some of the past upgrade guides to learn about some other important changes.

1. Backup

This is my favorite step in the process. If you do this, there should be no fear of upgrading and in the horrific case of a problem, you can just revert back to your backup.

If you can’t bring yourself to backup the whole blog, be sure to at least get your App_Data folder, your themes and extensions, and your web.config file.

2. Download BlogEngine.NET 1.5 (web)

I’m sure you have already done this step, but if you haven’t, this is the time. You can download it here.

Once you have it downloaded, go ahead and unzip it and then remove the read only check in the properties. (apply to all subfolders and files).

3. Update your data and configuration

If you use the default XML data storage, you can move along to the next step. If you are not sure, you are likely using the default option, so you should move on too.

Welcome database person. It is time to update your database. It is a small change, but required.

In the newly downloaded BlogEngine folder, you will see a Setup folder. In this folder is a folder for each of the supported databases, MySQL, SQLite, SQL Server, and VistaDB. Find the one for the database you use and open the folder.

There is a readme.txt in the folder with instructions on upgrading. There should also be an upgrade script for your database and a new web.config file that you will need to put in place.

The web.config has changed since 1.4.5 and it is easiest to just use the new version that is included in the download and add your connection string info to it. If you made other changes, than you are on your own.

If you are using the SQLMembershipProvider and SQLRoleProvider, you’ll want to make sure you make this change in your web.config. We are defaulting to the DbMembershipProvider and DbRoleProvider to keep things simple.

4. Update your web server

We should be ready to start copying files to our web server. If you skipped step #1, this is your last chance to do that.

I find it smoothest to remove all the blog files and folders I don’t plan to keep first. Since I have a backup, I keep my App_Data folder and remove the rest. (I will put back my themes, extensions, and widgets later.)

Uploading to a remote web server can take a while. Be patient.

5. Security

This is not something to be concerned about unless you are upgrading from an older version, but I wanted to mention it for those coming from 1.3.1 or older. Please read the old guide to get the scoop. If you are a more current user, you can hold your head up high and move on to step #6.

6. Themes and Extensions

If you are using a custom theme, you will need to upload it right away. Any special widgets or controls you might be using will need to be there too for the theme to start up properly.

Make a note of what files you are putting out to your web server in case you have issues. If trouble arises, I’d start by switching themes to the Standard theme to make sure the default setup is working for you.

7. Open your site in your browser

It will take a few moments the first time around, so don’t panic if it does not come up right away. In a moment or two, if everything is well, you will see your blog.

If you have an error or display issue, take a look at the troubleshooting section below.

8. Clean up

If you didn’t copy all any themes, widgets, or extensions out, now is the time to do so. Refresh your browser once they are copied to have them take effect.

9. Theme updates

If you are not using one of the default themes, you’ll want to take a look at the comment form. A few tags were changed here and you may want to change the css for the comment section. Also, if you plan on enabling Nested Comments (see the Settings page), you will want to make some adjustments to your theme to handle it. See the comment view documentation page on our wiki.

Enjoy the goodness that is BlogEngine.NET 1.5!

Troubleshooting

Don’t fret. Any problems you’ve had have likely been seen before. Below are a few common things to check. If these don’t help, please head on out to the BlogEngine forums. If you can’t find the answer searching there, make a new post and ask for help.

Compile Errors:

Are you running MySQL, SQLite, or VistaDB? Are you sure you are using the version of the DLL listed in the web.config?
If you are using MySQL or SQL Server, do you have the correct connection string in your web.config?
Did you clean out all the old BlogEngine files or did you just overwrite them? Did an old file get left in place?
Did your FTP program miss a few files? It would be a good idea to make sure everything is uploaded.
Did you have a customized web.config before? Did you merge the changes in? Or are you using your old web.config?

BlogEngine Issues:

Can’t login? Were you using the SQLMembership Provider before and forget to configure it? If you are a DbMembership or XMLMembership user, you can clear out the password and log in with “admin”.
An application restart might help if you are locked up.

If you are still having an issue, please head on over to the forums. Search first as someone has likely already had the same issue, but if not, please ask.

Good luck and Happy Blogging!

BlogEngine.NET 1.5 Released

Al Nyveldt — Mon, 13 Apr 2009 17:21:00 -0500

The BlogEngine.NET team is pleased to announce that the final version of BlogEngine.NET 1.5 is now available for download. We had a good test run with the release candidate released earlier and after making a few small updates and bug fixes, the final version is ready to go.

As I mentioned in my previous post, this release has some great features and lots of performance improvements and bug fixes that make 1.5 a great upgrade for the existing BlogEngine user and wonderful option for someone just starting out.

The main features are:

Nested Comments can now be enabled.
BlogEngine.NET runs on Mono 2.4 out of the box.
Windows Live Writer support is superb and includes the new tagging feature that only BlogEngine.NET and WordPress support.
TinyMCE was updated for the web based writer.

You can download it here and then watch the installation screencasts if you need any help getting started.

Installation screencasts for BlogEngine.NET 1.5

Al Nyveldt — Sun, 05 Apr 2009 23:14:38 -0500

New version, new screencasts. (Yes, that is plural as I have many screencast ready to go.)

With BlogEngine.NET 1.5 RC being made available, I decided to update the installation screencast and a few of the database setup screencasts that commonly follow.

Installing BlogEngine.NET 1.5 Screencast

Setting up BlogEngine.NET 1.5 with SQL Server

Setting up BlogEngine.NET 1.5 with VistaDB

Setting up BlogEngine.NET 1.5 with SQLite

If you have questions or are running into problems, please check out the BlogEngine.NET forums. There are lots of helpful people there and tons of great information available.

Good luck with your BlogEngine.NET installation.

BlogEngine.NET 1.5 Release Candidate available

Al Nyveldt — Sun, 05 Apr 2009 22:17:23 -0500

This evening, the BlogEngine team made the release candidate available for BlogEngine.NET 1.5. This release was a long time in process and we felt is was best to make a release candidate available first.

I’m personally very excited about 1.5. The highlights include:

Improved Live Writer Support (including the new Tagging feature).
TinyMCE update
Ready for Mono 2.4.
Nested Comments are now available.
Better database support out of the box.
and, of course, lots of bug fixes, performance improvements, and other updates to make your blog experience better.

Please download it and give it a spin.

Installing BlogEngine.NET with the Microsoft Web App Gallery

Al Nyveldt — Wed, 18 Mar 2009 21:28:37 -0500

Today, Microsoft announced the new Web Application Gallery where you can browse and install web application right to your web server.

We were honored to have BlogEngine.NET included in the initial release of the gallery and enjoyed working with the team at Microsoft to get it ready for the Mix 09 release.

I made a quick screencast tonight to show you exactly what it is like to install BlogEngine using the new installer. It is now even simpler to get setup with BlogEngine.NET as the installer will check your dependencies and make sure you have everything you need in place to get up and running.

The installer will setup your blog with an XML backend at this time. You can then convert it to use SQL Server, MySQL, SQLite, or VistaDB after you’ve got up and running with XML. We will work on getting more options available for the release of BlogEngine.NET 1.5.

Updating to VistaDB Express 3.4

Al Nyveldt — Thu, 19 Feb 2009 22:23:48 -0500

As I’ve stated in the past, I use VistaDB Express to store the data for this blog. I really like the clean gui interface and the fact that it matches the SQL Server data types so well. It has been a pleasure to work with from my perspective.

I have not taken the plunge and purchased a full license as I don’t need it. I have been checking in on VistaDB’s blog and forums however. They have been busy making updates and fixed a minor issue I had been having with the express edition. While the progress was great news, it didn’t help me as the express edition hadn’t received any of these updates. Finally, last week, just a few days as I was planning a workaround to my issue, the updated Express edition was released.

Tonight, I finally got around to updating my blog from VistaDB Express 3.3 to 3.4. The process was pretty simple.

Backup your blog. Not really needed, but skip at your own peril.
Download and install VistaDB Express 3.4 to get the updated VistaDB.NET20.DLL.
Edit your web.config and change the VistaDB assembly from “3.3.1.54” to “3.4.2.77”. My web.config had this in information in 4 places. The DbProviderFactories section, the runtime section, and the system.web assemblies section.
Upload and overwrite the edited web.config (root) and the VistaDB.NET20.DLL (Bin folder).

There aren’t a lot of benefits to the this update that you’ll notice in BlogEngine.NET 1.4.5, but BlogEngine.NET 1.5 setup will be expecting the latest version in the default config.