Code
Display numbered snippets colored code in code wells for easier readibility and instruction.
Code Wells
Code Wells are rendered with the <pre> element. Google's Prettify package is used to color-code the output. Line numbers are added by default. To remove them, simply remove the linenums class.
Unlike other HTML elements, the <pre> element preserves all spacing exactly as you type it. Note: Code may not render in color until you view the page in live or preview mode.
Pasting HTML Code Inside the <pre> Element
You will need to use the HTML converter on HTML, or other code which uses angle brackets.
// This is sample jQuery code ... Replace with your own code snippet
$( document ).ready(function() {
$('.navfeatures').addClass('active');
$('.navcodewells').addClass('active');
});
<pre class="prettyprint linenums"> // Place your code snippet here. Spacing is preserved... </pre>
HTML Converter
When pasting HTML or any code which uses angle brackets {< and >} into the <pre> element, you must first replace the angle bracket characters with their corresponding HTML entities {< and >} to render the code properly. This converter will perform the replacement and surround the code with <pre> tags.