Free

Viewport Conditions

Show different content at exact screen widths.

What it does

Viewport Conditions swap content by width, not User-Agent. Resize this window to try it. Personalization on /demos/personalization/ uses the same idea for headings.

Live demo

Advanced tab stills. The Personalization demo is the live resize proof.

viewport-conditions admin screen 1
viewport-conditions admin screen 2
viewport-conditions admin screen 3
viewport-conditions admin screen 4

How to implement

  1. Select a widget → Advanced → Viewport Conditions.
  2. Set a min or max width.
  3. Resize the preview.