Multiple Facebook, Twitter share buttons in one page with custom image and title -

I am creating a blog where the landing page will show 5 latest posts by default and each post will have a Facebook and Twitter Share Share Button on

I'll need every heading button so that they have a default title, description, and image attached, and I am using an open graph to add data.

The problem is how do I include multiple open graph data for each share button I have heard that there is a way to use IRRM and the second way is to pass the data in the share URL.

This is what I did.

This code is for Twitter. Added once to the main HTML section:

  & lt; Script & gt; Window.twttr = (function (D, S, ID) {var js, fjs = d.getElementsByTagName (s) [0], T = window.twttr || {}; if (d.getElementById (id)) Returns T ; JS = D. Element (s); js.id = id; js.src = "https: //platform.twitter com / widgets.js"; fjs.parentNode.insertBefore (JS, FJS); t _e = [], T. RD = function (f) {taeuuse (f);}} return t;} (document, "script", "twitter-vj")); & Lt; / Script & gt;  

This code is for Facebook's body added once on top of the HTML section.

  & 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)) returns; js = d.cent element (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')); & Lt; / Script & gt;  

For the homepage list with each item, HTML has its own Twitter and FB buttons, each refers to a specific post page.

  & lt; Ul & gt; & Lt; Li & gt; & Lt; H3 & gt; Post # 1 & lt; / H3 & gt; & Lt; Div class = "fb-share-button" data-href = "https://example.com/post/1" data-layout = "button" & gt; & Lt; / Div & gt; & Lt; A href = "https://twitter.com/share" class = "twitter-share-button" data-url = "https://example.com/post/1" & gt; Tweet & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; H3 & gt; Post # 2 & lt; / H3 & gt; & Lt; Div class = "fb-share-button" data-href = "https://example.com/post/2" data-layout = "button" & gt; & Lt; / Div & gt; & Lt; A href = "https://twitter.com/share" class = "twitter-share-button" data-url = "https://example.com/post/2" & gt; Tweet & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;