Transcript
In this video, I'm going to show you how to use an item details block and why it's so powerful. I'm also going to show you how to set up a linked list in Softr to show relate records to whatever detail page you're on, which is a super powerful and helpful feature.
First, let's get started with the item details block. I want to talk about a high-level problem. Let's say you need to build a thousand company profile pages.
Do you approach it by creating a thousand individual pages, or do you create one page and pass the data for a thousand different companies to that single page? The answer is to create one page in Softr using our item details block.
This allows you to take all your data and pass one specific record, whatever record a user clicks on, to that related page. The item details block will show the data for that specific company page dynamically.
[.blog-callout]
If you want to save time setting up your data structure, try the AI co-builder. It can generate your entire initial page layout and database schema from a single prompt, allowing you to focus on refining your item details block.
[.blog-callout]
That's the power of why Softr is so efficient. You can build these dynamic applications in a very quick way. Even if you need a thousand distinct views, you really only need to build one page layout.
Let's look at how this works in our CRM template. In our companies listing, if I click on a record, I see the related record opened up. On one side, we have an item details block, and on the other, we have linked lists.
If we go into the studio to the company details, we can see this item details block. It is configured using our database table called companies. To show data for a company in a specific item details block, the block needs to map to that same data type.
I don't need any manual conditional filters for the main block because Softr is smart and handles this behind the scenes. In the company list view, the action is set to open the company details page automatically when a record is clicked.
If you go to set up an action and you don't see your desired page in the list, it means you don't have an item details block with that specific data source anywhere in your application yet. To fix this, create the page and block first, then refresh the studio.
When we are on the live page, notice the record ID in the URL. This record ID is how Softr figures out which data to show in this item details block. Softr passes this data via the URL automatically.
If you try to load a detail page without a record ID in the URL, you'll see an error. Softr will detect you want a detail page but will note that no data was provided to show. In those cases, any data shown is just a fallback and not the intended record.
Now, let's discuss linked lists. It's really cool to be able to have additional details from different database tables showing up on that same detail page. For example, showing all the deals or contacts that belong to a specific company.
[.blog-callout]
While you can use Airtable or Google Sheets for this, using Softr Databases provides a native, high-performance experience. It makes managing these relationships between companies and deals much faster within the same environment.
[.blog-callout]
In our detail page, we add a list block and connect it to our Softr Databases. For this example, the table is deals. The key thing here is the conditional filter.
By adding a conditional filter saying we only want to show deals that relate to this record, it will only return the relevant items. Softr automatically exposes the current record details to be used in these filters.
We set the filter so the company name in the deals table matches the current record name from the item details block. This ensures that when you view StarTech Enterprises, you only see StarTech Enterprises deals.
[.blog-callout]
If your workflow involves complex automation after a deal is updated, check out Softr Workflows. You can trigger internal logic exactly when data changes, keeping your business rules close to your project management setup.
[.blog-callout]
In our database, we can see how these belong to specific companies. This structure allows us to show related records in a list field. You can double-check this by adding a field to the content to display the related company name for verification.
When we preview and click through different companies like Vandelay Industries or StarTech Enterprises, we see the list update correctly. This brings significant functionality to your application.
While this example uses a CRM, you can use item details blocks and linked lists for any use case, such as a team intranet or client portal. It is a powerful way to build your Softr applications.
