Dynamics CRM HTML Web Resources in Visual Studio 2013

Roshan Mehta, 15 July 2013

Microsoft has released some great new features with Visual Studio 2013 that is guaranteed to please Dynamics CRM developers. At Build 2013, Scott Hanselman and Mads Kristensen showcased some time-saving shortcuts that will surely help developers focus on their coding and get their jobs done faster. Please note that some of these features are made available through the Web Essentials 2013 extension, but may be released as part of the Visual Studio 2013 final product.

Special Characters

Web developers will know how difficult it is to add special characters to an HTML page. A popular character for web pages is the “copyright symbol”. Personally, I would insert the symbol into Microsoft Word document and then copy it back into the HTML editor. With Visual Studio 2013, you can simply hold down SHIFT + 7 (the ampersand key) and the HTML editor will display a drop-down-list of all special characters to insert into your document.

 Dynamics CRM HTML Web Resources in Visual Studio 2013

Smart Tags

Like the CSS editor, smart tags allow developers to simply hover over an HTML tag to quickly view or define the properties of the tag. For example, you can hover over the <img> tag and select Insert Height and Width Values. Visual Studio 2013 will find the image on disk and insert the correct height and width values into the <img> tag. Visual Studio 2013 also provides the ability for you to define your own smart tags.

 Dynamics CRM HTML Web Resources in Visual Studio 2013

Dynamics CRM HTML Web Resources in Visual Studio 2013

Another useful feature is the ability to quickly write complex HTML structures with nested tags all in a single line. For example, if we want to define a section with a single div tag which contains an unordered list with four items, we can simply write the following code:

section>div>ul>li*4

After hitting TAB, the HTML editor will automatically write out and format the HTML code for you!

 Dynamics CRM HTML Web Resources in Visual Studio 2013

It is also very easy to generate lorem ipsum text by simply typing “lorem” and then hitting the tab key.

 Dynamics CRM HTML Web Resources in Visual Studio 2013

Dynamics CRM HTML Web Resources in Visual Studio 2013 

Voice Commands!

No I’m not kidding, Visual Studio 2013 includes voice commands to do things like launch the options window or format HTML documents. Stay tuned for a future post which will show a video demonstration.

Microsoft has invested a lot of time and effort into improving the web development experience in Visual Studio 2013. Like the enhancements made to the JavaScript and CSS editors, the changes made to the HTML editor are designed to eliminate the need to fiddle around with code so you can quickly produce rich web experiences with little hassle.