title: Replacing facebook share icon with font-awesome facebook icon
body: <p>I have been trying to add facebook share functionality for my webapp. I wanted to replace the default icon with that of font-awesome icon whose HTML is given below:</p>
  
  <pre><code> &lt;a href="#" id="fb-link"&gt;  
            &lt;span class="fa-stack fa-lg"&gt;
            &lt;i class="fa fa-square-o fa-stack-2x"&gt;&lt;/i&gt;
            &lt;i class="fa fa-facebook fa-stack-1x"&gt;&lt;/i&gt;
            &lt;/span&gt;
       &lt;/a&gt;
  </code></pre>
  
  <p>Though may not be necessary, let me share facebook share icon code I have been using:</p>
  
  <pre><code>&lt;div id="fb-root"&gt;&lt;/div&gt;
  &lt;script&gt;(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&amp;version=v2.0";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
  
  &lt;div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-type="icon"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I am preferably looking for a solution that avoids making an image from font awesome icons.</p>
  
  <p>Thanks for your time!</p>