How it Works

To add your game, you need to:

1. Twitter Card and Open Graph meta tags on your game's page
2. CORS headers configured to allow access from https://x.com and https://xg.benallfree.com
3. Handle embedded mode - we'll append ?embed=xgames to your twitter:game URL only. Use this parameter to detect when your game is running in embedded mode.

Meta Tags

Your page must include these meta tags:

• twitter:cardMust be set to"game"
• twitter:siteYour X (Twitter) username
• twitter:titleThe title of your game
• twitter:descriptionA brief description of your game
• twitter:imageAn absolute URL to your game's preview image
• twitter:gameThe URL where your game can be played
• twitter:game:typeControl scheme: touch, mousekeyboard (default), or multi

We also recommend adding these Open Graph meta tags for better social sharing:

• og:urlThe URL of your game's page
• og:typeSet to"website"
• og:titleThe title of your game
• og:descriptionA brief description of your game
• og:imageAn absolute URL to your game's preview image

Example Implementation

<!-- Twitter Card Meta Tags -->
<meta name="twitter:card" content="game" />
<meta name="twitter:site" content="@benallfree" />
<meta name="twitter:title" content="Sugar Glide" />
<meta
  name="twitter:description"
  content="Guide flying squirrels through the trees with their adorable baby squirrels in this fun gliding adventure!"
/>
<meta
  name="twitter:image"
  content="https://sugarglide.benallfree.com/images/splash.jpg"
/>
<meta name="twitter:game" content="https://sugarglide.benallfree.com" />
<meta name="twitter:game:width" content="1024" />
<meta name="twitter:game:height" content="576" />
<meta name="twitter:game:type" content="mousekeyboard" />

<!-- Facebook Open Graph Meta Tags -->
<meta property="og:url" content="https://sugarglide.benallfree.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Sugar Glide" />
<meta property="og:description" content="Guide flying squirrels through the trees with their adorable baby squirrels in this fun gliding adventure!" />
<meta property="og:image" content="https://sugarglide.benallfree.com/images/splash.jpg" />

CORS Requirements

Your game and image URLs must have proper CORS headers to allow access from both required origins. Each origin will be tested separately:

• SetAccess-Control-Allow-Originto either*or configure for both:
• https://x.com
• https://xg.benallfree.com
• Both the game URL and image URL must be publicly accessible
• URLs must use HTTPS for security

Implementation Examples

Express.js with cors package:

const express = require('express')
const cors = require('cors')
const app = express()

// Option 1: Allow all origins (easiest but least secure)
app.use(cors())

// Option 2: Allow specific origins
app.use(cors({
  origin: [
    'https://x.com',
    'https://xg.benallfree.com',
    'https://<your-domain.com>'
  ]
}))

Plain Node.js:

const http = require('http')

const ALLOWED_ORIGINS = [
  'https://x.com',
  'https://xg.benallfree.com',
  'https://<your-domain.com>'
]

http.createServer((req, res) => {
  const origin = req.headers.origin
  
  // Only set CORS header if origin is allowed
  if (ALLOWED_ORIGINS.includes(origin)) {
    res.setHeader('Access-Control-Allow-Origin', origin)
  }
  
  // Handle preflight requests
  if (req.method === 'OPTIONS') {
    res.setHeader('Access-Control-Allow-Methods', 'GET, OPTIONS')
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type')
    res.writeHead(204)
    res.end()
    return
  }

  // Your game content here
  res.writeHead(200)
  res.end('Game content')
}).listen(3000)