I'm working on a Jekyll tag plugin for my Octopress site to help me make a 'note' element. I just want to be able to highlight a piece of information on my blog as a side note, like this.
The problem is, I can't figure out how to get the contents of this tag to be processed (i.e. Markdown or Textile). The above image is only achieved is I actually make my links with html code. Here is how it ends up turning out when I use markdown in the contents.
In my post, I'm writing the contents of this like so.
{% note %}
This is the third post in my Start to Finish series. Last time I talked about [Git](/blog/2013/09/25/getting-started-with-git/).
{% endnote %}
Here is my plugin code. It's based off of the image tag code, and there's really not a lot to it.
module Jekyll
class NoteTag < Liquid::Block
@title = nil
def initialize(tag_name, markup, tokens)
@title = markup
super
end
def render(context)
output = super(context)
title = "Note"
if [email protected]?
title += ": #{@title}"
end
"</section>\n<div class=\"note\"><span class=\"title\">#{title}</span>#{output}</div>\n<section>"
end
end
end
Liquid::Template.register_tag('note', Jekyll::NoteTag)
Do you have any idea how I can use a converter on the contents of this tag? I generally use Markdown for my posts, but I'd like to release this plugin for others so I'd like it to be dynamic just like the rest of Jekyll.
I found this implementation of a 'Markdown block tag' which seems to be a relatively straightforward implementation. Note the use of site.getConverterImpl()
in the render
method.
I used that example to produce this figure tag (based on prior art to another question I found on SO but can no longer locate)
module Jekyll
module Tags
class FigureTag < Liquid::Block
CaptionUrl = /(\S[\S\s]*)\s+(https?:\/\/\S+)\s+(.+)/i
Caption = /(\S[\S\s]*)/
def initialize(tag_name, markup, tokens)
super
@caption = nil
if markup =~ CaptionUrl
@caption = "\n\t\t<figcaption>#{$1}<a href='#{$2}'>#{$3}</a></figcaption>\n\t"
elsif markup =~ Caption
@caption = "\n\t\t<figcaption>#{$1}</figcaption>\n\t"
end
@markup = markup
end
def render(context)
site = context.registers[:site]
converter = site.getConverterImpl(::Jekyll::Converters::Markdown)
output = converter.convert(super(context))
"<figure class=\"center\">#{output}#{@caption}</figure>"
end
end
end
end
Liquid::Template.register_tag('fig', Jekyll::Tags::FigureTag)
The above plugin manages to parse markdown within the contents of the block. So given the following block tag usage:
{% fig Test fig %}
This should be parsed as *markdown* [man](http://example.com/).
{% endfig %}
You'll get the following html:
<figure class="center"><p>This should be parsed as <em>markdown</em> <a href="http://example.com/">man</a>.</p>
<figcaption>Test fig </figcaption>
</figure>
Hope this helps! I spent a couple hours last night and got nowhere, but this morning I found this example and it clicked within 20 minutes.
Jekyll 3.x : getConverterImpl is now deprecated
Use find_converter_instance to get the converter :
def render(context)
text = super
site = context.registers[:site]
converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
_output += "<figcaption>#{converter.convert(_caption)}</figcaption>"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With