SEO Friendly MVC routing

            

              Normal routing in asp.net mvc is not much SEO friendly. Commonly we are using {controller}/{action}/id route by default.

  Default routing:
                   routes.MapRoute(

                "Default", // Route name
                "{controller}/{action}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
            );

normally we are using an integer number in the place of id (usually database table keys). Urls like this is not SEO friendly ( eg:    www.yourdomain.com/Location/details/2). If  we can build a url with string which is the name of the particular item( eg: location,book,movie etc). it will become more SEO friendly. Such as www.yourdomain.com/Location/details/Location name.
      This is possible in asp.net mvc by adding one more route in Global.asax. Note that newly added url parameter must be optional because we dont need that parameter in normal cases. It's been purely using for  SEO.

Here is the Global.asax code.

 routes.MapRoute(
                "Default1", // Route name
                "{controller}/{action}/{id}/{id1}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional, id1 = UrlParameter.Optional } // Parameter defaults
            );

Add the above code also in Global.asax Default route.

The action will be like this

[OutputCache(CacheProfile = "Cache1Hour")]
    public ActionResult Details(decimal id, string id1)
    {
        CDataStructLocationDetails objeDetails = new CDataStructLocationDetails{Id = id,Typeid        =3};
        return ViewEx(EnActions.Details, objeDetails);
        
    }

Sample Urls:
     www.yourdomain.com/Package/Details/5/Kerala-Honeymoon-Package.

Blank spaces in Urls replaced by %20 to avoid this we can send the name by replacing blank spces with '-'
here is the sample.

<%= Html.ActionLink("View Package Details", "Details",

                              new{id=item.Id,id1=item.PackageName.Trim().Replace(' ','-')})%>

NuGet

What is NuGet?

                                                      
        NuGet is a package manager for .Net. Using this you can search the packages and add it in to your project very easily.

      How can I install NuGet?
                   Installing of NuGet is very simple, Now NuGet is available as a VS Extension. You can install NuGet very quickly.
                   Tools -> Extension Manager ->
and search NuGet and Install it.

How can I Add a Package using NuGet?
             Adding Packages for our Project is very simple using NuGet.

right click on References and Select Add Library Package Reference Option. This will shows an add Libraypackage window from this you can search your package and install it in to your project using a single click(also uninstall by a single click) or you can select it in Project menu

Project -> Add Library Package Reference

Here I'm going to add ELMAH(Error Logging Modules and Handlers)  package reference.

   After Installing ELMAH package reference you can see the Elmah reference at the reference folder

Also NuGet added a new configuration file package.config and made some changes in web.config to work ELMAH

Automatically generated Package.config contents

                                 Here is the automatically created changes in web.config

Here is the elmah.axd view where we can see the logged errors

If you want to remove the ELMAH, you can simply do it by selecting uninstall option

after uninstalling elmah NuGet will remove all added references and files (Package.config file and changes in web.config etc)

You can create your own package for your company framework or other requirement. I will explain it in my next blog post.

Read More about Nuget:

Microsoft opened a Nuget gallery http://nuget.org. This site allows anyone to search and browse a online gallery of  open source packages availble via NuGet.

Read more from  Phill Haack  and  Scott Hanselman blog posts

@helper in Razor view.

          You can create your own custom html helpers in Razor, using a brand new syntax @helper in Razor. Creating a html helper using @helper is very much easier than our current html extension method types.

@helper in Razor view engine.

            This is a sample example for @helper usage. I've create a textbox helper which accepts a name and a value and will create a text box for MVC 3 Unobstructive JavaScript validation. ( I used it for dynamically created views)

   You can read more about @helper in the from here and here

       @helper TextBox(string Name, object Value)

    {
     <input class="text-box single-line required" id='@Name' data-val-required='This field is required' name='@Name' type="text" data-val="true" value='@Value'/>
     <span class="field-validation-valid" data-valmsg-for='@Name' data-valmsg-replace="true">
     </span>     
}

Truncate Helper

@helper Truncate(string input, int length)
{
    if (input.Length <= length) 
        { @input } 
    else 
        { @input.Substring(0, length)<text>..</text>}
}