Get Facebook Page Id
Note: The facebook page must be public.
- Setup JSocialFeed
- Google+ Setup
- Twitter Setup
- RSS/Atom Setup
- Facebook Setup
- Advanced parameters
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.
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.
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.
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:
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..
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.
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.
This page shows some examples of using the Joomla! module JSocialFeed that displays a slider with the latest news, posts and tweets taken from Google+, Twitter, Facebook and RSS/Atom feeds.
Vertical Scroll - RSS/Atom Feed
Horizontal Scroll - Ease In/Out Elastic - Google+ F1 team
Fade - Twitter MotoGP Riders
Multiple - RSS/Atom, Google+, Twitter
JSocialFeed is a Joomla! module that displays a slider with the latest news, posts and tweets taken from Google+, Twitter, Facebook and RSS/Atom feeds.
- Google+, Twitter, Facebook and RSS/Atom feeds support;
- Displaying multiple feeds at the same time;
- Deferred load of feed in order to speed up website loading;
- Data cache for faster loading and reduce the demands on Google+,Twitter and RSS/Atom feeds;
- Server side connection with Google+, Twitter, Facebook and RSS/Atom feed in order to protect API Key and Secret exchange;
- Fully responsive - will adapt to any device;
- Horizontal slides, vertical slides, and fade effect modes;
- Advanced touch / swipe support built-in;
- Uses CSS transitions for slide animation (native hardware acceleration!);
- Browser support: Firefox, Chrome, Safari, iOS, Android, IE7.
- Uses bxSlider;
- Highly customizable with CSS;
- Integrated with Joomla update system;
- Joomla! 2.5 or Joomla! 3
- PHP 5.3 or higher
JSocialFeed is free software released under the GNU General Public License.
JSocialFeed is developed by Garda Informatica.
If you find JSocialFeed useful, please consider donating. Your contribution will help cover the costs of developing, distributing and supporting of JSocialFeed.
- v1.5.4: 28 Dec 2015
- Updated Facebook graph api v2.5 to solve the error message: Facebook Page:NNNNNNNNNN: no link;
- Added complete Spanish language thanks to Salomón Casal;
- v1.5.3: 29 Jun 2015
- Facebook feed update;
- v1.5.2: 28 Feb 2015
- Bug fix escaping RSS title on Joomla 2.5;
- Fixed User Agent for Facebook graph api v2.2 feed;
- v1.5.0: 31 Jan 2015
- Added support to Facebook graph api v2.2 feed;
- 28 Jan 2015
- Facebook removed the support to Facebook RSS feeds;
- v1.4.2: 9 Dec 2014
- Fixed problem with Facebook's titles;
- v1.4.0: 7 Nov 2014
- Added the ability to specify the channel (title and link) of RSS/Atom feed;
- Added the ability to specify the size of the thumbnails of the RSS/Atom feed;
- v1.3.0: 24 Sept 2014
- Added the ability to choose the feed news ordering;
- Added support to the Joomla SEO sh404SEF extension;
- Added "Whitelist HTML Tags" advanced parameter;
- Fixed a bug that caused the delay in the display of the first news;
- v1.2.0: 5 Sept 2014
- Added Facebook RSS Feeds Support
- v1.1.1: 1 Sept 2014
- v1.1.0: 16 Aug 2014
- Added the ability to customize the appearance using "Custom CSS" advanced parameter;
- Added the ability to hide news: title, body, thumb, date, number of likes, reshares and comments;
- Added support for Joomla update system;
- v1.0.0: 6 June 2014
- First Release