Fillio فارمز ایمبیڈ کرنا
کسی بھی ویب سائٹ میں Fillio فارم شامل کرنے کے تین طریقے: اسٹینڈرڈ، پاپ اپ اور فل پیج۔
اپنا کوڈ کہاں ملے گا
فارم کھولیے، شیئر ٹیب پر جائیے اور ایمبیڈ چنیے۔ Fillio آپ کے فارم ID اور منتخب کردہ اختیارات کے ساتھ کوڈ خود تیار کر دیتا ہے۔ نیچے کی مثالیں دکھاتی ہیں کہ نتیجہ کیسا ہوتا ہے۔
ایمبیڈ موڈز
وہ موڈ منتخب کریں جو آپ کے لے آؤٹ کے لیے موزوں ہو۔
اسٹینڈرڈ
صفحہ کے کسی حصے کے اندر ان لائن ایمبیڈ
پاپ اپ
فعال ہونے پر موڈل اوورلے کے طور پر کھلتا ہے
فل پیج
پوری 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>خودکار ری سائز کوڈ میں شامل وجٹ اسکرپٹ سے آتا ہے۔ اسے رہنے دیجیے، اور جواب دہندگان کے صفحات بدلنے کے ساتھ iframe فارم کے مطابق بڑھتا اور گھٹتا رہے گا۔
اسکرپٹ کے بغیر
اگر آپ وجٹ لوڈ نہ کرنا چاہیں تو مقررہ اونچائی کے ساتھ سادہ iframe استعمال کیجیے۔ کچھ بھی ری سائز نہیں ہوگا، اس لیے ایسی اونچائی چنیے جو آپ کے سب سے طویل صفحے میں پوری آ جائے۔
<iframe src="https://fillio.so/embed/YOUR_FORM_ID" width="100%" height="800" frameborder="0" marginheight="0" marginwidth="0" title="Form" style="border: 1px solid #e5e7eb; border-radius: 8px;"></iframe>اختیارات
سلوک کو حسب ضرورت بنانے کے لیے یہ کوئیری پیرامیٹرز ایمبیڈ URL میں شامل کریں۔
| پیرامیٹر | تفصیل |
|---|---|
| ?hideTitle=1 | ایمبیڈ کے اندر فارم کا عنوان چھپاتا ہے |
| ?transparentBackground=1 | ایمبیڈ فریم سے سفید پس منظر ہٹاتا ہے |
| ?dynamicHeight=1 | فارم کی اونچائی کے مطابق iframe کا سائز خود بخود تبدیل کرتا ہے |
پاپ اپ ایمبیڈ
کسی بھی بٹن یا لنک سے فارم کو فعال کریں۔ Fillio ویجٹ اسکرپٹ لوڈ کرنا ضروری ہے۔
1. اسکرپٹ شامل کریں
<script async src="https://fillio.so/widgets/embed.js"></script>2. بٹن سے فعال کریں
<button data-fillio-open="YOUR_FORM_ID" data-fillio-width="500">Open Form</button>data-fillio-open رکھنے والے ہر عنصر کو Fillio کا ڈیفالٹ بٹن اسٹائل مل جاتا ہے۔ اسے بدلنے کے لیے اپنی کلاس شامل کیجیے۔
| خصوصیت | تفصیل |
|---|---|
| data-fillio-open | فارم ID (ضروری) |
| data-fillio-width | پاپ اپ کی چوڑائی پکسلز میں |
| data-fillio-hide-title | فارم عنوان چھپانے کے لیے 1 مقرر کریں |
3. JavaScript سے فعال کریں
Fillio.openPopup('YOUR_FORM_ID', {
width: 500,
hideTitle: false,
onOpen: function () {},
onClose: function () {}
});پاپ اپ کو اپنے کوڈ سے جب چاہیں بند کیجیے۔
Fillio.closePopup('YOUR_FORM_ID');لنک سے کھولنا
URL کا فریگمنٹ صفحہ لوڈ ہوتے ہی پاپ اپ کھول دیتا ہے، جس سے فارم تک مینو کے کسی آئٹم، کسی پیغام یا کسی دوسرے صفحے سے پہنچنا آسان ہو جاتا ہے۔
<a href="https://your-site.com/page#fillio-open=YOUR_FORM_ID&fillio-width=600">Open Form</a>پاپ اپ کا رویہ
پاپ اپ 500 px چوڑا ہوتا ہے جب تک آپ چوڑائی خود مقرر نہ کریں، اور یہ کسی بھی سمت میں ویو پورٹ کے 90% سے آگے نہیں بڑھتا۔ پس منظر پر کلک کرنے یا Esc دبانے سے بند ہو جاتا ہے، اور دونوں سروں پر onOpen اور onClose چلتے ہیں۔
فل پیج ایمبیڈ
یہ 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 | ایمبیڈ فریم سے سفید پس منظر ہٹاتا ہے |
ایمبیڈ کیا گیا فارم بالکل ویسے ہی برتاؤ کرتا ہے جیسے ہوسٹ کیا ہوا: مشروط منطق، متعدد صفحات اور آپ کا فارم تھیم سب iframe کے اندر کام کرتے ہیں۔