Simple product data table
Add in some rows.
Sample products added
Create a visual function that'll get the specified product with the get parameter id.
Just a few clicks and your function is ready
Now let's switch to the pagebuilder.
Go to the page you want to dynamically populate, you have a direct access by clicking on the "dynamic data source" icon
From there, you can, from your CloudAPI functions, select the one you'll use to fetch the data. The id in the first column is the one you'll use to bind the data.
A modal will open
To display the data responded by your API function, just place [DSid=column] anywhere on your page. So in this example, that would be [DS1=name], or [DS1=description], or [DS1=image] ... and save!
Prepare your data to be filled
To view your dynamic page, add the get parameter you setup in your API function that'll match it, in this example, id.
So that's, mywebsite.com/product.html?id=1
And it will render this :
Voilà, you've got powerful data source bound in minutes
No data displaying?
You can check the "cb-status-x" meta (x corresponding to your datasource-id) to check what the problem is.
You may also want to repeat zones for a listing of multiple examples. Every row returned by your API function will be included in the page.
To create a repeated zone, simply click the paintbrush, select the "Data source Cloud Backend" of the element, column, or row that will be replicated.
Assign the corresponding data source, and the zone will replicate with each of the API call entries.
All the products are listed with the same design. All you need is to update the database in order to add/update the products.