FoxrFoxr
Widgets

Layouts

The five ways a widget can show your clips — Stories, Carousel, Grid, Pop up, and Product page — and when to use each.

Every widget has one layout. You choose it in the widget editor under Media → Basics → Layout, and you can change it at any time. New widgets start as Stories.

By default, tapping a clip opens the player, where shoppers watch the videos and buy the tagged products. See What shoppers see.

LayoutWhat shoppers seeGood for
StoriesA row of round thumbnails with a coloured ring, like stories on social media.The top of your home page or collection pages. Familiar and compact.
CarouselA row of video cards that scrolls sideways, with arrows.Home page sections like "As seen on TikTok" or "Shop the look".
GridTiles in rows and columns, with an optional mosaic pattern.A UGC wall, a lookbook page, or a reviews section.
Pop upA small video bubble that floats in a corner of the page.Grabbing attention without taking up space in the page.
Product pageA swipeable strip of clips on a product page, showing the widget's clips tagged with that product.Showing real people using the product, right where shoppers decide to buy.

Choose a layout

Click Widgets in the app menu, then Add widget, or open a widget you already have.

On the Media tab, find the Basics card.

Open the Layout list and pick Stories, Carousel, Grid, Pop up, or Product page. The preview on the right changes straight away.

Look at the tab bar. The second tab is now named after your layout, so a Carousel widget has a Carousel tab. Grid widgets also get a Columns tab. That's where you set the size, shape, and extras for that layout.

Click Save.

Stories

A row of tappable circles with a gradient ring around each one. Circles are 100 px across by default. The row centres itself, and scrolls sideways when there are more circles than fit.

  • Thumbnails don't show product chips or captions. Shoppers see the product once they open a clip.
  • Circles can be rounded squares instead: set Corners on the Stories tab.
  • Circles can play silent previews. See On the thumbnails.

A row of cards, 250 px wide by default and 9:16 tall, like reels. Arrows sit under the row. They hide themselves when every card fits.

  • Each card can show a product chip, under the clip by default.
  • The carousel can advance by itself every few seconds. See Carousel arrows and movement.
  • Videos can play right inside the card instead of opening the player. See Player.

Grid

Tiles in rows. By default there are 5 per row on desktop, 3 on tablets, and 2 on phones. Tile size follows the number of columns, so there's no size setting.

  • Choose Even grid, or Mosaic, where the first tile and every fifth tile after it are double size. Phones always show an even grid. See Grid columns and pattern.
  • Each tile can show a product chip, over the clip by default.
  • Videos can play inside the tile, like Carousel.

Pop up

A small video that plays silently in a corner of the page after a few seconds, as a round bubble or a card. Tapping it opens the player with all the widget's clips. Shoppers can close it with ×.

  • Only one pop up shows at a time.
  • It needs a block on each page it should appear on. To show it everywhere, add the block to your theme's footer area.

See The Pop up layout.

Product page

A strip of clips next to the product, up to three at a time with the next one peeking in. It shows the widget's clips tagged with the product being viewed, and every clip in the widget on products that have none. One widget serves all your product pages, from its own clips, up to 24.

  • It only works on product pages, so its placement is locked to Product pages.
  • The clip in the middle plays a silent preview by default.

See The Product page layout.

Changing layout

Pick a new layout under Media → Basics → Layout and click Save. Settings you've customised, such as colours and spacing, carry over. Settings you haven't touched switch to the new layout's defaults. That includes the card size, the gap, the corners, the product chip, and the arrows.

Your clips stay as they are. Switching to Stories always crops thumbnails to squares.

Switching away from Product page

Choosing Product page sets Placement to Product pages. If you switch to another layout later, Placement stays on Product pages, so change it back if you need to.

On this page