Enable Facebook Open Graph and Twitter Card

Enable Facebook Open Graph and Twitter Card


1. Enable Open Graph Tags to Share your Content on Facebook



Basically, Open Graph is some tags created by Facebook to describe your content pages.
Those tags improve the display of your content on Facebook platform.

a/ Enable Open Graph tags on your back office:
Go to the bottom left menu Settings > App Settings > External connections
Enable the blue button.

b/ Set up your Facebook App:
  1. If you have already set the login with Facebook for your app you don't need to do anything.
  2. If you haven't set the login with Facebook for your app, please follow the process described in our online helps as it is exactly the same for the Open Graph, you can retrieve the information needed in the menu Settings > App Settings > External connections  if you haven't enabled the users add-on:
Facebook Authentication - 1/2 | Register as a Facebook developer
Facebook Authentication - 2/2 | Set up the login with Facebook

Once you have created your Facebook app,  copy and paste your Facebook App ID in the appropriate field in the menu Settings > App Settings > External connections of your back office and click OK.

You can now rebuild your app (click here  for the online help iOS, here for the online help Android).
 

2. Enable Twitter Card

Like the Facebook Open Graph, Twitter card allows you to improve the display of your content on their platform.
Muse mBaaS implemented the Summary Large Image, meaning that when sharing your content on Twitter, Twitter will be able to display the title of the content, its picture and its summary or the first 200 characters of the first paragraph.

a / Enable Twitter card on your back office
Go to the bottom left menu Settings > App Settings > External connections
Enable the blue button.


Warning: Don't forget to update your modifications in the menu Publish > Select the platform > Update of your backend.

You can run a URL of your app through the Twitter validator tool  to test once you've updated your app. After testing in the validator, Tweet the URL and see the Card appear below your Tweet in the details view.

    • Related Articles

    • Share Content from the App

      1. Activate Sharing To allow your users to share content from a section of your application, activate the share icon on the corresponding section: 1. Go to the left menu Design & Structure > Design > Sections Design (in our example, a Blog section) ...

    • Loyalty Card Extension (Full Plans Only)

      The Loyalty Card extension allows you to integrate a loyalty card into your app. It is a point system. The card is fully customizable. Your clients will earn gifts, a great incentive to encourage them to visit your establishment more often. This ...

    • Promote the App

      Muse mBaaS offers several tools to help you promote your application and increase the number of downloads in the stores. When your app is published in the stores, you can use five different tools that will allow you to share the app on social ...

    • Facebook

      You can connect your social network to your app. To do so, you can add a Facebook section to your app. The Facebook section works as described below depending on the platforms included in your offer:  PWA: it will open your Facebook page's Url under ...

    • Twitter

      Add a Twitter section in your application or set up authentication using your Twitter account* *only if you have activated the Authentication extension 1. Create a Twitter Developer Account 1. Go to https://developer.twitter.com/ and click "Sign up" ...