{
"columnOne": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
]
}
{
"columnTwo": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
]
}
{
"columnThree": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
]
}
Getting error in Eleventy build, already ran through json lint and fixer but no results. Would appreciate some help.
<ul class="mf-nav__ul">
{% for item in footer.columnTwo %}
<li>
<a href="{{ item.url }}">{{ item.displayText }}</a>
</li>
{% endfor %}
</ul>
</li>
The JSON is the data for my eleventy footer, each <ul>
as a separate column and represented in the JSON as columnOne, columnTwo..
Anyone know the correct config for this use case?
This isn't valid JSON. I don't know what linter you ran it through but pasting into https://jsonlint.com/ shows the problem immediately - you have 3 separate objects, with no array marker around them or commas between them.
If you're expecting to access it like footer.columnTwo
then I'm guessing that what you probably want/intend is actually a single object like this:
{
"columnOne": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
],
"columnTwo": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
],
"columnThree": [
{
"displayText": "Login",
"url": "/login"
},
{
"displayText": "Linkedin",
"url": "fab fa-linkedin fa-2x"
},
{
"displayText": "Email",
"url": "far fa-envelope fa-2x"
}
]
}