Liquid - parse YAML front matter in string

0
votes

I'm running a Jekyll site that uses JSON as data in my _data folder. I'm looping through the file like normal doing things like {% for item in site.data.resources.items %} just fine. However, I'd like to parse YAML front matter that is within a string.

Example:

\n---\nblog: http://google.com\nbackground-img: http://www.ew.com/sites/default/files/i/2013/07/23/Dumb-and-Dumber.jpg\nbuttonText: Download\n---\n

How can I have Liquid parse this within my Jekyll site so I can use it like so:

<a href="{{blog}}"><img src="{{background-img}}>Image</a>

or something similar?

EDIT: To clarify, that string is in front matter format in a text file that I'm retrieving through an ajax call. So that string is the response I get back and the format won't be changing. My hope was that Liquid could somehow parse this string and look for a front matter type format. If not, I will revert back my JavaScript methods.

1
yamljekyllliquidyaml-front-matter
Are you asking how you can use yaml front matter to select your data items? – TBB
I'm not a developer, but is background-img and buttonText child key-value pairs of the blog item in that structure? If so, perhaps something like front matter entry item: blog and in content <a href="{{ site.data.resources.items.[page.item] }}"><img src="{{site.data.resources.items.[page.item].background-img}}>Image</a>. Is that what you mean? – TBB
What exactly does your frontmatter look like? That long string is actually a value in your frontmatter? Would the "contains" operator work? like, {% if page.url contains "nbackground-img" %} background-img {% endif %}. It's unclear exactly what your setup is. – Tom Johnson
@TomJohnson to clarify, that string is front matter format in a text file that I'm retrieving through an ajax call. So that string is the response I get back and the format won't be changing. My hope was that Liquid could somehow parse this string and look for a front matter type format. If not, I will revert back my JavaScript methods. – chris_s
@TBB no, they are not child k-v pairs. I didn't format this because it's just a string and that's the way it is in my JSON file. – chris_s

1 Answers

0
votes

This is impossible.

Liquid/YML is being parsed while generating the site and your JSON string comes available long after the site has been generated: It only exists after the moment the JSON request for the string has been succesful.

However, you can use javascript, as you already mentioned. Simply split the string on \n for your key-value pairs and split on : for your key and value. Then use jQuery (or plain javascript) to write the results to the DOM.

Good luck!