Hello Blogger!

When writing a coding blog, one of the first decisions you have to make is how to render syntax highlighting. In this case, I’m using StackEdit to convert markdown into html. Among others, it uses highlight.js to convert <pre><code> blocks into beautifully formatted classes. Then I’m using the Visual Studio theme to apply the particular format for each class hosted off this Github project and available here:

<link href="http://kylemitofsky.com/libraries/libraries/HighlightColors.css" rel="stylesheet" />
<link href="http://kylemitofsky.com/libraries/libraries/BloggerStyles.css" rel="stylesheet" />

Here’s a quick listing of the languages I intend to use:

VisualBasic

'''<Summary>Method Does This</Summary>
Private Sub OnTextBoxTextChanged(sender As Object, e As TextChangedEventArgs) Handles Me.TextChanged
    'comment
    Dim senderText As TextBox = DirectCast(sender, TextBox)
    Dim bindingExp As BindingExpression = senderText.GetBindingExpression(TextBox.TextProperty)
    bindingExp.UpdateSource()
End Sub

CSharp

public class Program
{
    /// <summary>The entry point to the program.</summary>
    public static int Main(string[] args)
    {
        Console.WriteLine("Hello, World!");
        string s = @"This
                    ""string""
                    spans
                    multiple
                    lines!";
        return 0;
    }
}

JavaScript

$('.tabs-student a').click(function (e) {
    e.preventDefault();
    $(this).tab('show');
});

HTML

<ul class="nav nav-tabs tabs-student">
  <!-- comment -->
  <li class="active"><a href="#tab-activity">Activity</a></li>
  <li class=""><a href="#tab-sales">Sales</a></li>
</ul>

CSS

pre.prettyprint {
    width: 600px;
    overflow: auto; /*Set to Auto*/
    max-height: 600px;
}

XAML

<Storyboard>
    <!-- comment -->
    <ObjectAnimationUsingKeyFrames 
            Storyboard.TargetName="ContentGrid"
            Storyboard.TargetProperty="Background">
      f  <DiscreteObjectKeyFrame KeyTime="0" Value="Blue"/>
    </ObjectAnimationUsingKeyFrames>
</Storyboard>

XML

<?xml version="1.0" encoding="utf-8"?>
<Stock Date="13.11.2013">
  <Assortment>
    <!-- comment -->
    <Item>Sock</Item>
    <Quantity>1</Quantity>
  </Assortment>
  <Assortment>
    <Item>Puppet</Item>
    <Quantity>2</Quantity>
  </Assortment>
</Stock>

ASP.NET

<asp:DropDownList runat="server" 
                  DataSourceID="SomeDS"
                  AppendDataBoundItems="true"> 
    <!-- comment -->
    <asp:ListItem Text="Please select an option" Value="" />
</asp:DropDownList>

SQL

BEGIN;
CREATE TABLE "topic" (
    "id" serial NOT NULL PRIMARY KEY,
    "forum_id" integer NOT NULL,
    "subject" varchar(255) NOT NULL
);
ALTER TABLE "topic" ADD CONSTRAINT forum_id FOREIGN KEY ("forum_id") REFERENCES "forum" ("id");

BONUS - Formatted Code

As long as you do the escaping, you can apply any formats you like to a <pre class="prettyprint"><code class="cs"> block.

async Task AccessTheWebAsync()
{
    // Link to System.Namespace
    string boldline = ""
    string italics = ""
    int underline = 0;
    bool strikeThrough = true;
    CustomClassNames
    int dimmedAge = 7;
    highlight some code
    @Html.EditorFor(model => model.FirstName)
}