Mobile

How Raffle widgets behave on phones, and how to show a widget in a mobile app.

The same script serves desktop and mobile visitors; you don’t need a separate installation for phones. The widget treats screens up to 480px wide as phones and adapts its layout.

On phones

  • Launcher: the button uses the Mobile Button Text and the mobile offsets from Branding. When opened, the panel fills the screen.
  • Pill: a floating pill spans the full width of the screen and uses the Mobile vertical offset from Branding. Its suggested questions show before the keyboard opens.
  • Overlay: fills the screen.
  • Embedded: the search bar stays in your page. When a visitor taps it, the search opens full screen.
  • Intro Banner: can be turned off for phones with Disable on Mobile on the General tab.

To see how your widget looks on a phone before you install it, switch the widget editor’s preview to the phone view (see Test). Widget types shows a launcher on a phone.

In a mobile app

To show a widget in an iOS or Android app, open a page of your website that has the widget installed in a WebView. The widget must be on the page the WebView loads, not inside an <iframe> on that page; see Script. The WebView must meet the supported browsers: iOS 12 or Android 11 and newer.

Full flexibility with the Raffle API

If the search has to be fully tailored to your app, build your own interface on top of the Raffle API.