# Form Features - IFrame

## Overview

The **IFrame** element embeds a web page inside a SharinPix Form. Use it for procedures, maps, or dashboards. You can also embed content exposed through [**SharinPix Share**](https://app.gitbook.com/s/5EvYRrLbUyvRh8o1jmMG/lightning-web-component/sharinpix-share). Set the URL with a formula. This makes it dynamic per record.

This article covers:

* [How to configure the IFrame (URL and aspect ratio)](#iframe-element-configuration-in-the-form-template-editor)
* [Fire Inspection Demo: Configure a dynamic IFrame using a prefilled URL](#fire-inspection-demo-configure-a-dynamic-iframe-using-a-prefilled-url)

{% hint style="warning" %}
**Prerequisites:**

Before using the IFrame element:

* Ensure the [**SharinPix Forms Admin**](https://app.gitbook.com/s/5EvYRrLbUyvRh8o1jmMG/access-and-security/sharinpix-permission-sets) permission set is assigned.
* The **latest version of the SharinPix Package** must be installed. Refer to [*this documentation*](https://app.gitbook.com/s/i8tH1o5AHthxksYgF6ij/how-to-update-sharinpix-package-from-the-appexchange) to update your package.
* Ensure end users can access the embedded URL (network access and authentication).
  {% endhint %}

{% hint style="info" %}
**Use Case Example: Show SharinPix Albums in a form**

The iFrame element can be used to embed a [SharinPix Album component](https://app.gitbook.com/s/5EvYRrLbUyvRh8o1jmMG/lightning-web-component/sharinpix-album-lwc) in a form. To generate shareable SharinPix album URLs, you can either:

1. Use the [SharinPix Share component](https://app.gitbook.com/s/5EvYRrLbUyvRh8o1jmMG/lightning-web-component/sharinpix-share) to manually generate a URL
2. Or automatically generate URLs as documented [here](https://app.gitbook.com/s/5EvYRrLbUyvRh8o1jmMG/cookbook/generate-sharinpix-shareable-album-links-automatically).
   {% endhint %}

## IFrame element configuration in the Form Template Editor

Configure IFrames in the [SharinPix Form Template Editor](https://docs.sharinpix.com/forms/form-elements/sharinpix-form-template-editor).

### Configure IFrame element with a static URL

#### Add the IFrame element

Open your form template in the Form Template Editor. Find **IFrame** in the element palette. Drag it into your form.

#### Configure the IFrame settings

Select the IFrame element. Configure these parameters:

* **URL**: a [formula](https://docs.sharinpix.com/forms/form-elements/sharinpix-form-formula-functions-and-operators) that resolves to a URL string
* **Aspect Ratio**: controls the IFrame height relative to its width

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2FL0Izb7jLmnYuEiRumGsC%2FDOC%20SF%20-%201920%20x%201080%20(23).png?alt=media&#x26;token=8d8b4679-6b6d-42b2-a88a-28e238845dbf" alt=""><figcaption></figcaption></figure>

#### Set the URL (example)

Use a quoted string as a static URL:

* URL: `"https://example.com"`
* URL: `"<your-sharinpix-share-url>"`

{% hint style="info" %}
**Dynamic URLs**

You can build the URL dynamically per record. Jump to [Dynamic IFrame element with a dynamic URL](#fire-inspection-demo-configure-a-dynamic-iframe-using-a-prefilled-url).
{% endhint %}

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2FwW0WETiMFYEA1Fkc6Kag%2FDOC%20SF%20-%201920%20x%201080%20(24).png?alt=media&#x26;token=349f6a65-72a5-4f8e-97dd-724b64e89084" alt=""><figcaption></figcaption></figure>

### Fire Inspection Demo: Configure a dynamic IFrame using a prefilled URL

#### Step 1: Generate URL

Generate a [dynamic Share URL](https://docs.sharinpix.com/forms/salesforce-integration/generate-sharinpix-shareable-form-links-automatically) for the record where the form is launched.

#### Step 2: Prefill URL

* Add a **Text** question.
* Set an API name for the question (example: `album_share_url`).
* [Prefill](https://docs.sharinpix.com/forms/form-elements/form-features-default-or-prefill-values) it with the field name storing the Share URL (example: `Share_URL__c`).
* Hide or disable the question.

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2Fi9LFn7Q7jerjz5NHZ9iM%2FDOC%20SF%20-%201920%20x%201080%20(30).png?alt=media&#x26;token=798704f2-ea3a-4de8-945b-143820f72189" alt=""><figcaption></figcaption></figure>

Make sure to set the api name of the text question to use it in a formula.

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2FmlytO5R3jPeve2yEKJrr%2FDOC%20SF%20-%201920%20x%201080%20(29).png?alt=media&#x26;token=b864def4-7066-4c30-86ab-c0b370bd419e" alt=""><figcaption></figcaption></figure>

#### Step 3: Use the dynamic share URL

* Set the IFrame **URL** to your prefilled Text value.
* Use `<PrefilledTextApiName>.value` to reference the field value.

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2FlbKOD1Pk033EetsJvNeo%2FDOC%20SF%20-%201920%20x%201080%20(28).png?alt=media&#x26;token=57c9a6a2-6dce-4ffd-8ea0-41cd5534deca" alt=""><figcaption></figcaption></figure>

#### Step 4: Test in preview

Preview the form to test the embedded content. Share access follows the Share settings.

<figure><img src="https://2647402409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRD1Xcn9HtKcyfQ9Ghyk%2Fuploads%2Fdv8JkksaClHhWuYIrNm1%2FDOC%20SF%20-%201920%20x%201080%20(20).png?alt=media&#x26;token=4591420e-7004-47cb-a322-0994dca9a131" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
**Note:**

* If you embed a SharinPix Share link, review its access level. Avoid edit access in read-only use cases.
* The IFrame element does not render in the PDF output.
* The IFrame is not limited to SharinPix Share: you can use any SalesForce public links
  {% endhint %}