Documentation

Setup JSocialFeed

1. Install JSocialFeed from the Extension Manager

2. After a successfull install navigate to the Module Manager


3. Modify the JSocialFeed module or add a new JSocialFeed module



4. Configure the module and choose where to display JSocialFeed (module position). Remember to publish the module. If you don't know the possible module positions of your template you can follow the guide "Finding module positions on any given page" to find them.


5. Remember to double check the module assigment tab. The typical choice is to set the field "module assignement" to the value "on all pages".


Now JSocialFeed is active and published and you only need to configure the feeds to display choosing from: Google+, Twitter, Facebook, RSS/Atom feeds.

Google+ Setup

JSocialFeed can extract and show the news present on any Google+ public page. To do so It requires a Google+ API key.

To generate this API Key, just follow the steps below.

1. Point your browser to: https://code.google.com/apis/console/
2. If you are not logged in with a Google account, you need to login;
3. Press the button "Create project...";


4. Choose "APIs" link and enable "Google+ API" switching it ON;

5. Navigate to "Credentials -> Public API access" and choose "Create new Key"
6. Choose to create a new "Server Key" and press "Create";

7. Copy your key in the "Google Api Key" field of JSocialFeed configuration and save. Make sure you copy the entire Key.

8. Copy the User ID of all the Google+ profiles that you want to display with JSocialFeed. For example if you want to show the posts of https://plus.google.com/+Ferrari/posts you will need to enter +Ferrari in the "Google+ User Id" field of JSocialFeed.

Note: sometimes Google takes a few minutes to actually make active your new key.

Twitter Setup

JSocialFeed can extract and show tweets coming from any Twitter public account, to do so It simply needs a key and a secret provided by Twitter.

To generate this API Key and the corresponding secret, just follow the steps below.

1. Point your browser to: https://apps.twitter.com/
2. If you have not already done, login with your twitter account.
3. Press the button "Create new App"
4. Fill in the required fields and press "Create your twitter application"

5. Choose "Api Keys" tab and copy "API key" and "API secret" in JSocialFeed configuration. Make sure you copy entirely the key and the secret.

6. Copy the "Twitter User Name" of all the Twitter profiles that you want to display with JSocialFeed. For example if you want to show the tweets of https://twitter.com/ValeYellow46 you will need to enter ValeYellow46 in the "Twitter User Name" field of JSocialFeed.

RSS/Atom Setup

An RSS feed is one of the most popular format for distributing web content . Typically it is used in blogs to update readers about the presence of new post.

JSocialFeed can show the news published in an RSS or Atom feed.

The configuration is very simple, just indicate in the "RSS/Atom URL" field of JSocialFeed the url of the feed to show.

For example, if you want to show the news from the site http://www.fifa.com you can copy one of the RSS url reported on the page http://www.fifa.com/newscentre/rssfeeds/index.html like "Latest News Feed" http://www.fifa.com/rss/index.xml.

For some sites it is not always evident which is the RSS/Atom feed url. Fortunately it's simple to find it. Just view the page source and search for the rss or atom keyword to find immediately the searched feed url.

Take for example the site http://community.joomla.org/blogs/community.html

From the site it is not readily visible the url of the rss or atom feed.

To find it simply click with the right button and view the page source. Then search for the keyword "rss" or "atom" and here is the feed url:
http://community.joomla.org/blogs/community.feed?type=rss

Facebook Setup

To obtain an App Id and Secret from Facebook you need to follow the following steps.

Note: The personal Facebook account that you use to register as a developer does not need to be associated with the page or group whose posts you want to display.

1. First of all go to https://developers.facebook.com/ and Log In

2. Register yourself as a developer

3. Follow the registration steps

4. Create a new App

5. Choose the www platform

6. Fill in the form as you want

7. Click on the show button and take note of your App Id and Secret. These values ​​must be entered in the configuration of JSocialFeed.

8. To get the id of a facebook page you can use the Get Facebook Page Id Utility.

9. Finally now that you have the App Id, the App Secret and the Page Id you can enter them in the JSocialFeed configuration page..

Advanced parameters

Customize JSocialFeed appearance

If you want you can customize the appearance of JSocialFeed adding custom CSS style declarations.

You can find CSS class of each JSocialFeed element with a web developer tool like Chrome Developer Tools or Firebug.

Whitelist HTML Tags

JSocialFeed show news taken from various sources: Google+ , Twitter , RSS.

Before showing the contents of a source, It applies filters to remove all the HTML formatting elements superfluous that might affect the appearance of JSocialFeed. The only HTML tag that keeps are those indicated in the field "Whitelist HTML Tags".

If you want you can change this field to prevent JSocialFeed from filtering other HTML tags that you want to keep.