Free SEO Tool

Open Graph & Twitter Card Generator for Law Firms

Build Open Graph and Twitter Card meta tags with a live preview so your firm's links look sharp when shared on Facebook, LinkedIn, and X. Free and private.

Page Title

Description

Page URL

Site Name

Image URL

Recommended size 1200×630px for the sharpest social preview.

Open Graph Type

Twitter Card Type

Social share preview

Image preview (1200×630)

smithlaw.com

Your page title preview

Your description preview appears here as it would when the link is shared on Facebook, LinkedIn, or X.

What Open Graph and Twitter Card tags do

Every time someone shares a link to your firm's website on Facebook, LinkedIn, X, or even in a text message, the platform tries to build a preview card — an image, a headline, and a short description. It decides what to show by reading special meta tags in your page's HTML: the Open Graph protocol (used by Facebook, LinkedIn, Slack, WhatsApp, and most apps) and Twitter Cards (used by X). When those tags are missing, the platform guesses, and the result is usually a broken or generic card that undercuts the professionalism your firm works hard to project.

This free tool writes both sets of tags for you and shows a live preview of the resulting card, so you can control exactly what prospective clients see the moment your link hits their feed. No code knowledge is required — fill in the fields, copy the output, and paste it into your page.

Why social previews matter for law firms

Legal marketing runs on trust and first impressions. A shared blog post about "what to do after a car accident" or a case-result announcement lives or dies on how it looks in the feed. A crisp 1200×630 image with a clear headline and a benefit-driven description invites the click; a pixelated thumbnail with a truncated URL repels it. Because referral and social traffic is often high-intent — a friend sharing your article with someone who was just injured — the quality of that preview card can directly influence whether a case walks through your door.

There is a compounding effect, too. Better previews earn more clicks and shares, which sends more traffic and engagement signals to your pages. While Open Graph tags are not themselves a direct ranking factor, the downstream behavior they drive supports your broader AI SEO strategy and your site's authority.

How to use the generated tags

Enter the page title, description, canonical URL, site name, and a hosted image URL. Choose the Open Graph type — website for most pages, article for blog posts — and a Twitter Card type, usually summary_large_image for the big image layout. Watch the preview update live, then click generate, copy the full block of tags, and paste it inside the <head> of that specific page. Repeat for each important page, giving every one its own unique tags.

Image and formatting best practices

Use 1200×630 pixels. This 1.91:1 ratio fills the large card on every major platform.
Host the image on a real, public URL. Relative paths and local files will not render in previews.
Keep titles under about 60 characters and descriptions under about 155 so nothing gets truncated.
Make each page unique. Reusing one set of tags site-wide makes every shared link look identical.

Testing and common mistakes

Before you rely on your new tags, validate them with each platform's official debugger: Facebook's Sharing Debugger, LinkedIn's Post Inspector, and X's Card Validator. These tools force a fresh scrape and show the exact card, which is essential because platforms cache previews aggressively — if you shared a link before adding tags, you must re-scrape it to see the update. The most common mistakes are pointing og:image at an image that is not publicly reachable, forgetting the twitter:card tag so X falls back to a plain link, and leaving the description blank. Pair this tool with our meta title and description generator to complete your page's on-page metadata in one sitting.

Designing images that earn the click

The image is the single biggest driver of whether a shared link gets attention, so treat it as a small piece of marketing rather than an afterthought. For a law firm, an effective Open Graph image is clean and legible at thumbnail size: your logo or firm name, a short benefit-driven phrase, and plenty of contrast. Avoid cramming in dense text or a busy stock photo — most of the detail disappears when the card shrinks in a mobile feed. A consistent template across your articles also builds recognition over time, so a prospective client begins to associate that look with your firm before they even read the headline.

Think, too, about which pages deserve custom images. Your highest-intent pages — practice-area landing pages, contact and consultation pages, and your most-shared articles — should each get a purpose-built card. Lower-priority pages can fall back to a well-designed default site image so nothing ever shares as a broken preview. This tiered approach concentrates your design effort where the clicks and cases actually come from, and it complements the rest of your on-page SEO work rather than competing with it for time.

Frequently Asked Questions

What are Open Graph and Twitter Card tags?

Open Graph and Twitter Card tags are meta tags in your page's HTML that control how a link looks when it is shared on social media. They define the title, description, and image that appear in the preview card on Facebook, LinkedIn, X, and messaging apps — turning a bare URL into a clickable, branded card.

Why do law firms need Open Graph tags?

Law firms need Open Graph tags because most shared legal content — blog posts, case results, contact pages — gets clicked based on how the preview looks. Without them, platforms grab a random image and truncated text, which looks unprofessional and lowers clicks. Proper tags let you control the exact headline and image prospective clients see.

What image size should I use for Open Graph?

Use 1200×630 pixels for the sharpest large preview across platforms. This 1.91:1 ratio fills the big image card on Facebook, LinkedIn, and X's summary_large_image format. Keep the file under about 5MB, use a real URL to a hosted image, and make sure it renders well at small sizes with legible text.

Where do I put these meta tags?

Paste the generated tags inside the section of the specific page you are optimizing, ideally near your title and description tags. Each page should have its own unique Open Graph tags reflecting that page's content — do not reuse one set site-wide, or every shared link will show the same generic card.

What is the difference between og:image and twitter:image?

og:image is read by Facebook, LinkedIn, Slack, and most platforms, while twitter:image is read by X. This tool outputs both so your card renders correctly everywhere. In practice they usually point to the same 1200×630 image, but Twitter Cards let you use a dedicated image if you want a different crop for X.

Do Open Graph tags affect SEO rankings?

Open Graph tags are not a direct Google ranking factor, but they indirectly help SEO by increasing click-through and shares. More engaging social previews drive more traffic and social signals to your pages. Clean, complete meta data also helps AI and search crawlers understand and represent your content accurately.

How do I test my Open Graph tags before publishing?

After adding the tags, use each platform's official debugger — Facebook's Sharing Debugger, LinkedIn's Post Inspector, and X's Card Validator — to preview the card and force a re-scrape. These tools show exactly how your link will render and flag missing or malformed tags so you can fix them before sharing.

Is this Open Graph generator free and private?

Yes. It runs entirely in your browser, builds the meta tags and live preview instantly, and sends nothing to any server. Enter your page details, copy the output, and paste it into your site's head section. There are no sign-ups, limits, or costs.