Dynamic Embed Code in Custom Code Block?

Hi, in a custom code block with an embed code on a list details page, is there a way to pull the full embed code, or just a partial dynamic string within the embed code, from the Airtable record for that list item? I need different embed codes for different records, actually just one dynamic parameter passed to the outside app from within the embed code.

I’ve also just asked David regarding his “Softr tip: How to pour airtable data into templates in your list blocks and list details blocks” if this code would do it, replace {{embed_code}} as the only thing in a custom code block with an Airtable ‘embed_code’ field for that record.

Thanks!

1 Like

Oh, from a No-Code Ireland (nocode.ie) video, I just learned about the “embed” field type in any block that can call up code from an Airtable field, such as iframe code. Then in the Airtable field I can put my dynamic embed code that varies by values in each record.

Haven’t tried it yet, but this seems super simple! Was about to despair of doing what I wanted without having to learn JS or pay someone. (Will probably learn JS anyway.)

The “embed” field type in any block seems super powerful, Softr needs to document and talk much more about it! As far as I can see, the embed field is only indirectly described, via the Embedding Calendly in List Details - Softr Docs documentation page, but that is a far cry from explaining all the possibilities of the embed field type!

(From the nocode.ie video on creating Action Buttons via the embed fields, Level Up Your Softr No-Code App Build With Action Buttons | Softr.io Tutorial 2022, Level Up Your Softr No-Code App Build With Action Buttons | Softr.io Tutorial 2022 - YouTube)

2 Likes

Dear @EricM,

Firstly let me apologise for my belated response.

Thanks for your feedback, we will take it into consideration.

We have some short description in the article about List Block.

Let me know if there is still anything you need help, I would be glad to help you :slight_smile:

Suzie,

Thanks very much for your reply. Think I’m getting it to work. It’s just an embedded iframe from an Airtable field called from an “embed” field of an otherwise completely empty List Details Block. The embed field is the only thing active in the block. The iframe code that the 3rd party gave me had bugs, am fixing them so it displays properly. I posted a follow-up comment to you but now deleted that.

1 Like

OK, here is the answer when using an embedded script (not iframe): you put the embed field type in a List Details block (I used the big-image block) and remove all the other fields except for your one embed field type which links to the Airtable field containing the embed code. Then you adjust the embed size with the styling button on the embed field to “full” (you go way up past 6xl). Then you set the style in the div id="…" style=“width: 100%” for the embed code in Airtable.

Look, it took me literally hours of trial-and-error and skimming through various web forums and references to come to this answer and be confident that I could even do this in my design. And considerable frustration along the way. Dynamic embed code is an essential function for my use case and site. I am surprised that Softr hasn’t thought of it, or at least hasn’t documented how to do it in the way I’ve described, and make it known. Right now, the embed type field is one obscure line on the List block documentation, plus one page on embedding Calendly using it. If it was better documented, it would have saved me literally hours. Thanks!

2 Likes

Dear @EricM,

Noted, thanks so much for your feedback. We will surely take it into consideration and will try to include more details within the documentation.

Does embed code have to be an iframe or can it just be raw HTML?

Hey @martyamark,

The custom code block allows you to inserting both iframe and HTML, CSS and/or Javascript , anywhere in your application.

If you could give details about the use case I would be more specific :slight_smile:

thanks for advice