Embed non-Table View of a Specific Record on another web page

[Jerry_Harris]

I’d like to embed a view of a specific record on another web site. I’d like to specify the record id / view id on the URL so I don’t have to create a custom view for each record, which is a waste of time.

Ideally, I’d like to just embed in an < iframe > the expanded view of a specific record in a view. I’ve tried the following and it displays an unhappy face:

< iframe src=“https://airtable.com/tblhtZEdSQOe7XDl1/recP1MM6ZUrqKfpJy” frameborder=“0” onmousewheel="" width=“50%” height=“533” style=“background: transparent; border: 1px solid #ccc;”>< /iframe>

The user viewing this webpage will have login access to Airtable.

Alternatively, if I could pass in the record ID into an embedded view that would work as well. I know I can filter within the view, but can I specify the filter options on the URL of the embedded url?

Thanks for any help.
Jerry

[Jerry_Harris]

Is there any hints on how to do this? I’ve signed up for the beta for embedding blocks. That doesn’t help either. There doesn’t seem to be a way to extract a specific record from Airtable to display in another site. Unless I code it up myself.

[ScottWorld]

How did you sign up for the beta test on embedding blocks? I’d like to be on that beta team.

Regarding your inquiry, it can’t be done with Airtable itself, but there are many different 3rd-party solutions that offer this capability.

This one is probably the quickest, easiest, best, and cheapest way to do it:

Single Record Editor for Airtable

[Jerry_Harris]

Thanks for the hint. I haven’t seen them before.

I signed up for the beta here:
https://airtable.com/shrLK2dGvhx46S6bU

Jerry

[ScottWorld]

You’re welcome! And thank you for the link! :slightly_smiling_face:

[ScottWorld]

Oh, and by the way, I should mention that those developers at miniExtensions.com are EXTREMELY responsive. If you need an extra feature built into one of their extensions, or if you need a new type of extension altogether, they are EXCELLENT about fulfilling requests!!

[Justin_Barrett]

Welcome to the community, @Jerry_Harris! :grinning_face_with_big_eyes: I’m a little confused by one of your earlier comments re: the embed test you tried:

Jerry_Harris:

The user viewing this webpage will have login access to Airtable.

Are you saying that you want the user to have access via this embedded record, or that the embed option you tested will give them access that you’d prefer that they not have?

There is a way to create an embed that automatically opens up the expanded view of a specific record in read-only mode. However, the user can still close that record and see the full record list in the view. If you truly want them to only see the contents of that record and nothing else, this option won’t work for you.

Could you describe more about your specific use case? Perhaps there’s some detail in the bigger picture that will help us guide you toward an appropriate solution.

[Jerry_Harris]

Hi Justin,
Thanks for your response. I mean that the page onto which I want to embed the Airtable record is a Confluence page that is non-public. Everyone viewing the page will also have Airtable credentials. I mentioned it to emphasize security is not a concern for me.

What you describe might work. We are using Airtable for Product Management, Release Management, and Status reporting for our software product. For each Epic defined with a PRD (Product Requirements Document) in Confluence, there will be a row in our Epics Airtable table, which is cross-referenced with our Release table and Status Report table. I’d like to create a view in the Epics table that shows top-line status / progress / release of all Epics. I want to embed this view into the Confluence page of each Epic’s PRD. When the user opens the Confuence page, I’d like them to see (at least initially) this view with only the data from the corresponding Epic record shown. I was envisioning adding to the embedded URL a parameter like “?recordId=xxxx-xxxx-xxx”. I would then customize each embed URL for each PRD page with the appropriate recordId.

I hope this helps explain my use case further. I’ve already embedded views into Confluence…show all the records for the view.

Jerry

[Justin_Barrett]

Thanks for the clarification. It sounds like the option I mentioned above would probably work for you, but before I get into that, I’ll take a step back to spotlight some (potentially-)useful data that’s available when you’re using Airtable in a browser.

Rather than leaving the URL static, Airtable constantly updates the URL depending on which table you’re in, which view you’re using, even which specific record you’re viewing (in expanded view only). Airtable uses a 3-character prefix for all items in its internal structure:

tbl = table
rec = record
viw = view

After that prefix is an internally-generated 14-character ID that represents that unique item.

Anyway, the good thing about your use case is that everything you want is in a single table, so the table ID and view ID won’t change. The unique part will be the record ID, and you can have Airtable share that with you for every record, allowing you to build your URLs automatically.

First put Airtable into the Epics table view, and copy the URL from your browser window. Just FYI, the URL will probably end with “?blocks=hide” (unless you have blocks visible, in which case it will be “?blocks=show”), which isn’t necessary to copy, as Airtable will add that on the end itself, so just omit that part when copying.

As an example (scrubbed for privacy), here’s how the URL should look in a generic sense:

https://airtable.com/tblXXXXXXXXXXXXXX/viwYYYYYYYYYYYYYY?blocks=hide

Now expand a single record, and notice the change to the URL. It starts as above, but before the blocks suffix is this piece (similarly scrubbed):

/recZZZZZZZZZZZZZZ

That’s the record ID for the record you viewed. You don’t need to copy that, though because we’re going to make Airtable give it to us for every single record.

Add a Formula field to the Epics table with the following formula, using the base URL you copied earlier (without the record ID):

"https://airtable.com/tblXXXXXXXXXXXXXX/viwYYYYYYYYYYYYYY/" & RECORD_ID()

That will generate a unique URL for each record which, when opened, will automatically display the appropriate record’s expanded view.

[Jerry_Harris · Accepted solution]

Hi Justin,
Thanks for the detailed explanation. I tried it and it doesn’t work in my use case. When I try to embed the URL
https://airtable.com/tblXXXXXXXXXXXXXX/viwYYYYYYYYYYYYYY/recRRRRRRRRRRR?blocks=hide
in an < iframe > on another page, I get an error because the URL Domain of my website doesn’t match Airtable.com. (Airtable sets this in the HTTP header.)

However, your answer gave me an idea and a solution.

I navigated to the view (a Card view) I wanted and hit the Share button for the view. Then I hit the Preview button. Once this view came up, I expanded the record I wanted to display. The URL for the page was now in the form of
https://airtable.com/shrSSSSSSSS/tblasTTTTTTT/viwVVVVVVVV/recRRRRRRRR

When I use this URL in my < iframe > markup, and size the window down to show just 1 card, it works! No cross-origin restrictions!

Thank you for your help and inspiration.
Jerry