如何共享從靜態的HTML頁面Facebook或Twitter或LinkedIn

Question

嗨我張貼在我的職業生涯頁一些工作使用HTML實現靜態網頁的工作，CSS存在對沒有後端功能的一部分。我需要分享這些工作到Facebook或Twitter或通過點擊這些按鈕鏈接在任何一個可以幫助我如何共享選項添加到工作portals.Here是小提琴鏈接

<div class="digitalmarketingassociate"> 
        <span class="digit">Digital Marketing Associate</span> 
        <div class="applynow">Apply Now</div> 
        <div class="moreinfo accordion" >More Info</div> 
        <div class="panel"> 
         <p>          
          <h3 class="job">Roles and Responsibilities</h3> 
          <ul class="rolesand">         
           <li class="rolesandres">Responsibility for hands on interaction within social media sites such as facebook, twitter etc.</li> 
           <li class="rolesandres">Responsibility for hands on interaction with off-site social properties ; other people blogs, other company facebook fan pages,forums etc.</li>         
          </ul> 
       <h3 class="job">How to apply</h3> 
          <p class="howtoapp">Email us your resume along with your Linkedin profile on ></a> Alternatively, you can also apply via <img src="image/testimonial/linkedin.png" alt="linkedin" /></p> 

          <h3 class="job">Share this job</h3> 
          <p> 
          <img src="image/career page/facebook.png" alt="facebook" class="careerfacebook"/> 
          <img src="image/career page/twitter.png" alt="twitter" class="careertwitter" /> 
          <img src="image/career page/linkedin.png" alt="linkedin" class="careerlinkedin"/> 
          <img src="image/career page/whatsapp.png" alt="whatsapp" class="careerwhatsapp"/> 
          <img src="image/career page/email.png" alt="email" class="careeremail" /></p> 
         </p> 
        </div> 

       </div> 

Answer 1

您可以創建和配置自己的按鈕位置： https://developers.facebook.com/docs/plugins/share-button#configurator

對於Twitter的，你可以看看這裏：

https://dev.twitter.com/web/tweet-button

對於多個共享按鈕，你可以給你的每一個「份額「按一個不同的ID，然後更改每個選項（標題，圖像，說明）。 請參考這個問題：

MANY FACEBOOK SHARE buttons in the same page?

Answer 2

我認爲你正在創建郵件，並想簡單的鏈接，分享你的URL。

這裏有樣本股鏈接

/*Facebook Share*/ 
<a href="https://www.facebook.com/sharer/sharer.php?u=http%3A//yourpage.com">Share on Facebook</a> 

/*Twitter Share*/ 
<a href="https://twitter.com/home?status=This%20is%20Awesome%20page!!%20http%3A//yourpage.com">Share on Twitter</a> 

/*Google Plus*/ 
<a href="https://plus.google.com/share?url=http%3A//yourpage.com">Share on Google+</a> 

/*LinkedIn*/ 
<a href="https://www.linkedin.com/shareArticle?mini=true&url=http%3A//yourpage.com&title=Title%20of%20your%20Page&summary=Optional%20Summary&source=http%3A//yoursource.com">Share on LinkedIn</a> 

/*What's App from Mobile*/ 
<a href="whatsapp://send?text=The text to share!" data-action="share/whatsapp/share">Share via Whatsapp</a> 

/*Email*/ 
<a href="mailto:abc@xyz.com?&subject=Your Subject&body=your%20mail%20content">Send Email</a> 

Answer 3

對於Twitter的，</html>前加入。

<script>window.twttr = (function(d, s, id) { 
    var js, fjs = d.getElementsByTagName(s)[0], 
    t = window.twttr || {}; 
    if (d.getElementById(id)) return t; 
    js = d.createElement(s); 
    js.id = id; 
    js.src = "https://platform.twitter.com/widgets.js"; 
    fjs.parentNode.insertBefore(js, fjs); 

    t._e = []; 
    t.ready = function(f) { 
    t._e.push(f); 
    }; 

    return t; 
}(document, "script", "twitter-wjs"));</script> 

對於Facebook，請在</html>之前加上。

<div id="fb-root"></div> 
<script>(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_US/sdk.js#xfbml=1&version=v2.3"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 
</script> 

主頁列表的HTML，每個項目都有它自己的Twitter和FB按鈕。每個引用特定的帖子頁面。

<ul> 
    <li> 
    <h3>Job #1</h3> 
    <div class="fb-share-button" data-href="https://example.com/post/1" 
     data-layout="button"></div> 
    <a href="https://twitter.com/share" class="twitter-share-button" 
     data-url="https://example.com/post/1">Tweet</a> 
    </li> 
    <li> 
    <h3>Job #2</h3> 
    <div class="fb-share-button" data-href="https://example.com/post/2" 
     data-layout="button"></div> 
    <a href="https://twitter.com/share" class="twitter-share-button" 
     data-url="https://example.com/post/2">Tweet</a> 
    </li> 
</ul> 

謝謝！