FOLLOW US
4dots Software CODE BLOG

Best JQuery Syntax Highlighter Plugin

We needed a good JQuery syntax highlighter plugin.

We found this one. It is called Prism and seems really good.

"Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s used in thousands of websites, including some of those you visit daily.";

To include it into your site :

1. Visit Prism Website

2. Press on the DOWNLOAD button and then select which additional languages you want to be able to highlight. Such as C#, PHP e.t.c.

3. Select additional plugins, such as the "Copy to Clipboard" plugin that we use.

4. Press the "Download JS" and "Download CSS" buttons.

5. Upload prism.css to your /css/ directory and prism.js to your /js/ directory

6. In your webpage or webpage template add inside your <head> tag :

<link href="/css/prism.css" rel="stylesheet" />
and inside your <body> tag add

<script src="/js/prism.js"></script>

7. That's it. Now just add <pre><code> before the code you want to highlight and then add </code></pre> after the code you want to highlight. Also add the CSS class "language-xxxx" to the code tag. Where xxxx is your desired language such as html, css, php, csharp e.t.c. For example :


<pre><code class="language-csharp">
... code here ...
</code></pre>

Example


using System;
using System.Collections.Generic;
using System.Text;
using System.Windows.Forms;
using System.ComponentModel;

namespace SimpleVideoCutterJoinerSplitter
{
    public class FourDotsTextBoxAutoSelect : System.Windows.Forms.TextBox 
    {
        public FourDotsTextBoxAutoSelect()
            : base()
        {
            
        }

        public bool SelectAllOnEnter = true;              

        public bool MoveToNextTextBox = true;
        
        protected override void OnEnter(EventArgs e)
        {
            base.OnEnter(e);

            if (SelectAllOnEnter)
            {
                this.SelectAll();
            }
        }

        protected override void OnClick(EventArgs e)
        {
            base.OnClick(e);

            if (SelectAllOnEnter)
            {
                this.SelectAll();
            }
        }

        protected override void OnTextChanged(EventArgs e)
        {
            base.OnTextChanged(e);

            if (MoveToNextTextBox)
            {
                if (this.SelectionStart == this.MaxLength)
                {
                    int nextminleft = -1;
                    Control next_txt = null;

                    foreach (Control co in this.Parent.Controls)
                    {
                        if (co is TextBox)
                        {
                            if (co.Left > this.Left && (co.Left < nextminleft || (nextminleft == -1)))
                            {
                                next_txt = co;
                                nextminleft = co.Left;
                            }
                        }
                    }

                    if (next_txt != null)
                    {
                        next_txt.Focus();

                        if (SelectAllOnEnter)
                        {
                            ((TextBox)next_txt).SelectAll();
                        }
                    }
                }
            }
        }
    }
}

 

Please Donate!

Please Share!