Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

I am using Jekyll and Markdown on Github for my blog. How do I insert code tags in my page?

I am using Jekyll and Markdown on Github for my blog. How do I insert code tags in my page?

example I was thinking I can use the <pre> tags to insert some code snaps into my page to display to the readers but jekyll does not like them..

Can someone please tell me a good formatting tag I can use with this to insert code in my page

if I try this code:

<pre>
  <code class="ruby">
git clone --mirror [email protected]:project project

cd project

git remote add github [email protected]:username/project.git


In cron Job

cd /pathto/project && git fetch -q && git push -q --mirror github
    </code>
</pre>

I get this error

enter image description here

My _config.xml

# This is the default format. 
# For more see: https://github.com/mojombo/jekyll/wiki/Permalinks
permalink: /:categories/:year/:month/:day/:title 

exclude: [".rvmrc", ".rbenv-version", "README.md", "Rakefile", "changelog.md"]
auto: true
pygments: true

# Themes are encouraged to use these universal variables 
# so be sure to set them if your theme uses them.
#
title : xxxx
tagline :xxxx
author :
  name : xxx
  email : jxxx
  github : xxx
  twitter : xx

# The production_url is only used when full-domain names are needed
# such as sitemap.txt 
# Most places will/should use BASE_PATH to make the urls
#
# If you have set a CNAME (pages.github.com) set your custom domain here.
# Else if you are pushing to username.github.com, replace with your username.
# Finally if you are pushing to a GitHub project page, include the project name at the end.
#
production_url : http://johnathanmarksmith.com

# All Jekyll-Bootstrap specific configurations are namespaced into this hash
#
JB :
  version : 0.3.0

  # All links will be namespaced by BASE_PATH if defined.
  # Links in your website should always be prefixed with {{BASE_PATH}}
  # however this value will be dynamically changed depending on your deployment situation.
  #
  # CNAME (http://yourcustomdomain.com)
  #   DO NOT SET BASE_PATH 
  #   (urls will be prefixed with "/" and work relatively)
  #
  # GitHub Pages (http://username.github.com)
  #   DO NOT SET BASE_PATH 
  #   (urls will be prefixed with "/" and work relatively)
  #
  # GitHub Project Pages (http://username.github.com/project-name)
  #
  #   A GitHub Project site exists in the `gh-pages` branch of one of your repositories.
  #  REQUIRED! Set BASE_PATH to: http://username.github.com/project-name
  #
  # CAUTION:
  #   - When in Localhost, your site will run from root "/" regardless of BASE_PATH
  #   - Only the following values are falsy: ["", null, false]
  #   - When setting BASE_PATH it must be a valid url.
  #     This means always setting the protocol (http|https) or prefixing with "/"
  BASE_PATH : false

  # By default, the asset_path is automatically defined relative to BASE_PATH plus the enabled theme.
  # ex: [BASE_PATH]/assets/themes/[THEME-NAME]
  #
  # Override this by defining an absolute path to assets here.
  # ex: 
  #   http://s3.amazonaws.com/yoursite/themes/watermelon
  #   /assets
  #
  ASSET_PATH : false

  # These paths are to the main pages Jekyll-Bootstrap ships with.
  # Some JB helpers refer to these paths; change them here if needed.
  #
  archive_path: /archive.html
  categories_path : /categories.html
  tags_path : /tags.html
  atom_path : /atom.xml
  rss_path : /rss.xml

  # Settings for comments helper
  # Set 'provider' to the comment provider you want to use.
  # Set 'provider' to false to turn commenting off globally.
  #
  comments :
    provider : disqus
    disqus :
      short_name : jekyllbootstrap
    livefyre :
      site_id : 123
    intensedebate :
      account : 123abc
    facebook :
      appid : 123
      num_posts: 5
      width: 580
      colorscheme: light

  # Settings for analytics helper
  # Set 'provider' to the analytics provider you want to use.
  # Set 'provider' to false to turn analytics off globally.
  #        
  analytics :
    provider : google 
    google : 
        tracking_id : 'UA-123-12'
    getclicky :
      site_id : 
    mixpanel :
        token : '_MIXPANEL_TOKEN_'

  # Settings for sharing helper. 
  # Sharing is for things like tweet, plusone, like, reddit buttons etc.
  # Set 'provider' to the sharing provider you want to use.
  # Set 'provider' to false to turn sharing off globally.
  #
  sharing :
    provider : false

  # Settings for all other include helpers can be defined by creating 
  # a hash with key named for the given helper. ex:
  #
  #   pages_list :
  #     provider : "custom"   
  #
  # Setting any helper's provider to 'custom' will bypass the helper code
  # and include your custom code. Your custom file must be defined at:
  #   ./_includes/custom/[HELPER]
  # where [HELPER] is the name of the helper you are overriding.
like image 703
SJS Avatar asked Apr 15 '13 12:04

SJS


People also ask

How does Jekyll work on GitHub?

Jekyll takes your content, renders Markdown and Liquid templates, and spits out a complete, static website ready to be served by Apache, Nginx or another web server. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories.


2 Answers

If the "page" you are referring to is a Markdown file, i.e. the extension is .md or .markdown, then you'll want to use the standard Markdown syntax:

For inline code use backticks, like this: `inline code`

For block code indent each line by 4 spaces:

block
of
code

Jekyll uses a Markdown parser like RedCarpet, Maruku or RDiscount and doesn't define how you should format your content, that's set by the type of content you are writing, in this case, Markdown. So the place to look is the Markdown syntax documentation for code:

http://daringfireball.net/projects/markdown/syntax#code

You might also look into Syntax highlighting using the {% highlight %} Liquid syntax tag:

https://github.com/mojombo/jekyll/wiki/Liquid-Extensions#code-highlighting

Hope that helps!

like image 183
J W Avatar answered Sep 30 '22 18:09

J W


How about this sir

~~~ ruby
# This is a test.
def foo
  puts 'foo'
end
~~~

ref

like image 23
Zombo Avatar answered Sep 30 '22 17:09

Zombo