How To: Asp.NET Mvc Seo Frienly Urls

I saw a lot of questions about generating Asp.Net Mvc Seo Friendly Urls on internet. In this post im going to show you how to create your very own seo friendly urls like below.

1. www.domain.com/my-perfect-article.html 
2. www.domain.com/my-perfect-article. 

It's realy depends your choise. with that tecnic you do not realy need to specify a controller, action or parmeters like post id.

In fuct we just store our seo link in our database as unique. And we will specify customs routes.

Building Costum Route

As you know to access a content in mvc artitecture we need to call an url like below:
http://domain.com/Articles/Read/7

This pattern is pretty understandable. But we dont realy have any idea what the content about. And the id is obvious. We may want to hide it. Instead of this an url like above is most readable and search engines loves it. Because of it is  compatible with default route pattern. You dont need to modify routing class.

But still in this example we will modify default route pattern to have a url structure like below.

www.domain.com/my-perfect-article.html

If you do not modify default pattern you can have a url structure like below.

http://domain.com/Articles/Read/my_perfect_article/

As you can see we will not use Controllers, Actions, and parameters in url own url structure.The Title comes after the domain. Google loves it.

So, lets go step by step.

Preparing The Page of Our Content

To do this Create Read action in HomeController.

public ActionResult Read(string seolink)

{

Entry entry = db.Entries.SingleOrDefault(t => t.SeoLink == seolink);return View(entry);

}

<div>

<h3>@Html.DisplayFor(model => model.Title)</h3>

<div style="width: 800px;">

@Html.DisplayFor(model => model.Content)

</div>

<div>@Html.DisplayFor(model => model.Date)</div>

</div>

Adding SeoLink (slug) Property to The Entity

public class Entry

{

public int Id { get; set; }




[MaxLength(70)]

public string Title { get; set; }




[MaxLength(70)]

[Index(IsUnique = true)]

public string SeoLink { get; set; }

public string Content { get; set; }

public DateTime Date { get; set; }

public bool Published { get; set; }

public Category Category { get; set; } 

}

class="form-group">

@Html.LabelFor(model => model.SeoLink, htmlAttributes: new { @class = "control-label col-md-2" })

class="col-md-10">

@Html.EditorFor(model => model.SeoLink, new { htmlAttributes = new { @class = "form-control" } })

@Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })

Building Custum Route for Asp.Net Mvc Seo Friendly Urls

routes.MapRoute(

name: "ReadSeo",

url: "{seolink}",

defaults: new { controller = "Home", action = "Read" }

);

routes.MapRoute(

name: "Default",

url: "{controller}/{action}/{id}",

defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }

);

Route patterns order important here!







After all of this domain.com/Category will not work. I meant domain.com/Category/Index will not run. Because of ReadSeo route pattern.




So our final Route class wil be like below.




public class RouteConfig

{

public static void RegisterRoutes(RouteCollection routes)

{

routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(

name: "Category",

url: "Category",

defaults: new { controller = "Category", action = "Index" }

);

routes.MapRoute(

name: "Entry",

url: "Entry",

defaults: new { controller = "Entry", action = "Index" }

);

routes.MapRoute(

name: "ReadSeo",

url: "{seolink}",

defaults: new { controller = "Home", action = "Read" }

);

routes.MapRoute(

name: "Default",

url: "{controller}/{action}/{id}",

defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }

);

}

}




End of the How To: Asp.NET Mvc Seo Frienly Urls.