Poltio Web SDK Javascript API

If you are planning to use Poltio Widgets on your site, you can add additional features by using our Javascript SDK. By default, widget.js will find poltio div in your html markup and converts it to an iframe code. By using SDK, you can have our widget.js update the height of the iframe based on the content or you can load content based on the page url dynamically.


There are 2 components you need to add your page. You need to call our widget.js and you need a div:
                  <div class="poltio-widget"> </div>
                  <script async src="https://platform.poltio.com/widget.js"></script>
If you are planning to use Poltio Widgets in multiple places and/or multiple pages, you can include the script line once in your <head></head> section. Even if you add the widget.js multiple times, we only execute in your page once. But for a cleaner code you want to call widget.js once.
                    <div class="poltio-widget" data-content="poll/177858"></div>

Width & Height

By default, the widget will have a 100% width of its container and have a 500px height. You can customize these params via data-width="XX" and data-height="YY"
                    <div class="poltio-widget" data-width="400" data-height="600" data-content="poll/112791"></div>


By default, Poltio widgets align themselves in the middle of the area thats given to them. You can change this with data-align="left"
                    <div class="poltio-widget" data-align="left"  data-content="quiz/2077"></div>

Auto Resize

By default, our sdk will adjust the height property based on the content frame and disable scrolling. You can disable this behavior by adding data-resize="false"
                    <div class="poltio-widget" data-resize="false" data-height="300"  data-content="test/2330"></div>

Share & Notify

You can add follow up share & notify options after voting. These are turned off by default.
                    <div class="poltio-widget" data-share="on" data-notify="on" data-content="poll/151738"></div>


Poltio widgets supports English and Turkish. By default, we select the locale based on browser locale. But you can adjust this manually by data-lang="tr"
                    <div class="poltio-widget"  data-lang="tr" data-content="test/2215"></div>


You can set the content for the widget by data-content="type/id". Or you can have one dynamically loaded widget per page by adding data-pid="XXX" instead of data-content. You can then customize what this widget will load from your Poltio panel based on page url or other parameters.
                    <div class="poltio-widget"  data-pid="1"></div>