Getting specific object to dynamic page through button component

What are you trying to do?
Good timezone everyone!

Me and the team just recently started using Plasmic as a basis plataform, integrated with Contentful (API), for our current project, and we’re stuck on its final steps that’d be to get an object from the items list and send it over to a “Description Page”, where all the info can be seen.¹

From my further studies into the plataform (and project as a whole), I found out that we’re currently using a generic button component with hard-coded values for the slug field, and for the button to match the current object container, the value would need to be a dynamic one², and that’s a place where we’re having trouble with, and would love any possible guidance to help us out.

PS: if there are already forum posts talking about the mentioned issues, I’d love to give them a look since I could not find them myself!

–| Reference Table |–
1:


2:

What have you tried so far?
There were suggetions to manually add such slug data to each entry, but that would defeat the idea of a “dynamic value”.

Also, we tried digging into the code to find were such generic callings on the mentioned button were being made, so we could change said value to a generic one, but we got to the conclusion that it should be done directly through the plataform.

PSS: as mentioned beforehand, we’re still very much beginners when it comes to Plasmic, so any help would be appreciated!

TL:DR:
We want to set the value of a button, that’s inside a card, to send over to the respective item’s “Description Page”.

Relevant links:

  • Here’s the link for the project, if needed: Plasmic
1 Like

Hey fellas, member of the team here, I would like to add that we have tried setting a new dynamic page from the component menu but it doesn’t integrate with Contentful database, as far as I know. I bet we’re missing some step to it. We appreciate your attention!

Welcome @astro_dump and @khaled_haikel! Thanks so much for the detailed write up! :heart:

First off, let’s set you up with a dynamic page. When you add a new dynamic page from the component menu, unfortunately it currently only works with certain integrations. But not a problem, you should still be able to configure it yourself.

In a new page, set the URL to something like /cards/[slug]–this makes your page dynamic based on the URL. Now, you have a slug param that you can use in dynamic values. Then update your Contentful Fetcher to filter the slug based on the slug param. You can refer to this documentation for more details: Dynamic pages and paths | Learn Plasmic

1 Like

Now that you have a dynamic page at /cards/[slug], let’s make a Button to link to it.

The problem was that your CardMacquina component doesn’t have access to the current item to display–instead, your page needs to pass the current item to the component, somehow.

There are 2 options:

  1. Make a slot in your CardMaquina component. In your page, add the Button to the slot. In the link prop, look for /cards/[slug] in the autocomplete. Then you should set the current item’s slug as a dynamic value.
  2. Make a prop like cardData in your CardMaquina component. In your page, pass the current item’s card data to the new prop as a dynamic value. Now, in your CardMacquina component, you’ll have access to the per-item data, and you can make a Button similar to above.
1 Like