Combine Eager-Loading and relatedTo(category)

Question

For a website I'm building for a client I've build a navigation where on hover an image changes dynamically to the image assigned to the entry. See this page for a better understanding: http://sandmandance.com/dev/projects/performance

It all works fine but at first page load the images are only loading when hovering over the navigation which causes a small glitch. What I'd like to do (and seems like the easiest solution) is to load all the assets on page load using Eager-Loading.

Thing is.. I can't seem to combine it with relatedTo(category). So in short; how can I combine Eager-Loading and relatedTo(category) in a way it works?

Answer 1

I usually like to use the .find() method and then you can pass in an object in your twig with criteria for the query. This is an example of eager-loading and relatedTo.

{% set entries = craft.entries.find({
    section: 'articles',
    with: ['featuredImage'],
    limit: 4,
    relatedTo: category
}) %}

Let me know if this helps at all otherwise I'd be happy to dig into your use case more.