Open Graph & Twitter Card Generator + UTM Builder

Generate Open Graph metadata tags with live Facebook and Twitter/X social card previews while assembling custom UTM tracking campaign URLs for Google Analytics.

Social cards are approximate previews, not crawler tests. Entering an image URL loads that image from its host. UTM parameters are encoded locally; existing matching UTM keys are replaced and URL fragments are preserved.

Open Graph & Twitter Inputs

Page Canonical URL *

Website / Brand Name

OG Content Type

Social Share Title *

Social Share Description *

OG Feature Image URL (1200x630px recommended) *

Twitter Card Type

Twitter Handle / Creator

Live Social Card Previews

TOOLRADAR360.COM

Free Open Graph & Twitter Card Generator + UTM Builder

Generate Open Graph meta tags, preview Facebook and Twitter/X social media cards in real time, and build custom tracking UTM parameters.

HTML Meta Tags Output

Campaign Tracking Parameters

Quick Channel Presets:

Target Destination URL *

Campaign Source (utm_source) *

Campaign Medium (utm_medium) *

Campaign Name (utm_campaign) *

Campaign Term (utm_term, optional)

Campaign Content (utm_content, optional)

Auto-convert parameters to lowercase (Recommended for Google Analytics consistency)

Compiled Tracked Campaign URL

UTM Parameter	Value	Analytics Purpose

100% Local Browser Engine: Social card previews, Open Graph meta tags, and UTM campaign parameters are calculated entirely in client browser memory. No link data or campaign parameters are uploaded to external servers.

Social Media Image & Meta Tag Dimensions Reference

Open Graph (OG) tags were introduced by Facebook to transform simple shared web links into rich interactive visual cards across Facebook, LinkedIn, Twitter/X, WhatsApp, and Slack.

🖼️ Open Graph (Facebook / LinkedIn / Slack)

Recommended Aspect Ratio: 1.91:1 horizontal landscape ratio.
Optimal Dimensions: 1200 × 630 pixels (Minimum: 600 × 315px).
Max Image File Size: 8 MB (WebP, PNG, or JPG formats).

🐦 Twitter / X Cards

summary_large_image: 1200 × 600 pixels (2:1 aspect ratio).
summary (Small Square): 144 × 144 pixels (1:1 ratio).
Handle Tagging: twitter:site and twitter:creator.

Workflow Guide

How to Use the OG & UTM Workstation in 4 Steps

1. Choose Tool Mode

Switch between the Social Card Generator or the UTM Campaign Builder tab.

2. Complete Parameters

Input your target URL, title, description, and image URL, or select a preset campaign template.

3. Inspect Real-Time Preview

Verify live Facebook, LinkedIn, and Twitter/X card layouts before publishing HTML tags.

4. Copy Code or Link

Copy compiled HTML <meta> tags into your page head or copy the fully assembled UTM link.

How Open Graph & UTM Tracking Work Together

When users click shared links on social media platforms or email newsletters, web analytics systems like Google Analytics 4 (GA4) depend on UTM parameters appended to the query string to categorize traffic source, medium, and campaign attributes.

Simultaneously, social web crawlers parse page <head> metadata tags (og:title, og:image, twitter:card) to display compelling visual preview snippets. Using optimized images and clear copy may help users understand shared links.

Campaign & Meta Tag Best Practices

Recommended Practices

Use lowercase for UTM parameters (e.g., utm_source=facebook instead of Facebook).
Always provide an absolute image URL starting with https://.
Include both Open Graph (og:*) and Twitter (twitter:*) meta tags for cross-platform fallback.
Test URLs with the Facebook Sharing Debugger or Twitter Card Validator prior to launch.

Practices to Avoid

Avoid relative image paths like /images/og.jpg in meta tags.
Do not use spaces or special characters in UTM parameters—use underscores or hyphens.
Do not confuse utm_source (where traffic originates) with utm_medium (marketing channel type).
Avoid oversized OG images exceeding 8MB that slow down social crawler fetching.

Applications

Common Marketing & Publishing Use Cases

Social Media Marketing

Generate preview tags for Facebook, LinkedIn, and Twitter shares to prepare consistent social-sharing metadata.

Email & Ad Campaign Tracking

Build tracked UTM links for Google Ads, Facebook Ads, and email newsletters for accurate GA4 conversion attribution.

Content Publishing

Prepare social metadata for blog posts, news releases and product pages.

FAQ

Frequently Asked Questions

What is the difference between Open Graph tags and Twitter Cards?

Open Graph (og:*) is a standard created by Facebook and adopted broadly by LinkedIn, Pinterest, WhatsApp, and Slack. Twitter Cards (twitter:*) are specific tags used by X (Twitter). If Twitter tags are missing, X falls back to Open Graph tags.

Which UTM parameters are mandatory?

For Google Analytics to accurately track a campaign, utm_source, utm_medium, and utm_campaign are required. utm_term and utm_content are optional.

Why isn't my social card image updating on Facebook or Twitter?

Social platforms cache social metadata. If you update your OG image, use the official Facebook Sharing Debugger or Twitter Card Inspector tool to clear the cached preview.

Should UTM links be used for internal site links?

No. You should never put UTM parameters on internal links within your own domain, as doing so overrides the original user traffic session in Google Analytics. Use UTM parameters exclusively on external incoming campaign links.