Fillio ဖောင်များ ထည့်သွင်းခြင်း

မည်သည့်ဝဘ်ဆိုက်တွင်မဆို Fillio ဖောင်ထည့်သွင်းရန် နည်းလမ်းသုံးမျိုး: Standard၊ Popup နှင့် Full Page။

သင့်ကုဒ်ကို ဘယ်မှာ ရှာရမလဲ

ဖောင်ကို ဖွင့်ပြီး မျှဝေရန် တဘ်သို့ သွားကာ မြှုပ်သွင်းရန် ကို ရွေးပါ။ Fillio က သင့်ဖောင် ID နှင့် သင်ရွေးထားသော ရွေးချယ်မှုများ ထည့်သွင်းပြီးသား ကုဒ်တိုကို ထုတ်ပေးပါသည်။ အောက်ပါ ဥပမာများသည် ထုတ်ပေးလိုက်သည့် ရလဒ်ကို ပြထားခြင်း ဖြစ်ပါသည်။

ထည့်သွင်းမှုမုဒ်များ

သင်၏ layout နှင့် ကိုက်ညီသောမုဒ်ကို ရွေးပါ။

ပုံမှန်

စာမျက်နှာပိုင်းအတွင်း inline ထည့်သွင်းမှု

ပေါ့ပ်အပ်

ဖွင့်လိုက်သည့်အခါ modal overlay အဖြစ် ပွင့်သည်

စာမျက်နှာအပြည့်

HTML စာမျက်နှာတစ်ခုလုံးကို ယူထားသည်

Standard ထည့်သွင်းမှု

မည်သည့် HTML စာမျက်နှာတွင်မဆို ကုဒ်ကို ကူးထည့်ပါ။ ဖောင်သည် inline 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>

ရွေးချယ်စရာများ

အပြုအမူကို စိတ်ကြိုက်ပြင်ဆင်ရန် ဤ query parameters များကို embed URL တွင် ထည့်ပါ။

ပါရာမီတာ	ဖော်ပြချက်
?hideTitle=1	embed အတွင်းရှိ ဖောင်ခေါင်းစဉ်ကို ဝှက်သည်
?transparentBackground=1	embed frame မှ အဖြူရောင်နောက်ခံကို ဖယ်ရှားသည်
?dynamicHeight=1	ဖောင်အမြင့်နှင့် ကိုက်ညီစေရန် iframe ကို အလိုအလျောက် ချိန်ညှိသည်

Popup ထည့်သွင်းမှု

မည်သည့် ခလုတ် သို့မဟုတ် လင့်ခ်မှမဆို ဖောင်ကို ဖွင့်ပါ။ Fillio widget script တင်ဆောင်ရန် လိုအပ်သည်။

၁. Script ထည့်ပါ

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

၂. ခလုတ်ဖြင့် ဖွင့်ပါ

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

data-fillio-open ပါဝင်သော အရာတိုင်းကို Fillio ၏ မူလခလုတ် ဒီဇိုင်းဖြင့် ပြသပါသည်။ ၎င်းကို ကျော်လွှားလိုပါက သင့်ကိုယ်ပိုင် class ကို ထည့်ပါ။

အက်ထရီဗျုက်	ဖော်ပြချက်
data-fillio-open	ဖောင် ID (လိုအပ်သည်)
data-fillio-width	Popup အကျယ် pixels ဖြင့်
data-fillio-hide-title	ဖောင်ခေါင်းစဉ်ဝှက်ရန် 1 သတ်မှတ်ပါ

၃. JavaScript ဖြင့် ဖွင့်ပါ

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

ပေါ့ပ်အပ်ကို သင့်ကိုယ်ပိုင်ကုဒ်မှ အချိန်မရွေး ပိတ်နိုင်ပါသည်။

Fillio.closePopup('YOUR_FORM_ID');

လင့်ခ်မှ ဖွင့်ခြင်း

URL fragment တစ်ခုသည် စာမျက်နှာ ဖွင့်လိုက်သည်နှင့် ပေါ့ပ်အပ်ကို ဖွင့်ပေးပါသည်။ ထို့ကြောင့် မီနူးတစ်ခု၊ မက်ဆေ့ချ်တစ်ခု သို့မဟုတ် အခြားစာမျက်နှာမှ ဖောင်ဆီ ရောက်ရန် လွယ်ကူပါသည်။

<a href="https://your-site.com/page#fillio-open=YOUR_FORM_ID&fillio-width=600">Open Form</a>

ပေါ့ပ်အပ် လုပ်ဆောင်ပုံ

အကျယ်ကို သီးသန့် မသတ်မှတ်ပါက ပေါ့ပ်အပ်သည် 500 px ကျယ်ပြီး အလျားလိုက်ဖြစ်စေ ဒေါင်လိုက်ဖြစ်စေ မျက်နှာပြင်၏ 90% ကို ကျော်လွန်မည် မဟုတ်ပါ။ နောက်ခံကို နှိပ်ခြင်း သို့မဟုတ် Esc နှိပ်ခြင်းဖြင့် ပိတ်နိုင်ပြီး onOpen နှင့် onClose တို့သည် အစနှင့် အဆုံးတွင် အလုပ်လုပ်ပါသည်။

Full Page ထည့်သွင်းမှု

ဖောင်သည် viewport တစ်ခုလုံး ဖြည့်သင့်သည့်အခါ ဤ HTML template ကို အသုံးပြုပါ။

<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>

ရွေးချယ်စရာများ

အပြုအမူကို စိတ်ကြိုက်ပြင်ဆင်ရန် ဤ query parameters များကို embed URL တွင် ထည့်ပါ။

ပါရာမီတာ	ဖော်ပြချက်
?transparentBackground=1	embed frame မှ အဖြူရောင်နောက်ခံကို ဖယ်ရှားသည်

အကြံပြုချက်

မြှုပ်သွင်းထားသော ဖောင်သည် Fillio ပေါ်ရှိ ဖောင်နှင့် အတိအကျ တူညီစွာ အလုပ်လုပ်ပါသည်။ အခြေအနေအလိုက် လော်ဂျစ်၊ စာမျက်နှာများနှင့် သင့်ဖောင်၏ အပြင်အဆင် အားလုံး iframe အတွင်း အလုပ်လုပ်ပါသည်။