Line Numbers

Adding them to Example Code


Created by Mike Miles | @mikemiles86

About

This presentation demostrates using a custom javascript library to add line numbers to example code in a Reveal.js presentation.

The code for this library is available Here

The source code for this presentation is available here

Example code

with no line numbers


/**
 * Example Code.
 */
function my_example_code($line_numbers = TRUE) {
  $message = 'This example code does';
  $message .= ($line_numbers ? '' : ' not');
  $message .= ' have line numbers.';

  return $message;
}

print my_example_code(FALSE);
            

Example code

with class "line-numbers"


/**
 * Example Code.
 */
function my_example_code($line_numbers = TRUE) {
  $message = 'This example code does';
  $message .= ($line_numbers ? '' : ' not');
  $message .= ' have line numbers.';

  return $message;
}

print my_example_code(TRUE);
            

Example code

with highlighted line numbers


/**
 * Example Code.
 */
function my_example_code($line_numbers = TRUE) {
  $message = 'This example code does';
  $message .= ' have line numbers';
  $message .= ' and highlighter lines.';

  return $message;
}

print my_example_code(TRUE);
            
Fork me on GitHub