How can I automatically escape HTML content using Jekyll and Markdown? - ruby

In foo.markdown I have the following:
---
layout: default
title: Snarky little Ewok
---
A little Ewok is sometimes referred too as <h3>. But pappa Ewok is called <h1> - if you know what's good for you.
Well, I want Jekyll to automatically html escape the greater than and less than characters. I'm seriously fatigued after today's apprentice training and I'm just too lazy to manually html escape myself: >h3<
Is there a config option or something to automatically escape Jekyll markdown content?

If you used textile instead of markdown, there would be a way.
Liquid markup has textilize & escape filters; those two would allow you to do what you wanted, but on textile. You would have to save your files as text (file extension: txt), and then escape the html before textilizing:
---
layout: default
title: Snarky little Ewok
---
This file's extension is .txt
A little Ewok is sometimes referred too as <h3>. But pappa Ewok is called <h1> - if you know what's good for you.
Then on the default.html layout, instead of having:
{{ page.content }}
You would have this:
{{ page.content | xml_escape | textilize }}
Since there's no 'markdownify' filter on Jekyll yet, you can't do that with markdown. There's an issue (Issue 134) on Jekyll for adding a markdownify filter.
EDIT:
It's now possible to use markdown (since jekyll 0.10.1)
{{ page.content | xml_escape | markdownify }}

Related

jekyll not generating _posts

I'm have trouble getting jekyll to convert a post in _posts directory to html. It generates index.md correctly, but doesn't generate anything for posts. When I add 'source: _posts' then it converts the post, but doesn't convert index.md.
As far as I can tell, 'source' should either be not added to _config.yml to should point to '.'
My directory structure is pretty standard:
$ find .|fgrep -v bootstrap
.
./index.md
./_config.yml
./_drafts
./_includes
./_includes/footer.html
./_includes/header.html
./_layouts
./_layouts/default.html
./_posts
./_posts/2013--02-25-test-blog.md
./_site
./_site/index.html
$ cat _config.yml
name: "Developer blog"
description: ""
url: "http://localhost:4000"
source: .
paginate: 10
markdown: rdiscount
permalink: pretty
pygments: true
auto: true
Even when I leave auto off, I see no stack traces.
$ cat _posts/2013--02-25-test-blog.md
---
layout: default
title: Testing a blog
---
#test blog
this is a test
_posts/2013--02-25-test-blog.md
This name is not correct.
Perhaps use this
_posts/2013-02-25-test-blog.md
Notice carefully only 1 hyphen after the year.

Explain to me a Sinatra setup for dummy's for a preview of html/css code

