Facebook Open Graph meta tags and Twitter card tags for Shopify. Add this as a snippet called "twitter-and-fb-graph.liquid" in your theme, and then add {% include 'twitter-and-fb-graph' %} to your theme.liquid file. Make sure to update with your fb appId and your Twitter handle.

fb-open-graph.liquid

<meta property="fb:app_id" content="xxxxx">
<meta name="twitter:site" content="@your-handle-here" />
<meta name="twitter:card" content="summary" />

{% if template contains 'product' %}
  <meta property="og:type" content="product">
  <meta name="twitter:title" content="{{ product.title | strip_html | escape }}" />
  <meta property="og:title" content="{{ product.title | strip_html | escape }}">
  <meta property="og:category" content="{{ product.type }}" />
  {% for image in product.images limit:3 %}
  <meta property="og:image" content="http:{{ image.src | product_img_url: 'master' }}">
  <meta property="og:image:secure_url" content="https:{{ image.src | product_img_url: 'master' }}">
  <meta name="twitter:image" content="https:{{ image.src | product_img_url: 'master' }}" />
  {% endfor %}
  <meta property="og:price:amount" content="{{ product.price | money_without_currency | stip_html | escape | remove: ',' }}">
  <meta property="og:price:currency" content="{{ shop.currency }}">
  <meta property="og:availability" content="{% if product.available %}instock{% else %}oos{% endif %}" />
  <meta property="og:description" content="{{ product.description | strip_newlines | strip_html | truncate: 300 | escape }}">
  <meta name="twitter:description" content="{{ product.description | strip_newlines | strip_html | truncate: 300 | escape }}" />

{% elsif template contains 'article' %}
  <meta property="og:type" content="article">
  <meta property="og:title" content="{{ article.title | strip_html | escape }}">
  <meta name="twitter:title" content="{{ article.title | strip_html | escape }}" />

  {% assign img_tag = '<' | append: 'img' %}
  {% if article.content contains img_tag %}
    {% assign src = article.content | split: 'src="' %}
    {% assign src = src[1] | split: '"' | first | remove: 'https:' | remove: 'http:' %}
    {% if src %}
  <meta property="og:image" content="http:{{ src }}">
  <meta property="og:image:secure_url" content="https:{{ src }}">
  <meta name="twitter:image" content="https:{{ src }}" />

    {% endif %}
  {% endif %}
{% else %}
  <meta property="og:type" content="website">
  <meta property="og:title" content="{{ page_title | escape }}">
  {% if settings.logo_use_image %}
  <meta property="og:image" content="http:{{ 'logo.png' | asset_url }}">
  <meta property="og:image:secure_url" content="https:{{ 'logo.png' | asset_url }}">
    <meta name="twitter:image" content="https:{{ 'logo.png' | asset_url }}" />

  {% endif %}
{% endif %}
{% if page_description and template != 'product' %}
  <meta property="og:description" content="{{ page_description | escape }}">
  <meta name="twitter:description" content="{{ product.description | strip_newlines | strip_html | truncate: 300 | escape }}" />

{% endif %}
  <meta property="og:url" content="{{ canonical_url }}">
  <meta property="og:site_name" content="{{ shop.name }}">

I updated with Twitter card tags.