1
Open your widget
Open the widget from your dashboard, or create a new widget.
2
Turn on Responsive
On the Basic tab, set Responsive to Yes. Click Update Preview to see the change.
3
Copy the new code
Click Update & Get Widget, or Get Widget for a new widget. Then click Copy To Clipboard. Replace the old code on your website with the new code.
The responsive code is different from the normal code. It adds a script and sets the widget width to 100%. If you keep the old code on your website, the widget keeps its old fixed size.
Show a different layout on phones
With a Pro Grid, Board, Slideshow or Scrolling widget, you can set a different layout for each screen size on the Responsive tab. For example, show 4 columns on desktops and 2 columns on phones. See Layouts by screen size. With free widgets, you can do this with two widgets and some CSS:- Make one widget for desktops, for example with 4 columns, and one widget for phones, for example with 2 columns.
- Add the code for both widgets to your page, each inside its own
div. - Use a CSS media query to show one widget at a time.