A word of warning up front: I do not know even the ruby basics, but I'm trying to learn more and more of the world of shell scripting this year.
I saw this Vimeo video of Ben Schwarz and immediately thought that I'd like to use such a tool to debug my sass and haml files.
So this is a call to help me to grasp the concept of Sinatra.
What I want is a simple way to output the code of my index.html to check if all the haml magic was applied correctly - so it should function as a source viewer that gives me live updates. I'd prefer it if Sinatra simply looked at the files that LiveReload already rendered (c.f. index.html) in my project folder.
Update: This is a screenshot of the Vimeo Video. It shows just the raw CSS output of a Sass file. This is what I'd like to have for my Haml and Sass code, or better for the output files that are already rendered by LiveReload as HTML and CSS.
I looked at the source file from #benschwarz at his github, but I wasn't even with his own example I'm only getting the standard: "Sinatra doesn’t know this ditty." So transferring this to work with html is still out of my reach.
What I did so far:
I setup my project as usual in ~/Sites/projectname
I setup RVM and install all the gems I need
Sass, Compass, Haml - the output gets compiled via LiveReload
Sinatra
I created myapp.rb in ~/Sites/projectname with the following content:
# myapp.rb
require 'sinatra'
set :public_folder, '/'
get '/' do
File.read(File.join('public', 'index.html'))
end
Whatever, I fired up Sinatra and checked http://localhost:4567/ – this didn't work because I do not know how to set the public_folder to ~/Sites/projectname.
Afterthoughts:
So I went on to search the net, but my limited knowledge of Ruby put my attempt of an successful research to an immediate halt.
Here are some sites I stumpled upon which are obvioulsy close to the solution I need, but… like I told you in the first sentence: if the solution was a book, I'd need the "For Dummies" version.
https://bitbucket.org/sulab/genelist_store/src/30fc0ba390b9/idea8/idea8.rb
Serving static files with Sinatra
http://www.sinatrarb.com/intro
Obvioulsy the reference documentation of Sinatra would help me, but I don't speak the language, hence, I don't get the lingo.
About public folder:
The public_folder is relative to your app file myapp.rb. If you have a public folder inside the projectname folder, this is your public folder. If you have your css, js and image files in another folder, say, includes under project_name, then you need to change the line:
# Actually, you need to remove the line above from myapp.rb as it is.
# The line means that the public folder which is used to have css, js and
# image files under '/' and that means that even myapp.rb is visible to everyone.
set :public_folder, '/'
# to:
set :public_folder, File.dirname(__FILE__) + '/includes'
And that will serve up css, js and/or image files from the project_name/includes folder instead of project_name/public folder.
Reading the html file:
Reading the html files does not depend on the public folder settings. These need not be inside the public folder.
get '/' do
File.read(File.dirname(__FILE__) + '/index.html')
# This says that the app should read the index.html
# Assuming that both myapp.rb and index.html are in the same folder.
# incase the html files are inside a different directory, say, html,
# change that line to:
# File.read(File.dirname(__FILE__) + '/html/index.html')
# Directory structure sample:
# project_name
# | - myapp.rb
# | - index.html (and not html/index.html etc.)
# | /public (or includes incase the css, js assets have a different location)
# | | /css
# | | /js
# | | /images
end
To get the html output inside the browser
After the file is read, typically, this will be your string: "<html><head></head><body></body></html>"
Without escaping the string, the browser renders the html string as html (no pun) and that's why you won't see any text. To escape the html, you can use the CGI class provided by Ruby (hat tip). So, in the end, this will be your snippet:
get '/' do
CGI::escapeHTML(File.read(File.dirname(__FILE__) + 'index.html'))
end
But that will spit out the html file in a single line. To clean it up,
# myapp.rb
get '/' do
#raw_html = CGI::escapeHTML(File.read(File.dirname(__FILE__) + 'index.html'))
end
# Using inline templates to keep things simple.
# get '/' do...end gets the index.erb file and hence, in the inline template,
# we need to use the ## index representation. If we say get '/home' do...end,
# then the inline template will come under ## home. All the html/erb between
# two "##"s will be rendered as one template (also called as view).
# The <%= #raw_html %>spews out the entire html string read inside the "get" block
__END__
## index
<html>
<head></head>
<body>
<pre>
<%= #raw_html %>
</pre>
</body>
</html>
If you're trying to render an index.html file, I would try storing it in the /views directory with an .erb extension. Or use an inline template. Here is a great resource

Jekyll Liquid - accessing _config.yml dynamically

