Pager with Bootstrap 3 layout

Product name	Category
Product 31	Food
Product 32	Shoes
Product 33	Shoes
Product 34	Electronics
Product 35	Food
Product 36	Shoes
Product 37	Shoes
Product 38	Electronics
Product 39	Food
Product 40	Shoes

Razor code

<!-- Bootstrap3.cshtml view -->

@using MvcPaging.Demo.Models
@model IPagedList<Product>
@{
	Layout = null;
	ViewBag.Title = "Pager with Bootstrap 3 layout";
}
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>@ViewBag.Title</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<!-- Le styles -->
		<link href="@Url.Content("~/Content/Css/bootstrap3.min.css")" rel="stylesheet">
		<style>
			body {
				padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
			}
		</style>
	</head>
<body>
	<a class="sr-only" href="#content">Skip navigation</a>

	<!-- Docs master nav -->
	<header class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
		<div class="container">
			<div class="navbar-header">
				<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
			</div>
			<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
				<ul class="nav navbar-nav">
					<li>@Html.ActionLink("Home", "Index", "Home", new { area = String.Empty }, null)</li>
					<li>@Html.ActionLink("About", "About", "Home", new { area = String.Empty }, null)</li>s
				</ul>
			</nav>
		</div>
	</header>
	<div class="container">
		<h1>@ViewBag.Title</h1>

		<table class="table table-striped">
			<thead>
				<tr>
					<th>Product name</th>
					<th>Category</th>
				</tr>
			</thead>
			<tbody>
				@foreach (var product in Model) 
				{
					<tr>
						<td>@product.Name</td>
						<td>@product.Category</td>
					</tr>
				}
			</tbody>
		</table>
		@Html.Pager(Model.PageSize, Model.PageNumber, Model.TotalItemCount).Options(o => o
			.DisplayTemplate("Bootstrap3Pagination")
			.MaxNrOfPages(14)
			.AlwaysAddFirstPageNumber()
		)
	</div>
</body>

<!-- Bootstrap3Pagination.cshtml DisplayTemplate -->

@model PaginationModel
<ul class="pagination">
	@foreach (var link in Model.PaginationLinks)
	{
		@BuildLink(link)
	}
</ul>

@helper BuildLink(PaginationLink link)
{
	var liBuilder = new TagBuilder("li");
	if (link.IsCurrent)
	{
		liBuilder.MergeAttribute("class", "active");
	}
	if (! link.Active)
	{
		liBuilder.MergeAttribute("class", "disabled");
	}

	var aBuilder = new TagBuilder("a");
	if (link.Url == null)
	{
		aBuilder.MergeAttribute("href", "#");
	}
	else
	{
		aBuilder.MergeAttribute("href", link.Url);
	}

	// Ajax support
	if (Model.AjaxOptions != null)
	{
		foreach (var ajaxOption in Model.AjaxOptions.ToUnobtrusiveHtmlAttributes())
		{
			aBuilder.MergeAttribute(ajaxOption.Key, ajaxOption.Value.ToString(), true);
		}
	}

	if (link.DisplayText == "«")
	{
		aBuilder.InnerHtml = "&laquo;";
	}
	else if (link.DisplayText == "»")
	{
		aBuilder.InnerHtml = "&raquo;";
	}
	else
	{
		aBuilder.SetInnerText(link.DisplayText);        
	}
	liBuilder.InnerHtml = aBuilder.ToString();

	@Html.Raw(liBuilder.ToString())
}

Controller code

public ActionResult Bootstrap(int? page)
{
	int currentPageIndex = page.HasValue ? page.Value - 1 : 0;
	return View(this.allProducts.ToPagedList(currentPageIndex, DefaultPageSize));
}