Social Widget Customizer

Customize the appearance of your social feed or grid widget with real-time preview. Perfect for WordPress and any website.

Quick Presets

Core Settings

Theme

Base color scheme

Layout

Feed for scrollable posts, Grid for image gallery

Width

Widget width in pixels

Height

Widget height in pixels

Base URL

Your deployment domain (leave empty for current)

Channel Filter

Optional: filter posts by channel name/slug

Grid Layout Settings

Container Appearance

Post Card Appearance

Typography

Animations & Effects

Live Preview

Preview requires authentication for feed layout. Grid layout shows public media.

Embed Code

The social widget can work with or without authentication. Feed layout requires login; Grid layout is public.

Complete Embed Code

<script src="https://your-domain.com/js/social-widget.js"></script>

<legion-social
  api-url="https://your-domain.com"
  layout="feed"
></legion-social>

WordPress Integration

Follow these steps to add the social widget to your WordPress site.

Step 1: Add Script (One Time)

Add to your theme header.php or use "Header Footer Code Manager" plugin

<script src="https://your-domain.com/js/social-widget.js"></script>

Step 2: Add Widget

Paste in a Custom HTML block (Gutenberg) or Text mode (Classic Editor)

<legion-social
  api-url="https://your-domain.com"
  layout="feed"
></legion-social>

💡 WordPress Tips

Complete reference for all social widget customization options.

📋 Core Attributes

api-url       - Your deployment URL, default: current origin
theme         - "light" or "dark", default: light
layout        - "feed" or "grid", default: feed
width         - Widget width in pixels, default: 600
height        - Widget height in pixels, default: 800
rows          - Grid rows (grid layout only), default: 3
cols          - Grid columns (grid layout only), default: 3
community-url - Redirect URL for grid clicks
channel       - Filter posts by channel name/slug
auth-token    - JWT token for authenticated feed access

🎨 Theming Attributes

📐 Layout Types

🎯 Preset Themes