Reference field in an other reference field

Design help CMS
1

Hi everyone!

I have a collection A with a set of items. The structure of the collection A calls a collection B in Reference Field.
In my collection A, I also call on the collection A itself, and thus with another Reference Field connected to the collection A.
In a collection page, the Reference Field to collection B does not appear in the Reference Field to collection A.

schema
schema1588×1154 51.3 KB

Is it a Webflow limitation?
Thanks for helping.

2

It’s difficult to determine what you’re hoping to achieve here, but if you’re trying to invert the reference, that’s not possible in Webflow. Webflow’s CMS appears to be based on some variant of MongoDB which is not a relational database.

If you have B ref A, then you cannot create a collection list of A and hope to find the multiref of B’s that have referenced it.

3

Hi @vianneypercq

You are correct.

You can only (multi)reference a Collection, not a field within a Collection. It’s just a limitation of the Webflow CMS.

Instead, the approach that people take to overcome this is Lookup Tables.

I’m not clear if they’ll work for you or not, but, here’s an overview…

You hold the item-id of the Collections item you want to reference in an external table (Airtable, Make / Integromat Datastore, etc…).

So you could track your self referential reference (Collection A referencing itself) in the lookup table and which Collection B item references it. Then use the Webflow API to grab that item by it’s stored id.

Here’s an overview of this (though with a different example than what you’re asking for, but the same applies to you):

Hope that helps!

4

Hi @memetican and @ChrisDrit :wave:

Sorry for the delay in responding, I did not receive notification for your responses. I’m trying to be clearer with a new more concrete diagram.

In my example: in a “collection page template” of the collection A “Models cars”, I have this same collection A in reference field to itself. I can’t access to the collection B “Brands” from the collection A which is in reference field.

Capture d’écran 2023-04-05 à 17.50.24
Capture d’écran 2023-04-05 à 17.50.241920×1849 169 KB

Does this fit with your explanation?
Thank you for helping.

5

Correct. Webflow supports two reference types;

Single ref = →
Multiref = ⇉

Think of each reference field as a “hop”.
Currently Webflow allows only one “hop” via a reference field from A → B

Your page design requires A → A → B = 2 hops, which isn’t supported.

What you can do instead is put your “alternative” cars in a multi-ref field, rather than two single-ref fields. In this case, your structure changes to;

A ⇉ A → B

Which will work just fine. Your page structure will become;

A's collection page
   Alternates collection list, bound to your multiref of A alternates's
      A alternate content
      B content ref'd to that A alternate

It works because inside of that collection list, Webflow’s context becomes the alternate item, so B is only one hop from the current A alternate.

Bonus, you can have more than 2 alternates if you want.

1 Like
6

Yea, that makes more sense to me now.

This is certainly not a simple setup :smile: but I think this is what you’re looking for:

Screen Shot 2023-04-06 at 6.12.08 AM
Screen Shot 2023-04-06 at 6.12.08 AM2880×1800 309 KB

Here is the project share link with the db setup and the collection page.

At the end of the day, you most likely don’t want to do this (even through its possible). You’ll quickly run out of reference fields. You get a max of 10 on the higher priced tiers, only 5 on the lower priced tiers.

Instead you want to use something like lookup tables (mentioned previously) that removes those limits.

Regardless, that shared project should get you there, or give you enough to tweak for your needs, on your own.

1 Like
7

Hi @memetican @ChrisDrit !

I really want to thank you both for your explanations. I have implemented your advice and I have integrated my car scheme in a mini test project you can have a look at.

I see perfectly that the fact of putting the “alternate cars” in Multi Reference Field instead of a simple Reference Field allows to access to the “Brands” collection which is itself a Simple Reference Field of the “Models” collection. So from a “Models cars” Collection Page, I have access to all the information and I can display as many alternatives as I want. Practical and efficient.

Concerning the “hop”. I confess I still have trouble understanding why the Multireference Field allows to have only one “hop” and not two to access the “Brands” collection, even with Michael’s explanation

Webflow’s context becomes the alternate item, so B is only one hop from the current A alternate.

A → A → B = 2 hops
A ⇉ A → B = 1 hop

Concerning the limit of the number of reference fields imposed by the Site Plan, I understood the possibility to use lookups. This is what I do in my real project within Airtable that I synchronize with the Webflow CMS. Chris’s articles on this subject are extremely interesting and I’m going to deepen them.

Thanks a lot guys :+1:

8

The distinction is in the context.

On the collection page the context is the page item being viewed, whereas in the collection list, the context is each item within that list.

The multi-ref must be bound to a collection list, so you’re effectively shortening that distance by navigating the first hop using the collection list itself, and then your target data is only one ref-hop away.

1 Like