Complete guide to all available widgets, their theming options, and live previews.
The community widgets work together to create a complete community page experience.
You can optionally filter the social feed (and grid) to a specific channel.
channel="<channel-slug>"layout="feed" and layout="grid"Examples:
1<!-- Feed layout filtered to announcements channel -->
2<legion-social
3 layout="feed"
4 channel="announcements"
5 auth-token="your-jwt-token"
6 width="600"
7 height="800"
8 api-url="${window.location.origin}"
9></legion-social>
10
11<!-- Grid layout filtered to general channel -->
12<legion-social
13 layout="grid"
14 channel="general"
15 rows="2"
16 cols="4"
17 width="800"
18 height="400"
19 api-url="${window.location.origin}"
20 community-url="${window.location.origin}/community"
21></legion-social>Note: If your Supabase schema does not include a channel_slug column on public.social_posts, the widget will gracefully fall back to shop-wide posts.
Tip: For embedding, prefer using the web components under /js/*.js and follow the attribute guides in each doc. Social features (feed, comments, reactions, notifications) are powered by Supabase tables and Realtime; no Firebase is required.