For internationalizing my app I need to be able to dynamically access entries in a YAML file.
It is best explained with an example:
Page:
---
layout: default
title: title_homepage
---
This will then allow access to the title_homepage variable in the Default Layout Template:
Default Layout:
page.title = "title_homepage"
Now normally I would access my _config.yml file like this:
{{ site.locales[site.default_locale].variable }}
However, now for this to work, I need to access the _config.yml with the value of page.title. This will not work:
{{ site.locales[site.default_locale].page.title }}
I need the following (pseudo code):
{{ site.locales[site.default_locale].#{value of page.title}}
With the way your vars are set, it would be something alog the lines of
{{ site.locales[site.default_locale][page.title] }}
The thing is, ... I don't really see the point of doing this. Let's say your page is the english page. The locale should then be defined within the page, and so should your title!
---
locale: en
title: My Wonderful Page
---
Which you can retrieve with {{ page.title }} ...
What could be the point of putting the title into the _config.yml file?
(edit) well unless you want to access page.title when in another page/post, in this case you have no choice but to put it into _config.yml.

Ruby/Slim: parse Markdown from a YAML file

Been struggling for a while with some YAML parsing inside a Slim template.
my YAML file contain
shortdesc: >
markdown:
if you want to up the feelgood factor Cuban style, then this Monday night at The Buffalo Bar is for you...
But when I output the shortdesc node in my template it's displayed as a string and not interpreted. ("markdown: if you....")
Is there a way to parse the YAML output string to interpret the markdown code?
If I try
p
markdown:
= shortdesc
the template doesn't understand the call to the variable containing the YAML node.
Is that even possible?
It depends on the Markdown Library that you are using.
In BlueCloth, it would be something like this:
= BlueCloth.new(shortdesc).to_html
Yes it's possible. Just need to use interpolation:
p
markdown:
#{shortdesc}

VIM syntax highlighting of html nested in yaml

Given a yaml file that contains html, like this:
template : |+
<div>Hello, world</div>
Is it possible in Vim (version 7.3.087) to highlight the html portion with html syntax highlighting?
I found the post Different syntax highlighting within regions of a file, which seems to have exactly the concept I was looking for, but I cannot get it to work as expected with yaml. I'd expect to be able to do the following (as suggested in the link):
" .vimrc
" include the code from the above link
call TextEnableCodeSnip('html' ,'#{{{html' ,'#html}}}', 'SpecialComment')
Then have the yaml as, for example:
template : |+ #{{{html
<div>Hello, world</div>
#html}}}
Unfortunately this does not work as expected i.e. the html code remains entirely highlighted with yaml. I've also noted that with my configuration (MacVim 55), this doesn't work in text files either.
I'd be grateful for your thoughts or suggestions, and thank you for reading.
check out my related question: Trouble using Vim's syn-include and syn-region to embed syntax highlighting. There I am trying to embed Python within TeX, but I think the solution might work for your case, too.
I think you want to do something like this:
let b:current_syntax = ''
unlet b:current_syntax
runtime! syntax/yaml.vim
let b:current_syntax = ''
unlet b:current_syntax
syntax include #YaML syntax/yaml.vim
let b:current_syntax = ''
unlet b:current_syntax
syntax include #HTML syntax/html.vim
syntax region htmlEmbedded matchgroup=Snip start='#{{{html' end='#html}}}' containedin=#YaML contains=#HTML
hi link Snip SpecialComment
let b:current_syntax = 'yaml.html'
The block with the runtime! command might be unnecessary if your YaML is already highlighted.
You could try to add the following in your .vimrc:
autocmd BufRead,BufNewFile *.yaml setfiletype html.yaml
A yaml file will be considered to be both of type yaml and html and both syntax color scheme should be applied but I don't really know how conflicts between the two schemes are dealt with...
It looks like you want to move the start pattern to the beginning of the next line:
template : |+
#{{{html
<div>Hello, world</div>
#html}}}
More details:
I'm on WinXP, but I saw almost the same behavior that you described.
When in a file with filetype yaml, after calling TextEnableCodeSnip I didn't see a change until I moved the start pattern down the the beginning of the next line. I was able to see the syntax highlighting work in a file with no filetype though, so this still a chance this won't work for you.
I used Maxy-B's solution. My code, in particular, is a bit different so I thought to post it for posterity:
~/.vim/after/syntax/yaml.vim
let b:current_syntax = ''
unlet b:current_syntax
syntax include #HTML syntax/html.vim
syntax region htmlCode start=#^html:#hs=e+1 end=+^\w+he=s-1,me=s-1
\ contains=#HTML
let b:current_syntax = ''
unlet b:current_syntax
syntax include #TEX syntax/tex.vim
syntax region texCode start=#^tex:#hs=e+1 end=+^\w+he=s-1,me=s-1
\ contains=#TEX
This highlights the top-level YAML nodes html and tex with those respective types of code. It's not very dynamic, but it suits my purpose and this may serve as helpful guideline for someone doing something similar. It'll highlight the following as expected (or at least, as I expect it), for example:
regular: # yaml
- yaml # yaml
html:
<b>hello</b> # html
tex:
\begin{document} # tex
\end{document} # tex
the-end: may be necessary # yaml

Resources