1
Open your widget
Open the widget from your dashboard, or create a new widget.
2
Turn on Responsive
On the Basic tab, turn on Responsive. The preview shows the change.
3
Copy the new code
Click Install Widget. Then click Copy Code. 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.