Skip to content
Get more help on our Slack

Trouble querying content with 11ty

30 replies
Last updated: May 1, 2020
Heya, I’m trying to make my first site using sanity. I want to use Eleventy as my frontend but I’m having trouble querying the content from my database. Are there any specific guides for eleventy and sanity?
Apr 30, 2020, 12:21 PM
Hi Ben, welcome! 👋 And cool choice with Eleventy (we recently opened an 11ty channel in case you want to join). There’s an Eleventy + Sanity blog boilerplate example over here: https://github.com/kmelve/eleventy-sanity-blog-boilerplate
Are you getting any specific errors when querying content?
Apr 30, 2020, 12:25 PM
Apr 30, 2020, 12:29 PM
Thanks! I haven’t had a look at the boilerplate one so I’ll check it out
Apr 30, 2020, 12:31 PM
the error I’m getting is this one 
"Unable to parse entire expression"
Apr 30, 2020, 12:31 PM
Do you have any repo you can share (in DM if you prefer)? Or specific code causing that error if it’s clear where it comes from?
Apr 30, 2020, 12:33 PM
Do you have any repo you can share (in DM if you prefer)? Or specific code causing that error if it’s clear where it comes from?
Apr 30, 2020, 12:33 PM
Apr 30, 2020, 12:29 PM
Thanks! I haven’t had a look at the boilerplate one so I’ll check it out
Apr 30, 2020, 12:31 PM
the error I’m getting is this one 
"Unable to parse entire expression"
Apr 30, 2020, 12:31 PM
Apr 30, 2020, 12:42 PM
Thanks Ben! Did it originally work when you made the initial commit? You used Sanity’s 11ty starter for this, correct (the one Knut shared)?
Apr 30, 2020, 12:45 PM
No I started with a clean sanity, structured the database and then was beginning to figure out how to get the data to eleventy which is where I got stuck. But I did have a look at the one that Knut shared to try and help me
Apr 30, 2020, 12:47 PM
In 
newsItems.js
, an orphan bracket 
}
seems to have sneaked in:
const projection = groq `{
  _id,
  publishedAt,
  title,
  body
  }
}`
Should be:

const projection = groq `{
  _id,
  publishedAt,
  title,
  body
}`
Apr 30, 2020, 1:18 PM
ahhh sneaky! Thanks, I’ll check it
Apr 30, 2020, 1:33 PM
Hey, sorry to keep bothering you. The bracket was indeed the problem but now I’m having trouble previewing the rendered html content in eleventy. When I run 
npx @11ty/eleventy --serve
I get an error about the directory for home.njk not existing and when I go to the localhost:8080 it only says 
Cannot GET /
Do you have any ideas whats causing this?
May 1, 2020, 8:12 AM
I switched to using the boilerplate that Knut sent above but adjusted everything for my site
May 1, 2020, 8:13 AM
Does your web root have an 
index.njk
file including 
layout: layouts/home.njk
and is there a 
home.njk
file in your 
_includes/layouts/
folder? Do you have an updated repo to share by any chance? 🙂
May 1, 2020, 9:05 AM
Also, do you have this section in the return statement of your 
.eleventy.js
file?
dir: {
      input: ".",
      includes: "_includes",
      data: "_data",
      output: "_site"
    }
May 1, 2020, 9:06 AM
yes to all of the above!
May 1, 2020, 9:07 AM
May 1, 2020, 9:07 AM
I’ve tried deploying it to netlify but thats also having issues too
May 1, 2020, 9:07 AM
The latter would make sense as it might be lacking some Netlify-specific config. It seems to be set up for Vercel (previously known as Zeit Now) - see the 
now.json
file for example (although it has instructions for Netlify in the readme). I’ll be able to have a look at the repo in around an hour if that’s OK.
May 1, 2020, 9:09 AM
yeah thats great, thanks for your help!
May 1, 2020, 9:10 AM
What’s the error you’re getting on Netlify?
May 1, 2020, 9:12 AM
its managing the deploy alright but then when I open the studio page sanity stays on the loading screen until it says that there might be a problem with the internet connection
May 1, 2020, 9:15 AM
When I run eleventy from inside the web folder then it works, but from the root it doesn’t
May 1, 2020, 9:21 AM
Hi again Ben, just had some time to go through the repo. Have you tried something like this in your 
newsItemsList.njk
file?
<ol reversed class="newsitemslist" style="counter-reset: start-from {{ newsitemslist.length + 1 }}">
{% for newsItem in newsitemslist | reverse %}
  {% set currentNewsItem = newsItem.data.newsItem %}
  <li class="newsitemslist-item{% if newsItem.url == url %} newsitemslist-item-active{% endif %}">
    <a href="{{ newsItem.url | url }}" class="newsitemslist-link">{% if currentNewsItem.title %}{{ currentNewsItem.title }}{% else %}<code>{{ newsItem.url }}</code>{% endif %}</a>
    <time class="newsitemslist-date" date="{{ currentNewsItem.publishedAt }}">{{ currentNewsItem.publishedAt|readableDate }}</time>
  </li>
{% endfor %}
</ol>
May 1, 2020, 3:58 PM
ah I can’t believe I missed that I hadn’t changed ‘post’ to ‘newsItem’
May 1, 2020, 4:02 PM
thank you, it worked perfectly
May 1, 2020, 4:02 PM
Awesome! 🙂
May 1, 2020, 4:04 PM

Sanity.io – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get StartedJoin our Slack

Related topics

Get more help in the community Slack

TopicCategoriesFeaturedRepliesLast Updated
Any folks have a11y modules you’d recommend? Would love to have something that acts as a linter while we dev to make sure...3Aug 11, 2020

Related contributions

OCEG Web Site
Made with Sanity

Membership site with gated content

Stephane Legay

KIL-boken
Made with Sanity

A simple one-pager created to showcase an upcoming book release. (Norwegian content)

Håvard Brynjulfsen

Quick experiment with the Slinkity 11ty plugin (and Sanity data)
Guide

A quick write up of my first experiment with the Slinkity 11ty plugin. We build a quick "Like" button for my son's art site that increments Sanity data.

bryanlrobinson.com
Bryan Robinson