https://github.com/Leocardoso94/social-tags-webpack-plugin

A wepback plugin to generate social meta-tags
https://github.com/Leocardoso94/social-tags-webpack-plugin

facebook meta-tags twitter webpack webpack-plugin

Last synced: 3 months ago
JSON representation

A wepback plugin to generate social meta-tags

• Host: GitHub
• URL: https://github.com/Leocardoso94/social-tags-webpack-plugin
• Owner: Leocardoso94
• License: mit
• Archived: true
• Created: 2018-01-09T17:24:01.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2018-06-08T02:22:51.000Z (over 6 years ago)
• Last Synced: 2024-07-05T14:01:34.446Z (4 months ago)
• Topics: facebook, meta-tags, twitter, webpack, webpack-plugin
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/social-tags-webpack-plugin
• Size: 297 KB
• Stars: 10
• Watchers: 3
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
# social-tags-webpack-plugin

`social-tags-webpack-plugin` is a webpack plugin that generates a the meta-tags to facebook and twitter, like this:

```html

```

# Install

```

npm install --save-dev social-tags-webpack-plugin

yarn add -D social-tags-webpack-plugin

```

# Usage

In your `webpack.config.js`:

```javascript

// ES6+

const SocialTags = require('social-tags-webpack-plugin')

...

plugins: [

    ...

    new SocialTags({

      appUrl: 'http://example.com/',

      facebook: {

        'fb:app_id': "123456789",

        'og:url': "http://example.com/page.html",

        'og:type': "website",

        'og:title': "Content Title",

        'og:image': 'src/img/book.png',

        'og:description': "Description Here",

        'og:site_name': "Site Name",

        'og:locale': "en_US",

        'og:article:author': "",

      },

      twitter: {

        "twitter:card": "summary",

        "twitter:site": "@site_account",

        "twitter:creator": "@individual_account",

        "twitter:url": "http://example.com/page.html",

        "twitter:title": "Content Title",

        "twitter:description": "Content description less than 200 characters",

        "twitter:image": './src/img/book.png'

      },

    })

]

```

### Test your page with :

- 🛠 [Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/)

- 🛠 [Twitter Card Validator](https://cards-dev.twitter.com/validator)