Pauli's software -> Vedit resources -> Syn2html 31. 01. 2010  

Syntax highligted listing in html

This Vedit macro generates color syntax highlighted listing in HTML format from source code. The listing can be used as a web page as it is, or you can paste the listing into an existing web page. This macro can also be used for printing with syntax highlight.

The macro automatically detects the syntax file configured for the file type and reads keywords etc. from that file. It highlights keywords groups 1 to 4, comments, line comments and strings. The words are highlighted using CSS, so it is easy to change the colors and appearance of the listing (bold and italic characters etc.).

The macro should work quite well with most .syn files. However, since the pattern codes in .syn files are somewhat different from the codes in search command, some of the syntax files may not work 100% correctly. Further, symbols and numeric values are not highlighted.

If a block is highlighted, the macro creates HTML listing for the highlighted block. Otherwise, the whole current file is processed.

Using the macro

Using this macro is simple. Just follow these steps:
  1. Load the program source file or other file that uses syntax highlight (you must have the syntax highlight enabled in Vedit).
  2. Run the macro syn2html.vdm.
  3. Select the options you want from the dialog box (see below) and click OK.
    A new buffer is opened to hold the html file.
  4. To open the HTML file in your browser, select
    "File" -> "Open (More)" -> "Preview current file in browser"
    or click the toolbar button for that function. (The file will be automatically saved if necessary.)

For syntax highlighted printing, just print the HTML file from your web browser.

The filename for the resulting html file is generated as follows:   The dot before the extension is relpaced with underscore, and extension .htm is added. For example, if the original source file was main.c, the html file generated will have the name main_c.htm. The path for the file can be configured, see below.

The Dialog Box

The following options can be selected from the dialog box:

When the listing with CSS code has been created, you can change it to suit your needs. For example, you may want to change the colors, or to remove the "font-weight: bold" settings if you do not want the keywords to be in boldface. Alternatively, you could change the code that generates CSS in the macro itself.


See the example of C listing below. This is an example of how you can include the listing as part of a web page.
For more examples, click the links below. These are un-modified HTML files generated by the macro.

- eyeCandy_bas.htm - Example of Basic (RapidQ) source listing
- syn2html_vdm.htm - Example of Vedit macro: listing of syn2html.vdm v1.0

Download:   syn2html.vdm   -   V1.1   (06.04.2009)   -   14K

Example listing in C


  /*  Calculate cosine */

  #include <stdio.h>

  #define PRECISION  1.0e-6
  #define PI         3.14159265

  /* Calculate cos(x) where x = the angle in radians */

  float cos(float x)
    int    n, sign;
    float  term, value;
    n = 1; sign = -1;
    value = 1; term = 1;
    while (term > PRECISION) {
      term = term*x*x/n/(n+1);
      value = value + sign*term;
      n = n+2;
      sign = -sign;

  /* Main program */

    float deg, rad, result;
    int x,y;

    printf("This program calculates cos(x).\n");
    printf("Give the angle x in degrees:\n");
    rad = deg*PI/180;
    result = cos(rad);
    printf("Result = %f\n\n", result);


Change log

Changes from version 1.0 to 1.1: