Articles → .NET → Codeplex Syntax Highlighter

Codeplex Syntax Highlighter

In this tutorial I will explain how to use codeplex syntax highlighter in your project.

Software Requirement

Before you start reading this tutorial you should make sure that visual studio 2008(or above versions) is installed on your machine.

Prerequisite Knowledge

Before you go ahead, it is required that you should

Know how to create a web application (or website).
How to add a reference in the project?
What are namespace and class in .net?
What is a DLL? How to use it?

What Is Syntax Highlighter?

Syntax highlighter is for colorizing source code. Consider the following code

using Test;

Here I am declaring a namespace Test and the syntax is of C# language. But if you write the same code in any IDE like visual studio then the code written above like

using Test;

Here the keyword using is in blue color and the namespace name is in black color. This is what syntax highlighter does for your web application. In the next section I will tell you the scenario in which we can use this component.

Scenario Of Using Syntax Highlighter

If you are making a website in which you are writing .net technical white papers then to show the colorized code we can use this component. Before working on the component first of all download the DLL.

Download DLL

You can download this DLL from

http://colorcode.codeplex.com

Let us create a web application

Creation Of A Website

Picture showing the sample web application project created in visual studio

Click to Enlarge

Here I have created a web application in which we have a default.aspx(and cs) and a web.config file.

Adding DLL Reference

In the figure below I have elaborated the steps for adding this DLL as a reference in this project

Picture showing adding the reference of ColorCode.dll in the project

Click to Enlarge

Once you click Ok a reference is added

Picture showing the ColorCode.dll added in the project

Click to Enlarge

Creating Text File

Here I have created a text file inside the project and I have pasted the sample ASP.NET code inside it. Please see the image below.

Picture showing the sample code file to be used for syntax highlighter

Click to Enlarge

Adding Code In A Web Page

using System;
using System.IO;
using ColorCode;

public partial class _Default: System.Web.UI.Page {
  protected void Page_Load(object sender, EventArgs e) {
    string code = File.ReadAllText(Server.MapPath(@"~\code.txt"));
    string colorCode = new CodeColorizer().Colorize(code, Languages.Aspx);

    Response.Write(colorCode);
  }
}

Code Explained

First of all add a namespace ColorCode inside the file. In the page_load event first of all read the text file to get the code using ReadAllText method.

In the second line I have created a instance of CodeColorizer() class and pass the code and the language type(aspx in this case). This method returns the html string which is included along with your code so that you will get the colorized code.

Run Application

Run the application by pressing F5 or by clicking on play button. The following output will come as shown in figure below.

Picture showing the code after highlighting using colorcode.dll

Click to Enlarge

Conclusion

Using the codeplex’s DLL we can colorize the code keywords in any source file with the same color as we see in visual studio.

Posted By -	Karan Gupta

Posted On -	Tuesday, February 14, 2012

Query/Feedback

Your Email Id		**

Subject		*

Query/Feedback	Characters remaining 250	**