This has been modified from @Burtio's. This has the TemplateWrapper needed for Jekyll installations. I also converted the css to scss. It has more properties that I needed for compatibility with our site's styling, and styling is based on OSX 10.11. I had to abandon this because gh-pages doesn't support custom plugins.

sample_entry.markdown

To get started with Rails we need to install the gem. From the terminal type:

{% terminal %}
$ gem install rails
Fetching: i18n-0.6.1.gem (100%)
Fetching: multi_json-1.3.6.gem (100%)
Fetching: activesupport-3.2.8.gem (100%)
...
{% endterminal %}

terminal.scss

/*-----------------------------------------------------------------------------------*/
/* Window
/*-----------------------------------------------------------------------------------*/

.window {
  margin: 0px auto 30px auto;
  background: #EDEDED;
  border-radius: 5px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 22px 50px 0px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(0, 0, 0, 0.2);
  text-align: left;
  z-index: 0;
  visibility: hidden;
  opacity: 0;
  visibility: visible;
  opacity: 1;

  .terminal-container {
    border-radius: 5px;
  }

  h1.titleInside {
    margin: 0px;
    position: relative;
    z-index: 2;
    color: #3c3c3c;
    font-size: 13px;
    line-height: 21px;
    text-decoration: none;
    text-shadow: 0 1px 1px #e7e7e7;
    text-align: center;
    text-transform: capitalize;
    font-weight: normal;
  }

  nav.control-window {
    float: left;
    padding: 2px 0px 0px 10px;
    left: 5px;
    top: 3px;
    z-index: 10;
    height: 19px;
    a {
      display: inline-block;
      margin: 2px 3px 3px 1px;
      width: 12px;
      height: 12px;
      border-radius: 100%;
      text-indent: -9999px;
      position: relative;
      border: none;
      box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3);
      &.close {
        background: #FB5149;
      }
      &.minimize {
        background: #FFB429;
      }
      &.maximize {
        background: #24C238;
      }
      &.deactivate {
        background: #b5b5b5;
      }
    }
  }
}

/*-----------------------------------------------------------------------------------*/
/* Terminal Console Layout
/*-----------------------------------------------------------------------------------*/

div.terminal {
  background: #333;
  color: #DDD;
  white-space: pre-line;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  width: 100%;
  table {
    margin-left: 10px;
    margin-right: 10px;
    box-shadow: none;
  }
  tr {
    padding: 0;
  }
  td {
    vertical-align: top;
    border: none;
    padding: 0;
  }
  pre {
    background: none;
    border: none;
    margin-top: 0.5em;
    padding-left: 0px;
    padding-top: 0px;
    box-shadow: none;
    -webkit-box-shadow: none;
    overflow-x: auto;
    span {
      display: block;
    }
    &.line-numbers span {
      display: inline;
      color: #586e75;
    }
  }
  overflow-x: auto;
  overflow-y: hidden;
  span {
    &.command {
      color: #FFF;
    }
    &.output {
      color: #BBB;
    }
  }
  code {
    background-color: transparent;
    display: inline;
    padding: 0;
  }
}

terminal_tag.rb

module TemplateWrapper
  # Wrap input with a <div>
  def self.safe_wrap(input)
    "<div class='bogus-wrapper'><notextile>#{input}</notextile></div>"
  end
  # This must be applied after the
  def self.unwrap(input)
    input.gsub /<div class=['"]bogus-wrapper['"]><notextile>(.+?)<\/notextile><\/div>/m do
      $1
    end
  end
end

module Jekyll

  class TerminalTag < Liquid::Block
    include TemplateWrapper

    def initialize(tag_name, markup, tokens)
      super
    end

    def render(context)
      output = super(context)

      %{<div class="window">
          <nav class="control-window">
            <a href="#finder" class="close" data-rel="close">close</a>
            <a href="#" class="minimize">minimize</a>
            <a href="#" class="maximize">maximize</a>
          </nav>
          <h1 class="titleInside">Terminal</h1>
          <div class="terminal-container"><div class="terminal">#{promptize(output)}</div></div>
        </div>}
    end

    def promptize(content)
      content = content.strip
      gutters = content.lines.map { |line| gutter(line) }
      lines_of_code = content.lines.map { |line| line_of_code(line) }

      table = "<table><tr>"
      table += "<td class='gutter'><pre class='line-numbers'>#{gutters.join("\n")}</pre></td>"
      table += "<td class='code'><pre><code>#{lines_of_code.join("")}</code></pre></td>"
      table += "</tr></table>"
    end

    def gutter(line)
      gutter_value = line.start_with?(command_character) ? command_character : "&nbsp;"
      "<span class='line-number'>#{gutter_value}</span>"
    end

    def line_of_code(line)
      if line.start_with?(command_character)
        line_class = "command"
        line = line.sub(command_character,'').strip
      else
        line_class = "output"
      end
      "<span class='line #{line_class}'>#{line}</span>"
    end

    def command_character
      "$"
    end

  end

end

Liquid::Template.register_tag('terminal', Jekyll::TerminalTag)