Facebook API

Facebook API can be used to build non-automated, authentic, high-quality demonstrative blocks.

How to use?

Include these metatags right before <head> tag is closed.

              
                <head>
                  <meta property="og:url" content="http://localhost:8080">
                  <meta property="og:type" content="website">
                  <meta property="og:title" content="Blueberry">
                  <meta property="og:description" content="Your description">
                </head>

Include this script right after open <body> tag.

              
                <body>
                  <script>
                    window.fbAsyncInit = function () {
                      FB.init({
                        appId: '211814435920978',
                        xfbml: true,
                        version: 'v2.8'
                      });
                    };

                    (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";
                      fjs.parentNode.insertBefore(js, fjs);
                    }(document, 'script', 'facebook-jssdk'));
                  </script>
                </body>

Page

Preview
HTML

Blueberry UI

                    
                      <div class="fb-page"
                           data-href="https://www.facebook.com/blueberryui"
                           data-tabs="timeline"
                           data-width="500"
                           data-height="500">
                        <blockquote cite="https://www.facebook.com/blueberryui" class="fb-xfbml-parse-ignore">
                          <a href="https://www.facebook.com/">Blueberry UI</a>
                        </blockquote>
                      </div>

Comments

Preview
HTML

                    
                      <div class="fb-comments"
                         data-href="https://web.facebook.com/nasimnimu007/posts/2948769028555680?comment_id=2950171745082075"
                         data-numposts="2"
                         data-width="100%"></div>

Post

Preview
HTML

                    
                      <div class="fb-post"
                          data-href="https://web.facebook.com/blueberryui/posts/104733944658010"></div>

Video

Preview
HTML

How to Share With Just Friends
How to share with just friends.
Posted by Blueberry UI on Sunday, 19 July 2020

                    
                      <div class="fb-video"
                           data-href="https://web.facebook.com/blueberryui/posts/104733944658010"
                           data-width="500"
                           data-show-text="false">
                        <blockquote cite="https://web.facebook.com/blueberryui/posts/104733944658010" class="fb-xfbml-parse-ignore">
                          <a href="https://web.facebook.com/blueberryui/posts/104733944658010">How to Share With Just Friends</a>
                          <p>How to share with just friends.</p>Posted by
                          <a href="https://www.facebook.com/blueberryui/">Blueberry UI</a>
                          on Sunday, 19 July 2020
                        </blockquote>
                      </div>

                    
                      <div class="fb-like"></div>

Share

Preview
HTML

                    
                      <div class="fb-share-button"
                           data-href="https://developers.facebook.com/docs/plugins/"
                           data-layout="button_count"
                           data-size="small"
                           data-mobile-iframe="true">
                        <a class="fb-xfbml-parse-ignore" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&src=sdkpreparse">Share</a>
                      </div>