How to Add a Teamup Calendar to Your Facebook Page (Creating Your Own App)

Step 1: Have Your Calendar Link Ready

If you already have your Teamup Calendar and want to add it into your Facebook business page, have a read-only link ready. If you are brand new to Teamup, create a free calendar and populate it with your events.

For calendar administrators: To locate a read-only calendar link, go to Settings > Sharing.  Here you may find a pre-configured read-only link named Reader (or create a new link and assign the read-only permission to it). Right-click the ‘Reader’ link, and ‘copy link address’.

Check out here if you want another permission such as add-only or share only events of selected sub-calendars. Be sure NOT to copy an administrator link. It is not recommended to use any link with modifying permission.

Step 2: Log In to Facebook as a Facebook Developer

Go to https://developers.facebook.com/apps. You’ll be able to log in with your normal Facebook credentials.

Step 3: Create and Name Your New Tab

Click the button “Add a New App“:

Add a new app to Facebook

Fill in the Create New App ID screen:

Create App iD

Step 4: Configure Your Facebook Page Tab

1)  Once you have created your App ID, you’re in your App Dashboard. Go to Settings, then locate and click “+ Add Platform” at the bottom.

Configure your app

2) When prompted, select ‘Page Tab‘ as your platform:

Add page tab

3) Next, add your calendar link you obtained in Step 1 and give your page tab a name, e.g. Calendar.

Add page tab URL

Tip 1: You can append a link parameter to force the calendar to be displayed in a view that is different from the default view in your calendar Settings.  For example, if your default view is set to the Month view, and you want to display the same calendar in the Agenda view, you can append ?view=a to the end of your read-only calendar link in this step. Learn more about using link parameters.

Tip 2: Leave App Icon blank. Otherwise your app may not work for unknown reasons.

4)
When you’re done editing the contents of this section, click the ‘Save Changes‘ button at the bottom right.

Step 5: Make Your App Public

Make app public

Turn the switch to Yes and confirm when prompted.

Step 6: Add Your New Custom Tab to Your Facebook Page

Visit this link: http://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&next=YOUR_URL

1) Replace YOUR_APP_ID and YOUR_URL with the ‘App ID‘ found in the basic settings for your app as shown on the screen in Step 4.

2) Replace YOUR_URL with your calendar link that you have ready in Step 1 and entered in Step 4 as the Secure Page Tab URL.

Here is an example:

http://www.facebook.com/dialog/pagetab?app_id=675794799212429&next=https://teamup.com/ks8b77f814186a2ec0

Now open the link in your browswer. You will be asked to choose the page you want to add the tab:

add to your page

Choose your page and click Add Page Tab. Now you should see a new tab “Calendar” (or whatever Tab Name you gave in Step 4) in the bottom of your tabs list on the left panel.

Step 7: Rearrange the tabs and bring it up to the top

Of course you don’t want to leave your Calendar tab in the bottom of your tabs.  To move it up:

1) Go to Setting in the top right.

2) On the Settings page, click Edit Page on the left panel.

3) Look for the Home section, scroll down the tabs and locate the Calendar tab, and drag it up to where you want it to be.

Done. Now you can keep updating your calendar and promote it to your fans.

Bonus: Options to Promote the Events on Your Calendar Tab

  • Share your calendar tab URL in your page timeline or elsewhere. It takes the format https://www.facebook.com/YOUR_PAGE_NAME/app/YOUR_APP_ID/
  • Click an event to view the event, or right-click an event on your calendar to open the context menu, then click Share.  Now you choose any of the options to share further or save the event to your personal calendar:

    event context menu

    Event context menu: Options for sharing

Rate This Article

(4 out of 4 people found this article helpful)