The basic solution would be to somehowembed a dynamic page into a static or the other way around, I guess.
This is my problem:
I landed a new job for a customer who wants to have some kind of catalogue/shop functionality (with collection-like repeating patterns). Easy.
But:
He also wants each product page to be partly unique in itās presentation. Like different features, texts, etc. that are definitely none-repetitive.
So basically either
a) I need to somehow implement individual content into an otherwise collection-page
b) or do the opposite by somehow adding a collection page to a static page
Any idea how to do that? I thought about b) with some iframe-like insert of a collection page? But iframes are so lame, is there anything else to look at?
What about using collection lists as layout elements on a static page to embed data from the collection to the page? and then filter away the list items that is not relevant.
Thatās what I thought too. But does the filter work like that? And I would have to copy this into each of the static pages, and it canāt be a symbol, obviously.
Hereās the best solution for this, just in case anybody wants to accomplish the same. Iām not a developer, I used the base code from this project by @cyberdave. Thanks man!
I created the general page as a collection template page. In the collection, I created a text field that contains the URL or slug of the content that needs to be variable.
Next, I created a div with the ID content-div. And then in the custom code area before the tag I put this:
The SLUG of course is the variable defined within the collection, that I entered into the script using the + Add Field button in the custom code section.
Hi, Can you share a bit more about this solution? Iām struggling to replicate it on my site.
then in the custom code area before the tag I put thisā¦
This refers to the code before the body tag in the collections template page, right?
the content that needs to be variable
It looks like that example puts this content on its own, static page. In that case, does that script take the entire body of the static page and place it into the content-div?
Hi, Can you share a bit more about this solution? Iām struggling to replicate it on my site.
then in the custom code area before the tag I put thisā¦
This refers to the code before the body tag in the collections template page, right?
Yes, correct.
the content that needs to be variable
It looks like that example puts this content on its own, static page. In that case, does that script take the entire body of the static page and place it into the content-div?
Yes, also correct.
What exactly are you struggling with? Let me know if you need further help.
Hi @Tobi_Huber, Iāve gotten this to work and itās great, does exactly what I was hoping for. Unfortunately, the static content that Iām pulling into my collection page only shows up after I hard refresh the page. Have you run into this problem and do you know why it might be?
Hi! This script seems great and Iām trying to replicate it on a page. But I canāt get it to work at all. I think I must have the linking messed up or something.
Iām still only test publishing the site under the .webflow.io domain, does that pose any problems?
Should the variable holding the static page be just the page name or the full link to the page?
What should I change in this section?
Should the domain be my .webflow.io domain up to the directory where the static page is placed?
Does the div targeted to hold the content need to be formatted in any way?
Update on my previous question, accidentally solved it!
The script does works great as written, I totally missed that you have to replace the āSLUGā by pressing the ā+ Add fieldā button in the custom code frame and from there picking the collection text variable. Not just writing the variable name in code.
Hi, I have the same questions regarding the instructions here. Hereās what Iāve done:
I set up a collection with the slug field, I set up a collection page with the content-div container and ID of ācontent-divā. I created a static page with the slug of ātest-contentā. I put the script in the customer code field and configured the add field to reference the slug field.
Published the pages on the default webflow.io URL.
I get nothing showing up in the content div when I load the page.
In the script, I tried it as is, and then I tried editing the URL of the domain, and also playing with using both just the slug ātest-contentā and the full URL path in the cms field. But canāt seem to get it working.
Do you recall if I should be editing the URL in the script to replace āhttps://domain.com/directory/ā ? And do I use just the slug ātest-contentā, or the full URL path in the cms field?