Code

Loading ...
No ad for you

This theme supports syntax highlighting based on Rouge, which is the default highlighter in Jekyll 3 and above. All CSS styles for syntax highlighting stores in the amp-syntax-highlight.css under the _includes/css/ directory.

By default, this theme excludes the CSS styles for syntax highlighting. The AMP framework limits the total CSS styles up to 75,000 bytes per AMP page. This keeps light-weight and rendering fast.

To include the stylesheet on-demand, you need to add the following to your post’s front matter:

css:
  syntax: true

Markdown Syntax

Code can be presented in the following ways:

Code spans
To denote a word or phrase as code, enclose it in backticks (`). For example:
The HTML `<body>` Element represents the content of an HTML document.
Fenced code blocks
Use three backticks (```) or three tildes (~~~) on the lines before and after the code block with providing an easier way to specify the language, namely by appending the language of the code block to the end of the starting line. For example:
```ruby
def what?
  42
end
```
Use highlight tag
For example:
{% highlight ruby %}
def foo
  puts 'foo'
end
{% endhighlight %}
Including the linenos argument will force the highlighted code to include line numbers.
Include line numbers
{% highlight ruby linenos %}
def foo
  puts 'foo'
end
{% endhighlight %}

More information about code highlighting in jekyll can be found in Jekyll and kramdown documentation.

Samples

There are a couple of examples showing the resulting highlighted code:

The HTML <body> Element represents the content of an HTML document.

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>
// css code sample
#container {
    float: left;
    margin: 0 -240px 0 0;
    width: 100%;
}
// javascript code sample
$.ajax({
  type: 'POST',
  url: 'backend.php',
  data: "q="+myform.serialize(),
  success: function(data){
    // on success use return data here
  },
  error: function(xhr, type, exception) {
    // if ajax fails display error alert
    alert("ajax error response type "+type);
  }
});
def foo
  puts 'foo'
end
1
2
3
def foo
  puts 'foo'
end