HTML helpers are methods that return the HTML content in view. We have
some below available html helpers methods in ASP.NET MVC.
@Html.BeginForm
@Html.EndForm
@Html.TextBox
@Html.TextArea
@Html.Password
@Html.Hidden
@Html.CheckBox
@Html.RadioButton
@Html.DropDownList
@Html.ListBox
Sometimes above HTML helpers are very limited for a
particular scenario.
And if you are working on a large MVC project and for a
specific reason we need to have custom HTML Helpers so that we can reuse it as
per our need. So MVC provide to create Custom HTML Helper.
We have 2 ways to create custom HTML Helper.
1. Creating Extension Method on Html
Helper Class
2. Creating Static Methods
Benefit of using Custom HTML Helper is that you can
write a unit test case for this particular custom html helper.
Extension
Method =>Create Custom HTML Helper in Asp.Net MVC
Add
a new class in Models folder =>MyCustomHelpers.cs
Here I am going to use Extension method for Label and
Image control.
I have added an Image to show in this image control.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Html;
namespace CustomHtmlHelperInMVC.Models
{
public static class MyCustomHelpers
{
public static IHtmlString CustLabelExt(this HtmlHelper helper, string Content)
{
string htmlString = $"<label
style=\"background-color:red;color:white;font-size:40px;border:solid 5px
green;padding:4px;\">{Content}</label>";
return new HtmlString(htmlString);
}
public static MvcHtmlStringImage(this HtmlHelperhtmlhelper, string source, string altTxt, string width, string height)
{
var ImageTag = new TagBuilder("img");
ImageTag.MergeAttribute("src", source);
ImageTag.MergeAttribute("alt", altTxt);
ImageTag.MergeAttribute("width", width);
ImageTag.MergeAttribute("height", height);
return
MvcHtmlString.Create(ImageTag.ToString(TagRenderMode.SelfClosing));
}
}
}
Now
come to your Index.cshtml and use custom control like below:
@usingCustomHtmlHelperInMVC.Models
@{
ViewBag.Title = "ASP.NET
MVC - Custom HTML Helpers";
}
<divclass="jumbotron">
<h7>ASP.NET MVC - Custom HTML Helper</h7>
@Html.CustLabelExt("This
is Custom Label by Extension Methods.")
<br/>
@Html.Image("../Image/RS.jpg", "", "200", "200")
</div>
Now Run your application.

Image
1.
Static
Method => Create Custom HTML Helper
in Asp.Net MVC
Do below code in
MyCustomHelper.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Html;
namespace CustomHtmlHelperInMVC.Models
{
public static class MyCustomHelpers
{
public static IHtmlString MyCustLabel(string Content)
{
string custLableStr = $"<label
style=\"background-color:orange;color:blue;font-size:30px\">{Content}</label>";
return new HtmlString(custLableStr);
}
}
}
Now your view.cshtml
@using CustomHtmlHelperInMVC.Models
@{
ViewBag.Title = "ASP.NET
MVC - Custom HTML Helpers";
}
<divclass="jumbotron">
<h7>ASP.NET MVC - Custom HTML Helper</h7>
<br/>
@MyCustomHelpers.MyCustLabel("This is Custom Label by Static Methods.")
</div>
Now
Run your application

Image
2.