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

# How to Embed a PDF in a Weavely Form

> Learn how to embed a PDF in your forms with Weavely AI. Perfect for surveys, feedback forms, or custom data collection with embedded content.

<span className="weavely-jsonld" hidden>
  {`{
    "@context": "https://schema.org",
    "@graph": [
    {
      "@type": "WebPage",
      "@id": "https://help.weavely.ai/features/embed-pdf",
      "url": "https://help.weavely.ai/features/embed-pdf",
      "name": "How to Embed a PDF in a Weavely Form",
      "description": "Learn how to embed a PDF in your forms with Weavely AI. Perfect for surveys, feedback forms, or custom data collection with embedded content.",
      "inLanguage": "en",
      "isPartOf": {
        "@type": "WebSite",
        "@id": "https://help.weavely.ai/#website",
        "name": "Weavely Help Center"
      },
      "breadcrumb": {
        "@type": "BreadcrumbList",
        "itemListElement": [
          { "@type": "ListItem", "position": 1, "name": "Features", "item": "https://help.weavely.ai/features" },
          { "@type": "ListItem", "position": 2, "name": "Embed PDF", "item": "https://help.weavely.ai/features/embed-pdf" }
        ]
      },
      "publisher": { "@id": "https://www.weavely.ai/#org" }
    },
    {
      "@type": "TechArticle",
      "headline": "How to Embed a PDF in a Weavely Form",
      "description": "Step-by-step guide for embedding a Google Drive–hosted PDF inside a Weavely AI form, including DNS permissions, iframe setup, and display optimization.",
      "inLanguage": "en",
      "mainEntityOfPage": { "@id": "https://help.weavely.ai/features/embed-pdf" },
      "author": { "@id": "https://www.weavely.ai/#org" },
      "publisher": { "@id": "https://www.weavely.ai/#org" }
    },
    {
      "@type": "VideoObject",
      "name": "How to Embed a PDF into Your Web Form with Weavely AI",
      "description": "Want to add a PDF directly into your form experience? In this tutorial, I’ll show you how to embed a PDF inside a Weavely web form, perfect for sharing terms, contracts, guides, or reference materials right where users need them.",
      "thumbnailUrl": ["https://i.ytimg.com/vi/NHA8ducXP5w/maxresdefault.jpg"],
      "uploadDate": "2025-10-29T12:00:00Z",
      "duration": "PT3M36S",
      "embedUrl": "https://www.youtube.com/embed/NHA8ducXP5w",
      "contentUrl": "https://youtu.be/NHA8ducXP5w",
      "potentialAction": {
        "@type": "WatchAction",
        "target": "https://youtu.be/NHA8ducXP5w"
      }
    },
    {
      "@type": "Organization",
      "@id": "https://www.weavely.ai/#org",
      "name": "WEAVE.LY BV",
      "url": "https://www.weavely.ai",
      "address": {
        "@type": "PostalAddress",
        "streetAddress": "Herbert Hooverlaan 141",
        "addressLocality": "Schaarbeek",
        "postalCode": "1030",
        "addressCountry": "BE"
      },
      "identifier": "BE0773.878.569",
      "sameAs": [
        "https://www.instagram.com/weavely.ai/",
        "https://www.linkedin.com/company/weave-ly/",
        "https://www.youtube.com/@weavely"
      ]
    }
    ]
    }`}
</span>

You can embed a PDF directly into your Weavely form, allowing users to view documents like product specs, guides, or legal disclaimers without leaving the form experience. This tutorial walks you through embedding a PDF from Google Drive and optimizing how it's displayed in your form.

<iframe src="https://www.youtube.com/embed/NHA8ducXP5w" title="YouTube video player" frameborder="0" className="w-full aspect-video rounded-xl" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen />

<Steps>
  <Step title="Upload the PDF to Google Drive" icon="file-doc" titleSize="h2">
    If you haven't already, upload your PDF to [Google Drive](https://drive.google.com). Open the PDF by double-clicking and select \*\*"Open in new tab" \*\*from the three-dot menu. Within this new tab, click the three-dot menu (it's weird we know) and choose **"Embed item"**.

    <img src="https://mintcdn.com/weavelyai/RiQjy8Eb4cEjM_C0/images/pdf-embed-ezgif.com-gif-to-webp-converter.webp?fit=max&auto=format&n=RiQjy8Eb4cEjM_C0&q=85&s=570f5ae413291250e39291d94edc178a" alt="Animated screenshot showing how to get an embeddable iframe code from a PDF hosted on Google Drive" width="1510" height="706" data-path="images/pdf-embed-ezgif.com-gif-to-webp-converter.webp" />

    Copy the HTML `<iframe>` code provided by Google, which we'll use in the next step.

    <Warning>
      Make sure the sharing permissions are set to **“Anyone with the link can view”**. Without this, the embed will not load in your form.
    </Warning>
  </Step>

  <Step title="Embed in Weavely" icon="code" titleSize="h2">
    In your Weavely form, add an **Embed HTML** element. Open the element's settings pane and copy-paste the `<iframe>` code from the first step. Once published, your PDF will appear directly inside the form, and users can preview it without leaving the page. They can also click the pop-out button in the PDF viewer to open it full screen.

    <img src="https://mintcdn.com/weavelyai/RiQjy8Eb4cEjM_C0/images/pdf-embed2.gif?s=a1621bbea106efb1be45e50f18ab331c" alt="Animated screenshot showing how to embed a PDF into a Weavely AI form" width="1510" height="706" data-path="images/pdf-embed2.gif" />

    <Tip>
      We suggest you set both the width and height in the `<iframe> `code to 100% to ensure it fills the container.
    </Tip>
  </Step>

  <Step title="Improve the PDF Display" icon="palette" titleSize="h2">
    If the embedded PDF appears too small or scroll-heavy, you can adjust the layout. Go to the **Theme Editor** in Weavely. Under **Advanced Settings**, increase the **Form Width** to give the PDF more space and add the following **Custom CSS** to adjust the aspect ratio:

    ```css theme={null}
    .embed-html {
        width: 100%;
        height: 100%;
        aspect-ratio: 1 / 1;
        background: var(--surface-color);
        overflow: auto;
    }
    ```

    <img src="https://mintcdn.com/weavelyai/RiQjy8Eb4cEjM_C0/images/pdf-embed-custom-ezgif.com-gif-to-webp-converter.webp?fit=max&auto=format&n=RiQjy8Eb4cEjM_C0&q=85&s=848e6ff02f282e02bea986d9a8985ad1" alt="Animated screenshot showing how to change the appearance of an embedded pdf in Weavely AI " width="1510" height="706" data-path="images/pdf-embed-custom-ezgif.com-gif-to-webp-converter.webp" />
  </Step>
</Steps>
