viraxpress/meta-og-twitter

ViraXpress Meta, Open Graph and Twitter Card Module for Magento 2

Maintainers

Package info

github.com/viraxpress/MetaOgTwitter

Type:magento2-module

pkg:composer/viraxpress/meta-og-twitter

Statistics

Installs: 0

Dependents: 0

Suggesters: 0

Stars: 0

Open Issues: 0

1.0.0 2026-04-10 12:24 UTC

This package is auto-updated.

Last update: 2026-06-10 11:12:19 UTC


README

A powerful Magento 2 extension that automatically generates and manages Open Graph (OG) and Twitter Card meta tags for your store's products, categories, and CMS pages.

Description

The ViraXpress Meta, Open Graph and Twitter Card Module enhances your store's social media sharing capabilities by automatically generating rich, customizable meta tags for social platforms. With this extension, when customers share your products, categories, or pages on social media, they appear with attractive preview cards featuring images, titles, and descriptions.

This module provides complete control over how your store content appears across Facebook, Twitter, LinkedIn, and other social platforms that support Open Graph and Twitter Card standards.

Features

Open Graph (OG) Tags

  • Multi-Entity Support: Generate OG tags for CMS pages, product pages, and category pages
  • Customizable OG Title: Choose which product/category/page attributes to use as the OG title
  • Customizable OG Description: Configure which attributes populate the OG description
  • Automatic Truncation: Descriptions are automatically truncated to 200 characters for optimal display
  • Enable/Disable Per Entity: Independently toggle OG tag generation for each entity type

Twitter Card Tags

  • Multiple Card Types: Support for Summary, Photo, Video, Player, and App card types
  • Twitter Site Configuration: Set your Twitter site username for card attribution
  • Twitter Author Handle: Configure the default author handle for content
  • Multi-Entity Support: Configure Twitter tags for CMS pages, products, and categories
  • Title and Description Customization: Map entity attributes to Twitter card titles and descriptions
  • Automatic Character Truncation: Descriptions truncated to 200 characters for Twitter display
  • Enable/Disable Per Entity: Independently control Twitter tag generation for each content type

App Card Integration

  • iOS Support: Configure iPhone and iPad app details including:
    • App ID from Apple App Store
    • App name
    • Custom URL scheme or App Store link
  • Android Support: Configure Android app details including:
    • App ID from Google Play Store
    • App name
    • Custom URL scheme or Play Store link

Player Card Integration

  • Media Player Support: Embed media players with configurable:
    • Player URL
    • Player width and height
    • Direct player framework integration

Administrative Control

  • Centralized Configuration: Manage all settings from Stores > Configuration > ViraXpress -> OG and Twitter Meta Tags
  • Scope-Based Settings: Configure OG and Twitter tags at global, website, or store level
  • General Control: Enable/disable tags independently for each content type and scope
  • Flexible Mapping: Map any product, category, or page attribute to OG/Twitter tag fields

Compatibility

  • Magento 2.4.x

Installation

  1. Install the extension via Composer:

    composer require viraxpress/meta-og-twitter
  2. Run the following commands from your Magento root directory:

    php bin/magento module:enable ViraXpress_MetaOgTwitter
    php bin/magento setup:upgrade
    php bin/magento setup:di:compile
    php bin/magento setup:static-content:deploy -f
    php bin/magento cache:flush

Configuration

Accessing Configuration

  1. Navigate to Stores > Configuration -> ViraXpress in the Magento Admin Panel
  2. Look for the OG and Twitter Meta Tags section.
  3. Expand to view configuration options for OG Tags and Twitter Tags

Configuring OG Tags

For CMS Pages:

  1. Go to OG Tags > Tags for CMS Pages
  2. Enable OG Tags: Toggle to enable/disable OG tag generation
  3. OG Title: Select which page attribute to use as the title
  4. OG Description: Select which page attribute to use as the description

For Category Pages:

  1. Go to OG Tags > Tags for Category Page
  2. Enable OG Tags: Toggle to enable/disable OG tag generation for categories
  3. OG Title: Select which category attribute (Name, Description, etc.) to use as the title
  4. OG Description: Select which category attribute to use as the description

For Product Pages:

  1. Go to OG Tags > Tags for Product Page
  2. Enable OG Tags: Toggle to enable/disable OG tag generation for products
  3. OG Title: Select which product attribute (Product Name, SKU, etc.) to use as the title
  4. OG Description: Select which product attribute to use as the description

Configuring Twitter Tags

Global Twitter Settings:

  1. Go to Twitter Tags section
  2. Twitter Card Type: Select from:
    • Summary: Default card type with summary text
    • Photo: Card featuring a photo/image
    • Video: Card for video content
    • Player: Card for embedded media players
    • App: Card for mobile app promotion
  3. Twitter Site Username: Enter your Twitter site username (without @)
  4. Twitter Author Handle: Enter the default author's Twitter handle

App Card Integration (when Card Type is "App"):

  1. Navigate to App Card Integration section
  2. Configure for each platform:
    • iPhone App ID: Apple App Store ID
    • iPhone App Name: Display name from App Store
    • iPhone App URL: Deep link or custom scheme URL
    • iPad App ID: iPad app store ID
    • iPad App Name: Specify iPad app name
    • iPad App URL: Deep link for iPad
    • Android App ID: Google Play Store ID
    • Android App Name: Application name from Play Store
    • Android App URL: Deep link or Play Store URL

Player Card Integration (when Card Type is "Player"):

  1. Navigate to Player Card Integration section
  2. Player URL: Enter the URL to your media player
  3. Player Width: Set width in pixels (e.g., 800)
  4. Player Height: Set height in pixels (e.g., 450)

For CMS Pages:

  1. Go to Twitter Tags > Tags for CMS Page
  2. Enable Twitter Tags: Toggle to enable/disable Twitter tag generation
  3. Twitter Title: Select which page attribute to use as the title
  4. Twitter Description: Select which page attribute to use as the description

For Category Pages:

  1. Go to Twitter Tags > Tags for Category Page
  2. Enable Twitter Tags: Toggle to enable/disable Twitter tag generation
  3. Twitter Title: Select the category attribute for the title
  4. Twitter Description: Select the category attribute for the description

For Product Pages:

  1. Go to Twitter Tags > Tags for Product Page
  2. Enable Twitter Tags: Toggle to enable/disable Twitter tag generation
  3. Twitter Title: Select the product attribute for the title
  4. Twitter Description: Select the product attribute for the description

Frontend Output

Once configured, the module automatically:

  1. Generates <meta> tags in the page <head> section
  2. Outputs OG tags with namespace og: (for Facebook and other platforms)
  3. Outputs Twitter tags with namespace twitter: (for Twitter/X)
  4. Truncates descriptions to 200 characters for optimal display
  5. Escapes special characters to prevent injection attacks

Example Generated Tags

Open Graph Tags:

<meta property="og:title" content="Product Title" />
<meta property="og:description" content="Product description..." />
<meta property="og:image" content="https://example.com/product-image.jpg" />
<meta property="og:url" content="https://example.com/product/..." />
<meta property="og:type" content="product" />

Twitter Card Tags:

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Product Title" />
<meta name="twitter:description" content="Product description..." />
<meta name="twitter:image" content="https://example.com/product-image.jpg" />
<meta name="twitter:site" content="@your_site" />

Support

For support, please contact ViraXpress at https://www.viraxpress.com or refer to the license agreement.

License

This extension is licensed under the ViraXpress license agreement. See https://www.viraxpress.com/license for details.