جاگذاری فرم‌های Fillio

سه روش برای افزودن فرم Fillio به هر وب‌سایت: استاندارد، پنجره بازشو و تمام‌صفحه.

حالت‌های جاگذاری

حالتی را که با طرح‌بندی شما تناسب دارد انتخاب کنید.

استاندارد - جاگذاری درون‌خطی در بخشی از صفحه
پنجره بازشو - هنگام فعال‌سازی به صورت پوشش مودال باز می‌شود
تمام‌صفحه - کل یک صفحه HTML را پر می‌کند

جاگذاری استاندارد

کد را در هر صفحه HTML جای‌گذاری کنید. فرم به صورت iframe درون‌خطی نمایش داده می‌شود.

کد جاگذاری

<iframe data-fillio-src="https://fillio.so/embed/YOUR_FORM_ID" width="100%" height="800" frameborder="0" marginheight="0" marginwidth="0" title="Form" loading="lazy"></iframe>
<script>var d=document,w="https://fillio.so/widgets/embed.js",v=function(){"undefined"!=typeof Fillio?Fillio.loadEmbeds():d.querySelectorAll("iframe[data-fillio-src]:not([src])").forEach((function(e){e.src=e.dataset.fillioSrc}))};if("undefined"!=typeof Fillio)v();else if(d.querySelector('script[src="'+w+'"]')==null){var s=d.createElement("script");s.src=w,s.onload=v,s.onerror=v,d.body.appendChild(s);}</script>

گزینه‌ها

این پارامترهای پرس‌وجو را به URL جاگذاری اضافه کنید تا رفتار را سفارشی کنید.

پارامتر	توضیحات
?hideTitle=1	عنوان فرم را در جاگذاری پنهان می‌کند
?transparentBackground=1	پس‌زمینه سفید را از قاب جاگذاری حذف می‌کند
?dynamicHeight=1	اندازه iframe را به طور خودکار متناسب با ارتفاع فرم تغییر می‌دهد

جاگذاری پنجره بازشو

فرم را از هر دکمه یا لینکی فعال کنید. نیاز به بارگذاری اسکریپت ویجت Fillio دارد.

۱. اسکریپت را اضافه کنید

<script async src="https://fillio.so/widgets/embed.js"></script>

۲. با دکمه فعال کنید

<button data-fillio-open="YOUR_FORM_ID" data-fillio-width="500">Open Form</button>

۳. با JavaScript فعال کنید

Fillio.openPopup('YOUR_FORM_ID', {
  width: 500,
  hideTitle: false
});

ویژگی‌های داده

ویژگی	توضیحات
data-fillio-open	شناسه فرم (اجباری)
data-fillio-width	عرض پنجره بازشو بر حسب پیکسل
data-fillio-hide-title	برای پنهان کردن عنوان فرم روی ۱ تنظیم کنید

جاگذاری تمام‌صفحه

از این قالب HTML استفاده کنید زمانی که فرم باید کل پنجره نمایش را پر کند.

<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>Form</title>
    <script async src="https://fillio.so/widgets/embed.js"></script>
    <style type="text/css">
      html { margin: 0; height: 100%; overflow: hidden; }
      iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 0; }
    </style>
  </head>
  <body>
    <iframe data-fillio-src="https://fillio.so/embed/YOUR_FORM_ID" width="100%" height="100%" frameborder="0" marginheight="0" marginwidth="0" title="Form"></iframe>
  </body>
</html>

گزینه‌ها

این پارامترهای پرس‌وجو را به URL جاگذاری اضافه کنید تا رفتار را سفارشی کنید.

پارامتر	توضیحات
?transparentBackground=1	پس‌زمینه سفید را از قاب جاگذاری حذف می‌کند