Jekyll plugin for a tag block mimicking the behaviour of the HTML5 "details" element

details_tag.rb

# _plugins/details_tag.rb

module Jekyll
  module Tags
    class DetailsTag < Liquid::Block

      def initialize(tag_name, markup, tokens)
        super
        @caption = markup
      end

      def render(context)
        site = context.registers[:site]
        converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
        # below Jekyll 3.x use this:
        # converter = site.getConverterImpl(::Jekyll::Converters::Markdown)
        caption = converter.convert(@caption).gsub(/<\/?p[^>]*>/, '').chomp
        body = converter.convert(super(context))
        "<details><summary>#{caption}</summary>#{body}</details>"
      end

    end
  end
end

Liquid::Template.register_tag('details', Jekyll::Tags::DetailsTag)

@towbi thanks for making this and the blog post. However, when I put a list inside this details tag, which is also inside a list, it has indentation issues. I fixed this by changing the body= line to

body = converter.convert(super(context)).gsub("\n", "").chomp

This works for my use case, however it might cause problems with pre tags, which I haven't run into personally yet.