Search code examples
rubyjekyllmicrodatajekyll-extensions

Inserting Microdata into Jekyll output?


I've got a recipe site I'm powering with Jekyll, and now I want to add Microdata (itemscope, itemprop, etc.) into the output static page. I've got a couple lists (ingredients, directions, etc.) and I'm not sure how to have Jekyll render these with the added Microdata tacked on.

I assume I need a Convertor or Filter or some other thing, but I've got next to no experience with Jekyll. Anyone done something similar before?


Solution

  • Found a way in kramdown documentation

    • {: itemprop="ingredient"} 2 tablespoons butter
    • {: itemprop="ingredient"} 1 cup diced onion
    • {: itemprop="ingredient"} 1 cup shredded carrot

    But what if :

    • you put your ingredients in the front matter

    my_recipe.md

    ---
    layout: page
    title: My nice recipe
    ingredients:
        - 2 tablespoons butter
        - 1 cup diced onion
        - 1 cup shredded carrot
    ---
    
    {% include recipe_head.html %}
    
    ###How to do it
    
    ...
    
    • make a template

    **_includes/recipe_head.html

    <h3>{{ page.title }}</h3>
    <h4>Ingredients</h4>
    <ul>
        {% for ingredient in page.ingredients %}
        <li itemprop="ingredient">{{ ingredient }}</li>
        {% endfor %}
    </ul>
    

    This will be far more maintainable.