> ## Documentation Index
> Fetch the complete documentation index at: https://docs.softr.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Use Case: Embedding Calendly in List Details

> How to add Calendly embed code within a List Details block

First of all, you need to get your Calendly embed code, as described [here](/custom-code/3idxDhKqz1qPdqBuWbs61G/custom-code-block-overview/6XNrxFopUEiwbWipq81Eq1). Further on, create a corresponding field in your [data source](/4230abecf813402aa2926466c313290a) that you're using for the List Details block. In the example shown below, we've created a **Single line text** field named "Calendly" in [Airtable](/data-sources/1YYStCJukT15Lh2j93qo9A/airtable/jHX7kfH7QvkVcELQvS3VoX) and added the embed code to one of the rows.

<Frame caption="Adding embed code to Airtable">
  <img src="https://mintcdn.com/softr-2b8a27e1/90CuYCwl_tachktl/building-blocks/images/use-case-embedding-calendly-in-list-details/image1.png?fit=max&auto=format&n=90CuYCwl_tachktl&q=85&s=ee4b2629445b56e14d741588b12bde27" alt="Adding embed code to Airtable" width="465" height="403" data-path="building-blocks/images/use-case-embedding-calendly-in-list-details/image1.png" />
</Frame>

Next, we’re going to add an **Embed** type field to the List Details block and link the "Calendly" field from Airtable.

<Frame caption="Adding the embed field">
  <img src="https://mintcdn.com/softr-2b8a27e1/90CuYCwl_tachktl/building-blocks/images/use-case-embedding-calendly-in-list-details/image2.png?fit=max&auto=format&n=90CuYCwl_tachktl&q=85&s=346c7b3c75e74e2b27d70eab15d9f628" alt="Adding the embed field" width="954" height="924" data-path="building-blocks/images/use-case-embedding-calendly-in-list-details/image2.png" />
</Frame>

That's it. Now the Calendly embed will start appearing on the list item as shown below.

<Frame caption="Calendly widget added on List Details">
  <img src="https://mintcdn.com/softr-2b8a27e1/90CuYCwl_tachktl/building-blocks/images/use-case-embedding-calendly-in-list-details/image3.png?fit=max&auto=format&n=90CuYCwl_tachktl&q=85&s=341f96f5487f432d680a0eae3f1c6e85" alt="Calendly widget added on List Details" width="2814" height="1094" data-path="building-blocks/images/use-case-embedding-calendly-in-list-details/image3.png" />
</Frame>

# Other Integrations

You can embed other publicly accessible integrations this way as well. Some ones we’ve seen aside from Calendly are Trello cards, Google Docs, YouTube videos, and Github issues.
