Full documentation

Transcription

Full documentation
2014
SlideshowFx Content Plug-in for Joomla !
Joël VALLIER / www.OopsTouch.com
SlideshowFx content plug-in is aimed to display photo
galleries and albums inside Joomla articles. This
document is the user guide giving all instructions for
installation and connection to Google+, Flickr,
Facebook and Instagram photo sharing.
Site: www.oopstouch.com
Email: [email protected]
Phone: +33 6 17 19 27 06
SIREN: 539 930 677
I. Summary
I.
Summary ........................................................................................................................................ 1
II.
Quick Start Guide ............................................................................................................................ 3
III. General Presentation ...................................................................................................................... 7
IV. SlideshowFx installation ................................................................................................................. 9
V.
Display Galleries as standard Menu .............................................................................................. 10
VI. Display Galleries inside Modules .................................................................................................. 12
VII. Insert Galleries / Albums in articles .............................................................................................. 13
1.
Insert default gallery in article .................................................................................................. 14
2.
Use of inline URL or RSS links inside article .............................................................................. 14
3.
Use of inline user ID inside Joomla article ................................................................................ 16
4.
Use of Flickr collections ............................................................................................................ 16
5.
Use of Flickr galleries ................................................................................................................ 16
6.
Use of hashtags ........................................................................................................................ 17
VIII. Widgetkit integration ................................................................................................................... 18
1.
Installation................................................................................................................................ 18
2.
Configure Slideshow Widgetkit content provider ..................................................................... 18
3.
SlideshowFx content provider parameters ............................................................................... 19
4.
How to display a gallery............................................................................................................ 19
5.
Widgetkit settings for display of galleries ................................................................................. 20
IX. Display Galleries in Kunena forum ................................................................................................ 21
X.
Background music ........................................................................................................................ 22
XI. APIs configuration ........................................................................................................................ 23
1.
Google+/Picasa API configuration ............................................................................................ 23
2.
Flickr API configuration............................................................................................................. 27
3.
Facebook API configuration ...................................................................................................... 32
4.
Instagram API configuration ..................................................................................................... 36
5.
Piwigo API configuration .......................................................................................................... 40
6.
OneDrive API configuration ...................................................................................................... 41
7.
SlideshowFx API configuration ................................................................................................. 43
XII. SlideshowFx parameters ............................................................................................................... 45
1.
Filters ........................................................................................................................................ 45
2.
Gallery settings ......................................................................................................................... 46
SlideshowFx User Guide
Page 1
3.
Album settings .......................................................................................................................... 47
4.
Slideshow settings .................................................................................................................... 48
5.
Slider ........................................................................................................................................ 49
6.
Video settings ........................................................................................................................... 50
7.
Geolocation .............................................................................................................................. 50
8.
Rating settings .......................................................................................................................... 51
9.
ShareThis settings ..................................................................................................................... 52
10.
Global settings ...................................................................................................................... 53
11.
Translations settings ............................................................................................................. 53
12.
Advanced settings ................................................................................................................ 54
13.
CSS Layout settings ............................................................................................................... 55
XIII. Advanced inline parameters ......................................................................................................... 56
XIV. References .................................................................................................................................... 57
1.
SlideshowFx related links ......................................................................................................... 57
2.
Google+ related links ................................................................................................................ 58
3.
Flickr related links ..................................................................................................................... 58
4.
Facebook related links .............................................................................................................. 58
5.
Instagram related links ............................................................................................................. 58
6.
Piwigo related links .................................................................................................................. 59
7.
Other links ................................................................................................................................ 59
8.
Credits ...................................................................................................................................... 59
XV. Annexes ........................................................................................................................................ 60
1.
Gallery and album Layout ......................................................................................................... 60
2.
Feature list................................................................................................................................ 63
3.
Software upgrade from Trial to Pro version ............................................................................. 65
4.
Software upgrade from a very old version ............................................................................... 66
XVI. History .......................................................................................................................................... 67
SlideshowFx User Guide
Page 2
II. Quick Start Guide
SlideshowFx is a package of extensions aimed to display photo and video galleries, with
some additional features, inside Joomla! websites. Photos can be stored locally on your
server or on a remote Google+, YouTube, Picasa, Flickr, Facebook or Instagram server.
The final rendering is the same whatever the underlined platform.
Below some screenshots and a quick start guide.
1.
Figure 1: SlideshowFx photo gallery with votes and ShareThis options enabled
Figure 2: Included photo/video slideshow with support of rating and geolocation
Check our website www.OopsTouch.com for live demo and video!
SlideshowFx User Guide
Page 3
Figure 3: A simple slider can be displayed in menu, module or article
Requirements
1. Local photos or a Google+, Flickr, Facebook or Instagram user account with photos or videos
uploaded (Picasa photos or YouTube videos can be displayed using your Google+ account)
2. A Joomla! website version 2.5 or higher
3. SlideshowFx Trial or Pro package
4. and… 5 minutes of your time ;-)
Install SlideshowFx Package
1. Install SlideshowFx Trial/Pro package as any other extension
Upload your photos on your local server if you want to display local albums (Optional)
1.
2.
3.
4.
Create folder /images/slideshowfx/default used to store default user albums
Upload your albums inside /images/slideshowfx/default (create one folder per album)
(Use only jpeg photos with JPG extension / 1800 pixels is the recommended photo size)
Use SlideshowFx as platform or API parameter in next sections to display local photos
Important note: Display of local photos with Trial version works only on public websites.
SlideshowFx User Guide
Page 4
Configure your Google+, Flickr, Facebook or Instagram user account (optional)
1. Open menu Components  SlideshowFx Gallery
2. Open User accounts tab
2. Click on one of the Demo buttons proposed for Google+, Flickr, Facebook, Instagram
(Button displayed on the right / Google+ account is used for display of YouTube videos)
3. Sign-in to your Google+, Flickr, Facebook, Instagram user account
4. Grant access to your albums and photos
5. Confirm and Save SlideshowFx parameters
Create your first menu
Open Menus  Menus Manager
Select a menu from the list
Create a New menu item
Fill in Menu Title
Select SlideshowFx  Gallery and albums as Menu Item Type
Select Google+, Flickr, Facebook, Instagram, YouTube from the Platform drop down list
Select an All, Public albums or any album name from the Album drop down list
(Google+, Flickr, Facebook, YouTube only)
8. Save parameters
1.
2.
3.
4.
5.
6.
7.
9. Click on
button to open the newly created gallery
Create your first module
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
Open a Extensions  Module Manager
Create a New module
Select SlideshowFx Module
Fill in Title
Select the appropriated Position
From Menu Assignment select Module Assignment page(s)
Select Google+, Flickr, Facebook, Instagram, YouTube from the Platform drop down list
Select an All, Public albums or any album name from the Album drop down list
Ensure that module is Published
Save parameters
Check result on frontend page
Insert your first gallery in article
1. Create or Edit a new article from menu Content  Article Manager
2. Insert in article {sfx api=’x’} with x set to one of the appropriated platform
(picasa, flickr, facebook, instagram or youtube)
3. Save article
4. Create a new menu to display this article
5. Check result on frontend page
SlideshowFx User Guide
Page 5
Create your own Web App!
Demo mode is based on OopTouch web Apps and is valid for few days. To display Picasa, Google+,
Flickr, Facebook, Instagram or YouTube albums with Pro version, you have to create your own Web
App. This step is a bit more complicated depending on platform used. Refer to our SlideshowFx User
Guide for full details on how to proceed.
Install SlideshowFx Professional Edition
SlideshowFx Trial relies on OopsTouch server for web page rendering and is valid for few days. To
continue with SlideshowFx download the Professional Edition. SlideshowFx Pro can be installed on
top of the Trial version.
However, there are some points to take care (no need for display of local albums):

You have to create your own Google+, Flickr, Facebook or Instagram App, else Pro version
will continue to work as Trial version.

You have to reset all SlideshowFx API settings (Click on X button) in SlideshowFx menus and
modules if they have been created before upgrade to Pro version, else menus and modules
will continue to run in Trial mode.
Your Joomla! and browser cache must be cleared after install in order to ensure that page
displayed is the new one created by your website.

If you use SlideshowFx Pro, please post a rating and a review at Joomla! Extensions Directory.
Conditons
SlideshowFx Pro payment includes a copy of SlideshowFx package, 1 year software upgrade and
support (see our terms and conditons for details).
You will receive the SlideshowFx package by email usually few minutes after your Paypal payment.
Else you can get it from the menu My Account  My Products (after login).
If our product fails to work as advertized and we are unable to make it work, we will grant you a full
refund within 30 days of the purchase.
Useful links
Full SlideshowFx documentation:
http://www.oopstouch.com/documentation/slideshowfx/plugin
Download and Purchase:
http://www.oopstouch.com/download/slideshowfx/plugin
Our support forum for any technical question, issue report or suggestion:
http://www.oopstouch.com/support
Contact form for non related technical questions:
http://www.oopstouch.com/contact
SlideshowFx User Guide
Page 6
III. General Presentation
SlideshowFx will provide all what you need, and probably all what you can imagine, to display Picasa,
Google+, Flickr, Facebook and Instagram web albums or YouTube videos into your Joomla! website.
Easy to install and configure, you just need to create a SlideshowFx Menu, Module or an article with
tag {sfx} inside, SlideshowFx will do the rest (see screenshot below).
Figure 4: SlideshowFx photo gallery with votes and ShareThis options activated
There are many options allowing you to display only one or a set of albums or photos. Additional
information, like date, album name, photo caption, access right can be displayed along with
thumbnail or photo slideshow.
Albums and photos can be sorted by published/created date or name.
SlideshowFx allows visitors (all or only registered visitors) to vote for your photos or albums. Then
photos and albums can be sorted by rating (Important: Joomla! cache mut be disabled).
SlideshowFx is provided with a nice slideshow script. Except a list of small buttons on top of your
screen (photo next/previous, first/last, maximize/minimize, download, close, slideshow play/pause,
timer) the rest of the screen is dedicated to your photos!!! Whatever the size of your screen, and
whatever the size of your photo, SlideshowFx will automatically adapt photo dimension in order to
provide the better quality. This will improve user experience.
You need to increase performances?
No problem, an internal cache mechanism reduces drastically the access to Google+, Flickr,
Facebook, Instagram and YouTube API, reducing processing time by several seconds!!! You don't
believe me? Then activate the profiling option. This will insert profiling information in HTML page
(not visible by visitors).
SlideshowFx User Guide
Page 7
Figure 5: Slideshow
You want to display albums coming from several Google+/Picasa, Flickr, Facebook or Instagram user
accounts?
You can activate the 'merge' option and insert several {sfx …} tags in your article. SlideshowFx will get
all albums information and will merge all together to provide a unique gallery on your web site. This
feature is typically used by associations and clubs where each one can contribute to the photo
gallery!!!
You have to display large albums (more than 500 photos)?
No, problem, a parameter in SlideshowFx allows you to increase the PHP PCRE limit. An optional
scrollbar can be activated to facilitate album browsing.
You can propose visitors (all or only registered users) to download your pictures in a limited or full
resolution format (original file resolution uploaded). You can also block photo download, making
photo download not impossible but much more complicated.
You want to keep your Google+/Picasa or Flickr album private and provide access only through your
Joomla! web site?
No, problem, SlideshowFx comes along with a PHP script allowing getting a Picasa/Flickr token. This
token is used to get access to private albums. Then the access to private albums from your web site
can be restricted, or not, to registered users.
If you use SlideshowFx plug-in, please post a rating and a review at Joomla! Extensions Directory.
SlideshowFx User Guide
Page 8
IV. SlideshowFx installation
SlideshowFx package includes SlideshowFx content plug-in as well as SlideshowFx menu and module
extensions. It can be installed on your Joomla website like any other Joomla extension from backend
site, menu Extensions > Extension manager. The plug-in will be automatically activated.
SlideshowFx 6.x packages can be installed on top of previous SlideshowFx 5.x content plug-in.
However, it is strongly recommended to test version 6.x on development website before any
deployment on production website.
When the installation does not work this way you may try to install the SlideshowFx manually:





Download SlideshowFx and unzip package to a directory on your PC.
Using FTP, upload this directory to the Joomal root directory /tmp on your server.
Go to the extensions installer in the Joomla administration, use the "Install from Directory".
Set the directory of your uploaded SlideshowFx files.
Click on the Install button and Joomla will install it from the given directory.
After package installation or update, it is strongly recommended, like any other extension, to edit
extension parameters and save parameters (even though no change occurred). By this way, new
parameters introduced will take their default values.
After installation, you can create a SlideshowFx Menu, Module or edit an article and insert {sfx}
inside. Joomla! will display the default OopsTouch gallery in front-end. You can also configure your
own user account from menu “Components / Slideshow Gallery” and click on Google+, Flickr,
Facebook or Instagram “Demo” button in section “User Accounts”.
This basic test allows you to check the compatibility of the extension with your website environment
(PHP version and extensions, Joomla template end extensions). In case of problem, please, contact
our support at www.oopstouch.com.
Here is a flash animation showing plug-in installation and basic configuration with Google+ account.
Next sections describe how to create your own App and configure SlideshowFx API parameters:




Google+/Picasa API configuration (required for display of YouTube videos)
Flickr API configuration
Facebook API configuration
Instagram API configuration
A specific section describe various parameters available in SlideshowFx content plug-in




Filters
Gallery, Album, Slideshow settings
Rating, ShareThis settings
Global settings, Translations, Advanced settings and CSS Layout settings
Last section gives links to some references.
SlideshowFx User Guide
Page 9
V. Display Galleries as standard Menu
This section assumes that you have already configured your own Google+/Picasa, Flickr, Facebook or
Instagram user account in simple demo mode (see section SlideshowFx installation) or normal mode
(see sections APIs configuration
Google+/Picasa API configuration, Flickr API configuration, Facebook API configuration, Instagram API
configuration).
From Joomla! “Menu Manager”, click on “New” or “Add New Menu Item”. Select item “SlideshowFx
Gallery” / “Gallery and Albums” in “Menu Item Type”.
Figure 6: SlideshowFx menu parameters
Select one of the platforms proposed (Google+, Flickr, Facebook, Instagram or YouTube) in
parameter “Platform”.
Parameter “Username” will be automatically updated with the default user account configured in
SlideshowFx plug-in. If this field is empty, SlideshowFx will display default OopsTouch user account.
At any time you can click on button
to reset menu configuration to your default user account
defined in SlideshowFx plug-in parameters.
Button
can be used to link the menu to a different user account. In this case process is similar to
the one used to configure the default user account in SlideshowFx plug-in (redirection to Google+,
Flickr, Facebook or Instagram and grant access).
Button
can be used to display all API parameters (App Key, Secret, username, user ID, Token,
Server) and so copy/past these parameters to a different SlideshowFx Menu, Module or inside
SlideshowFx plug-in parameters.
SlideshowFx User Guide
Page 10
Figure 7: SlideshowFx expanded menu parameters
App Key and App Secret with value “*” or Server set to “https:://www.oopstouch.com/trial” means
that you are using OopsTouch demo App. In SlideshowFx plug-in parameters, set App Key and App
Secret to your own App (see next sections) and clear parameter Server to switch to normal mode.
Click on the
button to reset menu to default plug-in parameters.
Important note:
You should never use button
(and go through the grant process) to link your menu to your
default user account. Copy/Past parameters to a different menu if they need to be linked to the same
user account.
Button
gives a direct access to plug-in configuration. Display layout of galleries, albums and
slideshow can be configured through the centralized plug-in parameters.
Button
gives a direct access to your Google+, Flickr, Facebook and Instagram user account.
As soon as menu is configured and parameters saved, the button
associated front page.
will give you access to the
The “Album” drop down list allows you to display all albums, only public albums or a selected album
(this option doesn’t exist in Instagram).
If you switch to expert mode (clisk on expand button ), parameter “Album URL” allows to select
album (or gallery) based on its URL. “Hashtag” allows you to display a list of Google+/Picasa, Flickr or
Instagram photos/videos based on their hashtag.
SlideshowFx User Guide
Page 11
VI. Display Galleries inside Modules
Creation and configuration of SlideshowFx module is similar to menu creation (see previous section).
Figure 8: SlideshowFx module parameters
Module proposes additional parameters in tab “Layout” and “CSS”:
 Force module width
 Thumbnail per row
 Rows per page
 Navigation links
 Rating mode
 Thumbnail sorted by
 CSS code
Ensure that module is published, parameter “Position” and “Menu Assignment” are set to the
appropriate values else nothing will be displayed.
Important note:
You should never use button
(and go through the grant process) to link your menu to your
default user account. Copy/Past parameters to a different menu if they need to be linked to the same
user account.
See section “Display Gallery as standard menu” for a full description of various top left buttons.
SlideshowFx User Guide
Page 12
VII. Insert Galleries / Albums in articles
SlideshowFx Package includes Editor Button aimed to insert any SlideshowFx gallery inside your
article.
To insert your gallery, put cursor in article text area and click on “SlideshowFx Gallery” button below
text area. This will open a pop-up to configure your gallery.
Select the Platform (Google+, Flickr, FaceBook, Instagram, YouTube or SlideshowFx). A list of default
user’s albums is then displayed. Select one of the albums, all albums or only public albums. Select the
Display mode (Gallery, Slider or Slideshow). Depending on this selection, addition tabs will be
displayed allowing you to configure the display layout.
Figure 9: SlideshowFx button in article editor
Once you completed the gallery configuration, click on “Insert code” button. This will insert a {sfx …}
line in your article. This line will be replaced by the gallery when article is displayed from front-end.
At any time you can change the gallery configuration by putting cursor inside {sfx …} syntax and
clicking on “SlideshowFx Gallery” button.
By default, SlideshowFx button is disabled when article is edited from front end. You can activate it
from SlideshowFx Editors plugin by setting parameter “Display in front end” to “Yes”.
Next sections describe how to manually insert SlideshowFx galleries without use of the editor button.
See section “Display Gallery as standard menu” for a full description of various top left buttons.
SlideshowFx User Guide
Page 13
1. Insert default gallery in article
To insert the default gallery in a Joomla article, just create an article and insert below line:

{sfx}
The default gallery is a gallery linked to the Google+, Flickr, Facebook or Instagram username
configured in SlideshowFx parameters (see next section for details on API configurations).
If you have several API mode configured in SlideshowFx plug-in, then you can add the inline option
“api” to force the API mode.






Google+/Picasa:
Flickr:
Facebook:
Instagram:
YouTube:
Local albums:
{sfx api=’picasa’} or {sfx api=’google+’}
{sfx api=’flickr’}
{sfx api=’facebook’}
{sfx api=’instagram’}
{sfx api=’youtube’}
{sfx api=’slideshowfx’}
Note:
 Do not use double-quotes inside the brackets {sfx ...}.
2. Use of inline URL or RSS links inside article
SlideshowFX can display a gallery or a single album (SlideshowFx Pro only) based gallery or album
URL. Below some basic syntax:




Gallery/Album:
Slider:
Album Thumbnail:
Album Slideshow:
{sfx url='<Gallery or Album Link>'}
{sfx display='slider' url='< Gallery or Album Link>'}
{sfx display='album-thumbnail' url='<Album Link>'}
{sfx display='slideshow' url='<Album Link>'}
Where:


<Gallery Link> can be URL to a Google+, Facebook, Instagram gallery or YouTube playlists.
<Album Link> can be URL to a Google+, Facebook, Instagram album or YouTube playlist.
Direct link to YouTube video is also supported. In this case, SlideshowFx will display video thumbnail
and click on this thumbnail will start video in slideshow.
RSS link toward Picasa or Flickr galleries and albums are also accepted but no more proposed in last
Picasa (migration toward Google+) and Flickr interfaces (remove since may 2013 with new Flickr
offer).
SlideshowFx User Guide
Page 14
Notes:
 It is strongly recommended to switch Joomla article editor into source mode in order to
avoid any HTML tags inserted in {sfx …}
 For the same reason, it is recommended to check article content in source mode after saving
(some article editors can change article content with extra HTML tag during save process)
Some example of URL:





















Google+ Gallery:
https://plus.google.com/photos/.../albums?hl=en
Google+ Album:
https://plus.google.com/photos/.../albums/...?hl=en
RSS Picasa Gallery:
https://picasaweb.google.com/data/feed/base/user/...
RSS Picasa Album:
https://picasaweb.google.com/data/feed/base/user/.../albumid/...
Flickr Gallery:
https://www.flickr.com/photos/.../sets/
Flickr Album:
https://www.flickr.com/photos/.../sets/.../
Flickr Collections:
https://www.flickr.com/photos/.../collections/
Flickr Collection:
https://www.flickr.com/photos/frizouilles/collections/.../
Flickr Public Galleries: https://www.flickr.com/photos/flickr/galleries/
Flickr Public Gallery: https://www.flickr.com/photos/flickr/galleries/.../
Facebook Gallery:
https://www.facebook.com/.../photos
Facebook Album:
https://www.facebook.com/.../media_set?set=...&type=...
Facebook Page Gallery: https://www.facebook.com/pages/.../...?sk=photos_stream&tab=...
Facebook Page Album: https://www.facebook.com/media/set/?set=...&type=...
Instagram Album:
http://instagram.com/...
YouTube Playlists:
https://www.youtube.com/user/.../playlists
YouTube Playlist:
https://www.youtube.com/playlist?list=...
YouTube video:
https://www.youtube.com/watch?v=...&list=...
YouTube video:
https://www.youtube.com/watch?v=...
Piwigo gallery:
http://piwigo.org/demo/ws.php (or any Piwigo web service URL)
Piwigo album:
http://piwigo.org/demo/index.php?/category/America (for instance)
Inline URL option can be used to display several user accounts inside a same website, including the
display of private albums. Below the syntax:

{sfx url=’URL’ token=’TOKEN’}
Where:


URL:
Google+, Flickr, Facebook, Instagram url as defined above
TOKEN: Token associated to the user account (not required for Piwigo servers)
The option URL is not proposed for Instagram albums and deprecated on Flickr (see next option for
alternative solution).
Notes:
 You can get USER and TOKEN from SlideshowFx plug-in settings (see links click to get token).
 When token value is in-lined in article, the token field in SlideshowFx plug-in parameters
must be empty.
SlideshowFx User Guide
Page 15
3. Use of inline user ID inside Joomla article
The inline “user” option can be used to display several user accounts inside a same website, including
the display of private albums. Below the syntax:

{sfx api=’API’ user=’USER’ token=’TOKEN’}
Where:



API:
The API mode (picasa, flickr, facebook or instagram)
USER: Google+, Flickr, Facebook, Instagram user ID
TOKEN: Token associated to the user account
Notes:
 You can get USER and TOKEN from SlideshowFx plug-in settings (see links click to get token).
 In some cases USER includes a “@” character. This character must be replaced by “[at]”
inside the article.
 When token value is in-lined in article, the token field in SlideshowFx plug-in parameters
must be empty.
 Read section XIII (Advanced inline parameters) for details about inline parameters allowed.
4. Use of Flickr collections
Support of Flickr collections has been introduced in SlideshowFx version 5.20. Collections are a set of
albums or collections (exclusive). This nice feature allows you to create several galleries grouping
albums per theme.
To turn on collection, use the below syntax in your article:

{sfx api=’flickr’ album=’collections’}
Inline option "album" can be also a Flickr collection ID, something like xxxxxxxx-xxxxxxxxxxxxxxxxx.
To get the collection ID, create an article to browse your collections (using syntax above), browse
your collections to reach the one you want to display and get collection ID from the URL parameter
"albid".
Change your article to:

{sfx api="flickr" album="xxxxxxxx-xxxxxxxxxxxxxxxxx"}
Another solution is to use inline url parameter (see section dedicated to URL parameter).
5. Use of Flickr galleries
Support of Flickr galleries has been introduced in SlideshowFx version 6.06.00. Galleries are a set of
own user or any public photos. This nice feature allows you to create several albums grouping photos
per theme.
To turn on gallery, use the below syntax in your article:

{sfx api=’flickr’ album=’galleries’}
SlideshowFx User Guide
Page 16
Inline option “album” can be also a Flickr gallery ID (something like xxxxxxxx-xxxxxxxxxxxxxxxxx).
To get the gallery ID, create an article to browse your galleries (using syntax above), browse your
galleries to reach the one you want to display and get gallery ID from the URL parameter “albid”.
Change your article to:
{sfx api=”flickr” album=”xxxxxxxx-xxxxxxxxxxxxxxxxx”}
Another solution is to use inline url parameter (see section dedicated to URL parameter).
6. Use of hashtags
Support of Google+, Flickr and Instagram hashtags has been introduced in SlideshowFx version
6.11.00.
To turn on hashtag search, use the below syntax in your article:



{sfx api=’picasa’ hashtag=’hashtag value’}
{sfx api=’flickr’ hashtag=’hashtag value’}
{sfx api=’instagram’ hashtag=’hashtag value’}
It is not necessary to include hashrag character (#).
Important note:
The scope of the search hashtag depends on platforms:



Picasa/Google+
Scope of search is restricted to Picasa/Googl+ user’s photos. List of hash tags using “,” as
separator is accepted. In this case, SlideshowFx will display all photos matching all hash tags
included in the list.
Flickr
Scope of search is restricted to Flickr user’s photos. Only 1 hash tag is accepted.
Instagram
Scope of search is not restricted to Flickr user’s photos but apply on all Instagram’s photos.
Only 1 hash tag is accepted.
SlideshowFx User Guide
Page 17
VIII. Widgetkit integration
Widgetkit is a toolkit for Joomla providing a simple and user-friendly way to enrich your website
experience with galleries, slideshows, grids, switchers, and much more. Check Widgetkit site for
details (http://yootheme.com/widgetkit). We assume, in this section, that you already installed
Widgetkit and you have enough knowledge to create your own web page based on Widgetkit items.
SlideshowFx Suite package includes a system plug-in for Widgetkit 2. This plug-in is a content
provider to connect Widgetkit to your favored media storage (Google+, Flickr, Facebook and
Instagram).
This section describes how to install SlideshowFx system plug-in and perform the configuration inside
Widgetkit.
1. Installation
SlideshowFx Widgetkit system plug-in must be manually installed through the standard Joomla!
extension manager. To get the plug-in, just decompress SlideshowFx Suite package and get file
plg_widgetkit_sfx.zip from directory ”extra”. Plug-in is automatically activated and ready to use.
After SlideshowFx Widgetkit system plugin installation, “SlideshowFx” will appear in Widgetkit
content type select.
2. Configure Slideshow Widgetkit content provider
Let start with an example of Widgetkit slideshow:











Create an new article,
From article editor, click on “Widgetkit” button (below article),
From Widgetkit pop-up, click on “New”,
Select “SlideshowFx” as “Content type”,
Select “Slideshow” and click on “Create”,
Give a name (“Test” for instance) to you Widgetkit (Field on top of the Widgetkit pop-up),
Configure the URL to link this Widgetkit to the album that you want to display
(Check section “Use of inline URL or RSS links inside article” for details about URLs)
Turn “Show private albums” if you want to display a private album,
Click on “Save”,
After Save confirmed, click on “Cancel” to exit Widgetkit pop-up,
Click on you newly created Widgetkit “Test”.
This will close Widgetkit pop-up and insert a tag inside your article [widgetkit id="x" name="Test"].
Save your article and configure a menu to display it.
Important Notes:
 At this point, use an URL pointing to an album (a set of photos). We’ll see later how to create
a gallery (a set of albums).
 If save button is grayed, that means that you forgot to fill-in some mandatory fields.
SlideshowFx User Guide
Page 18
You can check result on front-end and go-back to Widgetkit (menu “Components / Widgetkit”) to
configure the layout (select your widgetkit “Test” and click on “Settings”).
3. SlideshowFx content provider parameters
Here is a short description of SlideshowFx content provider.








URL: URL pointing to gallery or album that you want to display
(Check section “Use of inline URL or RSS links inside article” for details)
Show private albums: Allow or not display of private albums
Max albums: Maximum number of albums to display. Leave empty for no limit.
Albums thumbnail size: Define size of album thumbnails. SlideshowFx plug-in parameter is
used by default.
Max photos: Maximum number of photos to display. Leave empty for no limit.
Photos thumbnail size: Define size of photo thumbnails. SlideshowFx plug-in parameter is
used by default.
Albums size: Define size of photos inside slideshow. SlideshowFx parameter used by default.
Display albums in next Widgetkit: Used for display of galleries. See next section.
In this current version, only default account can be displayed (account configured in SlideshowFx).
4. How to display a gallery
A gallery is a set of album. Usually, you expect that a click on the album thumbnail open the album
and display photos. Unfortunately Widgetkit will just start a slideshow with album’s thumbnails.
To display the album, you have to:













Create a Widgetkit to display the gallery
(usually Widgetkit type is “Gallery” with name “My Gallery”),
From “Content” tab of this Widgetkit “My Gallery”, configure “URL” to point to a gallery,
Set parameter “Display albums in next widget” to “Yes”,
From Widgetkit “Settings”, in “Lightbox” tab, disable “Lightbox”
(Indeed, a click on thumbnail must open album page),
From Widgetkit “Settings”, in “Layout” tab, set “Columns”
(Phone portrait 1, Phone Landscape 2, Tablet 3, Desktop 4 for instance),
Save the Widgetkit and insert it in your article,
Create a new Widgetkit to display album
(Widgetkit type can be “Gallery” as well with name “My Album”),
From “Content” tab of this Widgetkit “My Album”, leave “URL” empty,
Let parameters “Display albums in next widget” to default value “No”,
From Widgetkit “Settings”, in “Layout” tab, set “Columns”
(Phone portrait 1, Phone Landscape 2, Tablet 3, Desktop 4 for instance),
From same tab, configure “Behavior” with value “Dynamic Grid” and 2 “Gutter (px)”,
From Widgetkit “Settings”, in “Content” tab, disable “Show title” and “Show content”,
From Widgetkit “Settings”, in “Lightbox” tab, enable “Show second media”
Save the Widgetkit and insert it just after the first Widgetkit in same article.
SlideshowFx User Guide
Page 19
Important Note:
 Use only the first Widgetkit (“My Gallery” in this example) to configure content parameters.
Indeed, all content parameters from second Widgetkit (“My Album” in this example) are
ignored. Only Widgetkit settings are used to configure album layout.
At the end you should have inside your article:
[widgetkit id="x" name="My Gallery"][widgetkit id="y" name="My Album"]
Save article and check result from front-end. You can then go-back Widgetkit settings to configure
gallery layout (using Widgetkit named “My Gallery”) or album layout (using Widgetkit named “My
Album”). You can change Widgetkit type as well as you want.
5. Widgetkit settings for display of galleries
In SlideshowFx 6.19.x and previous versions, it was necessary to make a small patch in Widgekit
gallery view. As of version 6.20.00, this is no more required. However when Gallery view is selected,
you have to enable parameter “Show second media in Lightbox” in WidgetKit “Settings” tab
“Lightbox”.
SlideshowFx User Guide
Page 20
IX. Display Galleries in Kunena forum
As of SlideshowFx 6.03.00, Google+ and Flickr public albums can be displayed in any Kunena post.
This requires SlidesowFx Kunena Integration plugin which is included in SlideshowFx Suite package
but require a manual installation. Unzip SlideshowFx Suite package and get Kunena plugin from
directory “pkg_slideshowfx_xxx/extra”.
After installation, a new BBCode button
will be added in post edit mode. To display a Google+ or
Flickr album, write and select the album URL and click on SlideshowFx button. BBCode “[sfx][/sfx]”
will be added.
SlidesowFx Kunena Integration plugin have some specific parameters allowing you to adapt display
inside Kunena forum. Some parameters are forced to a default value for a proper display. All other
SlideshowFx parameters are taken from SlideshowFx content plugin.
Figure 10: SlideshowFx Kunena Integration plugin
You can add SlideshowFx inline parameters (see section XIII Advanced inline parameters for details)
as follow: [sfx inline_parameter=value]Album URL[/sfx]. Simple quote around parameter value is
not required.
For instance [sfx display=slideshow]Album URL[/sfx] will display album as a simple thumbnail and
click on thumbnail will start the slideshow.
Notes:
 In Tapatalk, galleries are replaced by a simple link to the gallery.
 Display of Facebook, Instagram, YouTube or Google+, Flickr private albums is possible only
for default user configured in SlideshowFx parameters.
SlideshowFx User Guide
Page 21
X. Background music
Support of background music has been introduced in version 6.13.01 and still experimental. This
option is available only when SlideshowFx is called from inline article.
Syntax:
{sfx audio=’url_to_audio_file’ autoplay=’0|1’ controls=’0|1’ loop=’0|1’ muted=’0|1’ audio_on=’all|album’ ...}
Parameter url_to_audio_file can be ‘media/audio/file.mp3’ for instance.
Default values are:
 autoplay=’1’
 controls=’0’
 loop=’1’
 muted=’0’
 audio_on=’album’
Parameter audio_on=’album’ allow background music only when user open an album.
SlideshowFx User Guide
Page 22
XI. APIs configuration
1. Google+/Picasa API configuration
Even though principles described here still valid, below screenshots are outdated. You can follow
instructions provided on YouTube tutorial at https://www.youtube.com/watch?v=wl4Esn3_kH4.
In SlideshowFx content plug-in settings, go to section “Google+ API settings” and click on “Create or
Edit your App”.
Figure 11: Google+ user account configuration
This will open a new webpage connected to Google+. Just sign-in with your Google+ account:
From the Google Cloud Console, click on “CREATE PROJECT”. Then enter your “Project name”, leave
“Project ID” with default value, check “I have read and agree to all Terms of Service…” and click on
“Create”.
SlideshowFx User Guide
Page 23
Google+ will probably ask you to confirm your account through a security check. Just follow the
instructions. At the end of this security check, your project will be created and you will be redirected
to the Google Cloud Console project list. Refresh the page or ask again for project creation if your
project doesn’t appear in the list.
As soon as project appear in project list, click on it, then click on “APIs & auth” and “APIs”, turn on
“YouTube Data API v3”. Click on “Consent screen”, provide information related to your application
(Fields “EMAIL ADDRESS “ and “PRODUCT NAME” are mandatory) and click on “Save”. The consent
screen will be shown to users whenever you request access to their private data using your client ID.
Click on “Credentials” and in section
“Oauth” click on “CREATE NEW CLIENT
ID”.
Select “Web application”, fill-in
“AUTHORIZED JAVASCRIPT ORIGINS”
and “AUTHORIZED REDIRECT URI” with
values “Google+ API web origin” and
“Google+ API web origin” provided by
SlideshowFx and click on “Create Client
ID”.
Copy your “Client ID” and “Client secret” back into SlideshowFx Google+ API settings and save
parameters.
SlideshowFx User Guide
Page 24
From SlideshowFx parameters, section Google+ API settings, click on “Get your App token”. Read
instructions and click on “Accept”.
Once the authorization accepted, all credential information will be displayed:
Click on “Confirm”. Modifications will be highlighted in green in SlideshowFx parameters. Save
parameters once again.
You completed the configuration of your Google+ account. You can create a SlideshowFx menu,
module or an article with only {sfx api=’picasa’} inside. SlideshowFx with display the gallery
associated to your Google+ account.
SlideshowFx User Guide
Page 25
Notes:
 Old deprecated Picasa Oauth 1.0 protocol is no more supported by Google. Please upgrade
to last SlideshowFx and create your own Google+ API key/secret as described in this
section.
 Google+ App is required for display of YouTube playlists and videos.
 The inline parameter api=’picasa’ can be omitted if you didn’t configure another API (Flickr,
Facebook or Instagram).
 By default, SlideshowFx will not display private albums even though you configured a token
access. To display private albums, go to section “Filters” in SlideshowFx settings and change
parameter “Access to private albums” to “Registered users” or “All users”.
 If you change parameter “YouTube Data API v3”, it can take several minutes before
SlideshowFx get access to YouTube playlist. In between, Google+ API will report “BAD
REQUEST” error message.
 At any time you can revoke a token by clicking on “Revoke a Picasa token”.
SlideshowFx User Guide
Page 26
2. Flickr API configuration
Even though principles described here still valid, below screenshots are outdated. You can follow
instructions provided on YouTube tutorial at https://www.youtube.com/watch?v=kGfFjXPBu2k.
In SlideshowFx content plug-in settings, go to section “Flickr API settings” and click on “Create or
Edit your App”.
Figure 12: Flickr user account configuration
This will redirect you to Flickr. Just sign-in with your Flickr account.
From your Flickr home page, go to menu “Explore” and “App
Garden”:
SlideshowFx User Guide
Page 27
From the App Garden, click on “Get an API key”:
Choose Commercial or Non-Commercial App Key depending on your website purpose. Enter your
application name (a name related to the gallery displayed on your website) and give a description of
your application. Read the “Flickr API Terms of Use”, accept conditions (including Flickr members
rights) and click on “SUBMIT”.
This will display your App Key and secret code:
Copy the App Key and
secret
code
in
SlideshowFx
settings
(see Figure 12: Flickr
user
account
configuration) and save
SlideshowFx
parameters.
Click on “Edit auth flow
for this app”
SlideshowFx User Guide
Page 28
You will get the below form:
Fill in “App Description”, select “Web Application” and configure “Callback URL” with URL provided
in SlideshowFx parameters. App Logo is optional. Click on “SAVE CHANGES”.
Your Flickr web app has been created.
Go back to SlideshowFx parameters and configure the API key and secret
code:
Notes:
At any time you can return to your Flickr App Key by clicking on “Edit or revoke an API key”.
SlideshowFx User Guide
Page 29
The Flickr username and user ID are the default OopsTouch parameters. You have to configure your
own user name, user ID and a token by clicking on “Get your App token”. You will be redirected to
Flickr which will ask you confirmation. Click on “OK, I’LL AUTHORIZE IT”.
Note:
Usually Flickr App and token are created from a same Flickr user account but they can be different.
To do so, just sign-out after Flickr App creation and sign-in with a different Flickr account during
token creation.
Once the authorization accepted, a pop-up will give your username, user ID and token. Just click on
“Confirm”. Modifications will be highlighted in green in SlideshowFx parameters. Save parameters
once again.
SlideshowFx User Guide
Page 30
You completed the configuration of your Flickr account. You can create a SlideshowFx menu, module
or an article with only {sfx api=’flickr’} inside. SlideshowFx with display the gallery associated to your
Flickr account.
Note:
 The inline parameter api=’flickr’ can be omitted if you didn’t configure another API (Picasa,
Facebook or Instagram).
 By default, SlideshowFx will not display private albums even though you configured a token
access. To display private albums, go to section “Filters” in SlideshowFx settings and change
parameter “Access to private albums” to “Registered users” or “All users”.
SlideshowFx User Guide
Page 31
3. Facebook API configuration
Even though principles described here still valid, below screenshots are outdated. Please contact our
support at www.oopstouch.com/support if you need more help (English and French).
In SlideshowFx content plug-in settings, go to section “Facebook API settings” and click on “Create or
Edit your App”.
Figure 13: Facebook user account configuration
This will redirect you to Facebook. Just sign-in with your Facebook account:
From the Facebook developers home page, click on “Create New App”:
A pop-up will ask you the Facebook application name. Provide a name related to your website and
click on “Continue”. Your Facebook App will be created with an App ID and App Secret code.
SlideshowFx User Guide
Page 32
From this summary App page, configure the following parameters:



App Domains: your site domain name without http prefix (localhost in this example but more
generally www.mydomain.com or mydomain.com)
Disable Sandbox Mode (you can keep it enable to avoid use by other people)
Check “Website with Facebook Login” and set your site URL with http prefix (URL profided
by SlideshowFx in Erreur ! Source du renvoi introuvable.)
Click on “Save Changes”
Note: Your changes may take several minutes to propagate to all Facebook servers.
SlideshowFx User Guide
Page 33
In “Settings” menu on the left, click on “Permissions” set “User & Friend Permissions” to
“user_photos” and click on “Save Changes”:
Your Facebook App has been created. Go back to your Facebook App ID and Secret code (from
“Settings” menu on the left, click on “Basic”). Copy the App ID and App Secret, go back to
SlideshowFx Facebook API settings, past both information and click on “Save”.
Note:
 At any time you can return to your Facebook App by clicking on “Check or remove a
Facebook access token”.
SlideshowFx User Guide
Page 34
Now, you have to configure your Facebook user ID and token by clicking on “Get your App token”. A
pop-up will ask you to authorize access to your Facebook information. Click on “Okay”.
Note: Usually Facebook App and token are created from a same Facebook user account but they can
be different. To do so, just sign-out after Facebook App creation and sign-in with a different
Facebook account during token creation.
Once the authorization accepted, a pop-up will inform you that your current user ID and token will
be changed. Just accept the change.
Modifications will be highlighted in green in SlideshowFx parameters. Save parameters once again.
You completed the configuration of your Facebook Application and user ID in SlideshiwFx.
You completed the configuration of your Facebook account. You can create a SlideshowFx menu,
module or an article with only {sfx api=’flickr’} inside. SlideshowFx with display the gallery associated
to your Facebook account.
Note:
 The inline parameter api=’facebook’ can be omitted if you didn’t configure another API
(Picasa, Flickr or Instagram).
 By default, SlideshowFx will not display private albums even though you configured a token
access. To display private albums, go to section “Filters” in SlideshowFx settings and change
parameter “Access to private albums” to “Registered users” or “All users”.
 Facebook access token must be reinitialized every 2 months or after each user password
change. To do so, just click on “Get your App token”.
SlideshowFx User Guide
Page 35
4. Instagram API configuration
Even though principles described here still valid, below screenshots could be outdated. Please
contact our support at www.oopstouch.com/support if you need more help (English and French).
In SlideshowFx content plug-in settings, go to section “Instagram API settings” and click on “Create
or Edit you App”.
Figure 14: Instagram user account configuration
This will redirect you to Instagram. Just sign-in with your Instagram account and click on “Register
Your Application”.
SlideshowFx User Guide
Page 36
Fill-in Application name and Description fields with information related to your website. Fill-in
website and Oauth redirect URI with information provided by SlideshowFx (see Erreur ! Source du
renvoi introuvable.). Then, click on “Register”.
Your Instagram client has been created:
SlideshowFx User Guide
Page 37
Copy the Client ID and Client Secret, go back to SlideshowFx Instagram API settings (see Figure 11:
Google+ user account configuration), past both information and click on “Save”.
Note: At any time you can manage your Instagram client by clicking on “Create or Edit your App”.
Now, you have to configure your Instagram username, user ID and token by clicking on “Get your
App token”.
Note: Usually Instagram client and token are created from a same Instagram user account but they
can be different. To do so, just sign-out after creation of Instagram client and sign-in with a different
Instagram account during token creation.
Once the authorization accepted, a pop-up will inform you that your current user ID and token will
be changed. Just accept the change.
Modifications will be highlighted in green in SlideshowFx parameters. Save parameters once again.
Note:
Instagram
token
initialization
is
mandatory
even
though you want to
display only public
photos.
SlideshowFx User Guide
Page 38
You completed the configuration of your Instagram client and SlideshiwFx API configuration.
You completed the configuration of your Instagram account. You can create a SlideshowFx menu,
module or an article with only {sfx api=’instagram’} inside. SlideshowFx with display the gallery
associated to your Instagram account.
Notes:
 The inline parameter api=’instagram’ can be omitted if you didn’t configure another API
(Picasa, Flickr or Facebook).
 Instagram API Term of Use do not allow download of more than 30 photos at same time. To
overcome this restriction, you can increase the parameter “Max photos”. SlideshowFx will
get photos using multiple consecutive queries. Value “0” can be used to download all photos.
In this case, we strongly recommend you to activate SlideshowFx internal cache mechanism.
 By default, SlideshowFx will not display private albums even though you configured a token
access. To display private albums, go to section “Filters” in SlideshowFx settings and change
parameter “Access to private albums” to “Registered users” or “All users”.
SlideshowFx User Guide
Page 39
5. Piwigo API configuration
Piwigo is a photo gallery software for the web that comes with powerful features to publish and
manage your collection of pictures.
Started in 2002, the project is now supported by an active community of users and developers. It
supports numerous galleries of all sizes all over the world, from an individual ten photos party to the
images stock of an agency. This scalability is supported by smart browsing capabilities based on
categories and tags search.
Piwigo is both web and photo standard compliant. And, icing on the cake, it is free and open source:
 Get and build your Piwigo server at http://piwigo.org
 Register to a Piwigo hosting solution from http://piwigo.org/hosting/
Whatever solution selected (your own server or hosted solution), SlideshowFx can integrate your
Piwigo galleries inside Joomla article, module, menu, Kunena post or Widgetkit elements.
Configuration is very easy. You just have to set “Piwigo server” in section “User account” of
SlideshowFx plugin configuration with Piwigo web service URL. This URL is usually your Piwigo server
URL ended with “/ws.php”. You can make a test with the Piwigo demo gallery:
http://piwigo.org/demo/ws.php.
By default, Piwigo returns small album thumbnail leading to bad image quality in Joomla gallery. You
can force a larger thumbnail by configuring parameter “Album thumbnail size”. This assume that you
configured Piwigo to provide such picture size.
SlideshowFx User Guide
Page 40
6. OneDrive API configuration
Even though principles described here still valid, below screenshots could be outdated. YouTube
tutorial can be found at https://www.youtube.com/watch?v=7YpZ_hGr2Kg.
In SlideshowFx content plug-in settings, go to section “Microsoft OneDrive API settings” and click on
“Get your App token”.
Figure 15: Microsoft OneDrive user account configuration
This will redirect you to Microsoft account developer center. Just sign-in with your OneDrive account
and click on “Create application”.
16: Microsoft account developer center
Fill-in field “Application name”. Use a name related to your website for instance. Read Microsoft
services terms of use and click on “Accept”.
Click on “API settings”, copy field “OneDrive redirect URI” from SlideshowFx settings and past value
in field “Redirect URLs” in Microsoft OneDrive API settings. Field “Root domain” will be automatically
configured. Save Microsft OneDrive parameters and click on “App Settings”.
SlideshowFx User Guide
Page 41
Copy “Client ID” and “Client secret” from Microsoft OneDrive App settings and past values in
SlideshowFx settings “OneDrive client ID” and “OneDrive client secret”.
Close Microsoft OneDrive window, save SlideshowFx settings and clisk on “Get your token”. You will
be redirected to Microsoft OneDrive consent screen “Let this app access you info?”. Click on “Yes”.
A new webpage will summarize your information (username, user ID and token). Click on “Confirm”.
This will configure and highlight parameters inside SlideshowFx settings. Click on “Save”.
Note:
 If you get an error page “We’re unable to complete your request” on get token, check
browser URL to see the reason of the error. You should have something like
“…&error_description=The+provided+value+for+the+input+parameter+’redirect_uri’+is+no
t+valid…”. In this case check Redirect URI in App parameters.
Click on OneDrive button to login to your OneDrive account.
You can then upload your albums (one folder per album) in one of the below directory and configure
“OneDrive Root directory” and “OneDrive path” fields to the appropriate value.
Directory
Applications/<Application name>
Documents
Photos
Images
OneDrive root
Applications
Documents
Photos
Root
OneDrive path
(keep this field empty)
(keep this field empty)
(keep this field empty)
Images
Photos can be uploaded through OneDrive web interface, OneDrive windows application or any
OneDrive application for smartphones. Just connect the application to your OneDrive account.
SlideshowFx User Guide
Page 42
7. SlideshowFx API configuration
SlideshowFx can be used to display photo and video albums stored locally on your server. To use this
mode, just upload your photo/video albums in directory /images/slideshowfx/default. Photos must
be JPEG files with “.jpg” as extension. Video must be mp4, ogg or webm formats (each video must be
associated to a jpg photo for thumbnail creation).
Then you can create a SlideshowFx Menu or Module and select platform SlideshowFx or insert in
your Joomla article inline command {sfx api=’slideshowfx’}.
The first time you display you album, SlideshowFx will build appropriated photos thumbnails and
photos will be resized for web display. Photos and thumbnail size will depend on SlideshowFx
parameters. All photos will be stored in directory /media/slideshowfx/cache/default. You can
remove content of /media/slideshowfx/cache at any time to force photos refrech.
You can keep default SlideshowFx API settings:
Parameter Album cache can be disabled for debug purpose but is not recommended on production
site since each time a visitor will display an album, SlidehowFx will build the appropriated sized
photos.
Photos resizing can be disabled when photos format can be directly used for the display on your
website. A maximum 1800 pixels width and height is recommended. This parameter has no effect on
thumbnails.
GD library doesn’t support some JPEG photos (photos using transparency for instance). By default,
SlideshowFx will display an alternate photo showing a question mark. You can disable error handling
to force the use of original photos.
To add a new user gallery, just create a new folder in /images/slideshowfx and puts user’s albums.
Then use this folder name as user ID inside SlideshowFx Menu and Module (switch settings into
expert mode to enter the user ID) or use inline command {sfx api=’slideshowfx’ user=’folder_name’}
in articles. SlideshowFx will create associated thumbnails and resized photo for web display in a
subdirectory of /media/slideshowfx/folder_name.
SlideshowFx User Guide
Page 43
Video
Photos
Albums
SlideshowFx try to get albums and photos information from EXIF data stored in photos. When such
data are not available information from file system are used. The table below gives more details
about field used.
Field
Principal source
Secondary source
Thumbnail
Photo cover.jpg.
First photo found in folder.
Name
Album cover EXIF.IFD0.Title.
Folder name.
Description
Album cover EXIF.IFD0.Comments.
Published date
Album cover EXIF.DateTimeOriginal.
Updated date
Same as published date.
# of photos
Count number of JPG files in album folder.
Permissions
Public.
Thumbnail
Original photo resized.
Caption
Photo EXIF.IFD0.Title.
Description
Photo EXIF.IFD0.Comments.
Published date
Photo EXIF.DateTimeOriginal.
Updated date
Same as published date.
GPS position
Photo EXIF.GPS
Thumbnail
Associated JPG photo resized
Caption
Photo EXIF.IFD0.Title.
Description
Photo EXIF.IFD0.Comments.
Published date
Photo EXIF.DateTimeOriginal.
Updated date
Same as published date.
GPS position
Photo EXIF.GPS
Date of photo used as cover.
File name.
Date of file.
Photo file name.
Date of photo file.
SlideshowFx is designed in such way that photos can be stored anywhere in the cloud. In this case,
you have to configure SlideshowFx server and SlideshowFx secret parameters. Please contact
support if you want to deploy this kind of topology.
Notes:




SlideshowFx requires EXIF and GD library on your PHP server hosting SlideshowFx API server.
Execution of PHP script /plugins/content/slideshowfx/api/index.php must be allowed.
Folders /media/slideshowfx must be writable.
Joomla Search Engine Friendly URLs is supported except URL rewriting. Contact our support if
you need such configuration or if you are facing troubles with other SEF extensions.
 .httaccss file generated by Admin Tool can block access to some pictures located in
/media/slideshowfx directory. So far, the only workaround found is to disable parameter
“Front-end protection” in .htaccess maker.
SlideshowFx User Guide
Page 44
XII. SlideshowFx parameters
1. Filters
Access to your private albums can be forbidden or restricted to only registered users.
Full resolution download is supported only in Picasa/Google+ mode. If your need this feature on
Flickr, just let me know using SlideshowFx plug-in forum (full resolution is proposed only to Flickr Pro
accounts).
SlideshowFx User Guide
Page 45
2. Gallery settings
SlideshowFx Professional Edition for Joomla! 2.5 provides additional settings to configure galleries
and albums layouts (standard layout, title on top, on left, on right, compact and justified layout). You
can see some snapshots in annex section 1 (Gallery and album Layout) or have a demo on
www.oopstouch.com by clicking on “Quick demo” link and select layout.
SlideshowFx User Guide
Page 46
3. Album settings
SlideshowFx Professional Edition provides additional settings to configure galleries and albums
layouts (standard layout, title on top, on left, on right and compact layout). You can see see some
snapshots in annex section 1 (Gallery and album Layout) or have a demo on www.oopstouch.com by
clicking on “Demonstration” button and select layout.
SlideshowFx User Guide
Page 47
4. Slideshow settings
This section allows you to configure how slideshow is displayed.
If some or all pictures are not correctly displayed, try to reduce parameter “Max. picture size” or
ensure that resolution of the photos uploaded is big enough.
SlideshowFx User Guide
Page 48
5. Slider
This section allows you to configure how Sliders are displayed in articles or menus. Similar
parameters can be found in SlideshowFx module as well.
SlideshowFx User Guide
Page 49
6. Video settings
For compatibility with different browser, when is enabled, it is recommended to keep default
parameters as displayed here.
Video is supported only in Picasa, Google+, Flickr and Instagram mode. The parameters “Player
controls” and “Auto hide mode” are specific to Google+ Flash player. The parameters “Allow
fullscreen” have no effect in Instragram mode.
7. Geolocation
This section allows you to enable/disable geolocation support in SlideshowFx and customize most of
display and controls options.
When geolocation information is available and option enabled, a map pointer will be display on
top/left of photo in slideshow. A click on this map pointer will switch display to map mode. A second
click will switch back display to standard photo mode.
See next screenshot for description of map display and controls.
SlideshowFx User Guide
Page 50
Display mode
Pan control
Street view
Zoom control
Map pointer
Overview map
Scale
Note:
You can change default map pointer by putting a PNG file in /media/slideshowfx (or any other subdirectory) and adding parameter geoPointer:’media/slideshowfx/pointer.png’ in “Customize /
Advanced options” section.
8. Rating settings
Rating mode cannot be enabled on website having Joomla! Cache enabled.
To remove SlideshowFx database, don’t forget to set parameter “Allow clear votes” to “Yes”, save
parameters and then click on link “Remove SlideshowFx database”. An alternative solution on is to
install and unsinstall SlideshowFx Trial version available on www.oopstouch.com.
SlideshowFx User Guide
Page 51
9. ShareThis settings
ShareThis option requires a valid ShareThis public key. Create your account sharethis.com and get
your public key.
SlideshowFx User Guide
Page 52
10.Global settings
You can drastically improve your website performances by activating SlideshowFx internal cache
mechanism and configure a cache time.
For galleries having a large number of albums, or albums having a large number of photos, you have
to increase the default PHP PCRE’s backtracking limit. The default PHP value is 100000 which is
suitable for around 200 albums/photos. Increase this parameters (adding 100000 step by step) until
having a correct display of your bigger gallery and album.
Force framework parameter can be set to “Yes” in some rare cases (website template based on
Jquery for instance) when you get a Javascript error during web page loading. Another alternative is
to activate jQuery framework in SlideshowFx plug-in.
11.Translations settings
Date format/string and photo string are taken into account only when Multilingual support is
disabled.
Multilingual support can be enabled if you have installed a front-end SlideshowFx language file from
www.oopstouch.com or if you have created your own language file based on
/administrator/language/en-GB/en-GB.plg_content_slideshowfx.ini.
Do not hesitate to share your translation on dedicated forum www.oopstouch.com.
SlideshowFx User Guide
Page 53
12.Advanced settings
Here is the list of parameters that can be defined:
timer: 4,
overlayOpacity: 0.8,
overlayFadeDuration: 400,
overlayClose: true,
resizeDuration: 600,
initialWidth: 250,
initialHeight: 250,
imageFadeDuration: 400,
captionAnimationDuration: 400
Default timeout for slideshow
1 is opaque, 0 is completely transparent
Overlay fade-in/fade-out duration (in milliseconds)
Close slideshow on click on overlay
Photo resize duration (in milliseconds)
Initial width of the box (in pixels)
Initial height of the box (in pixels)
Image fade-in duration (in milliseconds)
Duration of the caption animation (in milliseconds)
Notes:
- Don’t forget the virgule “,” at the end of each line, except the last one.
- Don’t write the field description above in blue.
SlideshowFx User Guide
Page 54
13.CSS Layout settings
You can add extra CSS code here to adapt SlideshowFx colors to your website. For instance, default
SlideshowFx colors will not fit with dark websites. The solution is to add some CSS code in this
section.
Below some basic example of CSS code:
div.sfx {
background-color: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.5);
box-shadow: 4px 4px 2px transparent;
}
div.sfx_img {
border-color: rgba(255, 255, 255, 0.4);
}
In this example, RGBA colors are used to get benefice of opacity parameter. An RGBA color value is
specified with: rgba(red, green, blue, alpha). The alpha parameter is a number between 0.0 (fully
transparent) and 1.0 (fully opaque). You can use CSS Makers to get RGBA values
(http://www.css3maker.com/css-3-rgba.html).
You can remove shadow effet by changing box-shadow color to “transparent”.
div.sfx {
box-shadow: 4px 4px 2px transparent;
}
Do not hesitate to contact support on forum www.oopstouch.com for further help.
SlideshowFx User Guide
Page 55
XIII. Advanced inline parameters
You can overwrite the default plug-in parameters by adding extra information in articles:

{sfx album=’xxx’ Param1=’Value1’ Param2=’Value2’ …}
Param1 and Param2 are extra parameters. Value1 and Value2 are associated values. There is no
specific limitation in term of number of parameters.
Simple brackets (‘) are used as delimiter for value. Double brackets (“) are not allowed.
Parameters related to plug-in settings:























user: Overwrite default username
api: force API mode (picasa or flickr)
token: Overwrite default token
private: Overwrite default private access (0: Registered users only, 1: All users)
gallery_layout: Gallery layout (standard, right, left, top or compact)
albums_row: Number of album thumbnail per row.
title_size: Font size to be used for album title.
max_title_lenght: Max. 56ength for album title.
album_layout: Album layout (standard, right, left, top or compact)
pictures_row: Number of pictures 56humbnail per row.
caption_size: Font size to be used for picture caption.
max_caption_lenght: Max. 56ength for picture caption.
size: Size of album thumbnail in slideshowmode.
img_size: Set image size in slideshow.
slideshow_caption: Overwrite default show caption option (0: Hide , 1: Show)
download: Overwrite default allow download option (0: Disable, 1: Allow)
repeat: Activate slideshow loopback mode.
autoplay: Start auto slideshow.
download: Allow picture download.
debug: Overwrite default error report mode (0: Disable alerts, 1: Basic alerts, 2: Full report)
sfx_options: Overwrite default SlideshowFX advanced parameters
css_code: Overwrite default embedded CSS code
…
Specific inline parameters (no equivalent plug-in parameters):



album: Album ID
display: Display mode (gallery, album, album-thumbnail or slideshow)
align: Define how to align thumbnail (left, right)
Contact support if you need more help in inline parameters.
SlideshowFx User Guide
Page 56
XIV. References
1. SlideshowFx related links
[1] Basic demo of photo gallery on Joomla connected to Google+:
http://www.oopstouch.com/live/slideshowfx/plugin
(Additional demos with Flickr and Facebook available. Check menus on the left)
[2] Basic demo of photo gallery on WordPress connected to Google+:
http://wp.oopstouch.com/?page_id=22
(Additional demos with Flickr and Facebook available. Check menu “Demonstration”)
[3] Test SlideshowFx with your own Picasa, Google+, Flickr or Facebook user account:
http://www.oopstouch.com/demo/slideshowfx/plugin
[4] Check Joomla reviews on Joomla Extension Directory (rating at 4.88 out of 5.00)
http://extensions.joomla.org/extensions/social-web/social-media/photo-channels/17357
[5] Flash animation showing SlideshowFx installation and basic configuration with Google+ account
http://www.oopstouch.com/files/tutorials/flash/demo-googleplus.htm
[6] Our support forum for any technical question, issue report or suggestion:
http://www.oopstouch.com/support
[7] Contact form for non related technical questions:
http://www.oopstouch.com/contact
[8] Get SlideshowFx for Joomla
http://www.oopstouch.com/download/slideshowfx/plugin
(Trial version available to check compatibility with your website. Limited feature list)
[9] Get SlideshowFx Integration for Kunena
http://www.oopstouch.com/files/sfx/extensions/plg_kunena_sfx.zip
[10]Get SlideshowFx for WordPress
http://www.oopstouch.com/download/slideshowfx/wordpress
(Free version with limited feature available from WordPress repository)
[11]Terms and conditions:
http://www.oopstouch.com/conditions
SlideshowFx User Guide
Page 57
2. Google+ related links
[12] Google+
https://plus.google.com
[13]Google+ Web Applications
https://cloud.google.com/console
[14]Revoke a Picasa token
https://accounts.google.com/IssuedAuthSubTokens
[15]Picasa Web Albums Data API Terms of Service
https://developers.google.com/picasa-web/terms
3. Flickr related links
[16]Flickr
http://www.flickr.com
[17]The Flickr Developer Guide
http://www.flickr.com/services/developer
[18]Request a Flickr API Key
http://www.flickr.com/services/apps/create
[19]The Flickr APIs Terms of Use
http://www.flickr.com/services/api/tos
4. Facebook related links
[20]Facebook
https://www.facebook.com
[21]Facebook photos
https://www.facebook.com/me/photos
[22]Facebook Apps
https://developers.facebook.com/apps
[23]Facebook debug tool
https://developers.facebook.com/tools/debug
[24]Facebook Platform Policies
https://developers.facebook.com/policy
5. Instagram related links
[25] Instagram
http://instagram.com
[26]Instagram Terms of Use
http://instagram.com/about/legal/terms
[27]Instagram developers
http://instagram.com/developer
[28]Instagram API Terms of Use
http://instagram.com/about/legal/terms/api
SlideshowFx User Guide
Page 58
6. Piwigo related links
[29]Piwigo official website
http://piwigo.org
[30]Piwigo demo website
http://piwigo.org/demo/
[31]Piwigo hosting
http://piwigo.org/hosting
7. Other links
[32] CSS code Maker
http://www.css3maker.com
[33]Widgetkit
http://yootheme.com/widgetkit
8. Credits
Slider mode is based on Camera Slideshow, Copyright © 2012 by Manuel Masia (www.pixedelic.com)
and licensed under MIT license (http://www.opensource.org/licenses/mit-license.php).
Justified layout in gallery and album views in based on Justified Gallery, Copyright © 2014 Miro
Mannino (http://miromannino.github.io/Justified-Gallery).
SlideshowFx User Guide
Page 59
XV. Annexes
1. Gallery and album Layout
SlideshowFx Pro provides 5 different layouts in gallery and album view. Here are some snapshots.
Figure 17: Standard Layout
Figure 18: Title on top
SlideshowFx User Guide
Page 60
Figure 19: Title on right
Figure 20: Title on left
SlideshowFx User Guide
Page 61
Figure 21: Compact layout
SlideshowFx User Guide
Page 62
2. Feature list
Platforms
 Support of Picasa, Google+, Flickr, Facebook, Instagram and Piwigo photos
 Support of Picasa, Google+, Flickr, Instagram and YouTube videos
 Support of private photos and videos (Picasa, Google+, Flickr, Facebook and Instagram)
 Support of local photo albums
Features
 Display all albums, a single selected album or simple album thumbnail
 Display Flickr Collections and Galleries (including public Galleries)
 Display Google, Flickr or Instagram photos/videos based on hashtag.
 Optional automatic scrolling in gallery and album view
 Optional start slideshow on album click
 Optional photo animation in slideshow (zoom+move)
 Support photos and video geolocation and map display except with YouTube (API restriction)
 Support album, photos and videos rating
 Integration of ShareThis buttons connected to 40+ social networks
 Support download of photos in a selected resolution
(Including full resolution when possible)
Layout
 6 different layouts (album and photo title on bottom, top, left, right or compact mode)
 Widgetkit Integration (SlideshowFx acts as content provider)
 Embedded HTML slider with image transition inside articles, menus and modules
 Tag “New” and “Updated” on top of thumbnails to highlight the last changes
 Possibility to merge several photo galleries into a single gallery
 Possibility to sort albums or photos/video by title, date, popularity or randomly
 Full control on elements display (buttons, information, colors)
 Automatic photo enlarge option in slideshow
 Optional automatic slideshow
Performances
 Internal cache mechanism increasing response time and decreasing access to 3 rd parties API
(Google+, Flickr, Facebook and Instagram)
 Pagination and scroll mechanism with support of large albums
(Tested with 700+ photos on Google+ / 2000+ photos on Flickr)
Search engine optimization
 Possibility to display album description
 Page title automatically initialized with current album title
 HTML meta description update based on albums descriptions
SlideshowFx User Guide
Page 63
Access control
 Possibility to restrict private albums to registered users
 Possibility to restrict photo download to registered users
 Possibility to restrict photo and video rating to registered users
Compatibility
 Support of responsive templates
 Automatic thumbnail size calculation to fit to the display device
 Compatible with last Joomla! Platforms 2.5 and 3.x
 Native compatible with both Jquery and Mootols frameworks
 Compatible with last browser Firefox, Chrome, Safari, IE, Opera
Conditions
 Full feature Trial version to check compatibility with your website before any purchase
 Full documentation (50+ pages)
 1 year free upgrade and support
 30 days money back
 No advertising link
SlideshowFx User Guide
Page 64
3. Software upgrade from Trial to Pro version
SlideshowFx can be installed on top of Trial version, however, there are some points described below
to check in order to ensure that Pro is not running into Trial mode.



Ensure that you have created your own Google+, Flickr+, Facebook or Instagram App.
Configure App key and Secret in SlideshowFx settings, in one of the sections API settings
(“*” force plugin to run into demo mode).
Get a new token
(click on Get your token button in SlideshowFx settings, in one of the sections API settings.
See sections API configuration for details. Then do the following checks:




Menu Components / SlideshowFx Gallery / Tab User accounts / API settings: Parameter
“Server” must be empty or hidden.
Menu Components / SlideshowFx Gallery / Tab User accounts / API settings: Parameter
“Default Server” must be empty.
In any SlideshowFx Menu, parameter “Server” must be empty or hidden (switch to expert
mode by clicking on [+] button).
In any SlideshowFx Module, parameter “Server” must be empty or hidden (switch to expert
mode by clicking on [+] button).
If you continue to get error messages “Pro version is running in demo mode” or “Your Trial period
expired”, please, contact our support using contact form with below information:







URL to front-end web page where error is displayed,
Platform used (Google+, Flickr, Facebook or Instagram),
Your App ID,
Your App Secret,
User ID,
Token,
Admin login/password.
We will help you to fix the issue.
SlideshowFx User Guide
Page 65
4. Software upgrade from a very old version
SlideshowFx starting from version 5.0 is dedicated to Joomla! 2.5 and 3.x.
Here is a list of points to take care during plug-in upgrade from a very old version:










Starting from version 6.09.00, SlideshowFx supports display of YouTube playlists and videos.
However, a Google token renewal is required (click on Get Token button from Google+ user
account in SlideshowFx parameters).
SlideshowFx version 6.0 is a full redesign of the plug-in. In case of problem after upgrade
from a previous version please contact support.
Tokens created with SlideshowFx version 5.x and former versions can be used with last
SlideshowFx 6.x. However, to get a new token from Flickr, Instagram you need to change
your API Key configuration with new callback URL.
As of version 5.05, an old workaround for Google Chrome as been removed. There is a risk of
regression in the calculation of thumbnail width in gallery and album view. Please, contact
support through forum in case of problem.
As of version 5.01, the parameter “Force Mootools” is replaced by “Force framework”. If
“Force Mootools” was set to “Yes”, the new parameter “Force framework” must be set to
“Yes” after upgrade to SlideshowFx 5.01 or higher.
As of version 4.04 for Joomla 2.5 (compatible 3.0), both PHP #strftime and #date formats are
accepted but #strftime format is deprecated in Joomla! 3.0. After installation, whatever your
Joomla! Version, please take care on display date format and report any problem.
Video download is not allowed (picture is returned instead of video).
After upgrade to SlideshowFx 4.03 you may have to change basic syntax {sfx rss=’RSS link’} to
{sfx rss=’RSS link’ display=’slideshow’} since default display mode has been changed to
gallery or album depending on RSS or Google+ link.
After upgrade to SlideshowFx Pro 3.09 (or higher version), check button style in ShareThis
option.
After upgrade to SlideshowFx Pro 3.07 (or higher version), if date is not correctly displayed
please check date format in Advanced Parameters (removing the date format will restore
default parameter).
Do not hesitate to contact support on forum www.oopstouch.com for more help.
SlideshowFx User Guide
Page 66
XVI. History
Edition
01
02
Date
June 4th, 2013
June 27th, 2013
02.01
02.02
June 28th, 2013
September 7th, 2013
02.03
November 16th, 2013
03
May 8th, 2014
04
June 5th, 2014
05
06
June 12th, 2014
June 28th, 2014
07
July 6th, 2014
08
July 12th, 2014
09
August 19th, 2014
10
October 11th, 2014
11
December 6th, 2014
12
January 12th, 2015
13
January 20th, 2015
14
February 20th, 2015
15
February 27th, 2015
16
March 22nd, 2015
17
April 3rd, 2015
18
May 25th, 2015
SlideshowFx User Guide
Comment
First edition based on SlideshowFx version 5.18.
New edition based on SlideshowFx version 5.18.
Description of Flickr collections.
General presentation and advanced inline parameters added.
Add information related to CSS code parameter.
Section software upgrade updated.
Add link to Flash animation (basic installation and configuration)
Section “Tips and tricks” added (SlideshowFx inside a module).
Instruction added in case of Picasa authentication error.
URL provided in clear in section references.
Update according SlideshowFx version 5.30:
- Support of Google+ Oauth 2.0 protocol.
- Support of full screen mode using 3rd party javascript.
Update for SlideshowFx version 6.0 (Packaged with menu and
module extensions).
Update for SlideshowFx version 6.02.00 (SlideshowFx Kunena
Integration).
Update for SlideshowFx version 6.03.00 (Support of Flickr videos).
Update for SlideshowFx version 6.04.00
(Support of Instagram videos).
Update for SlideshowFx version 6.05.00
(Support of geolocation).
Update for SlideshowFx version 6.05.05
(Support of full screen mode).
Update for SlideshowFx version 6.06.00
(Support of Flickr galleries, automatic scrolling and animations).
Update for SlideshowFx version 6.07.00
(Support of Slider mode based on Camera Slideshow from Manuel
Masia / See section credits for details).
Update for SlideshowFx version 6.08.00
(Support of local photo albums)
Update for SlideshowFx version 6.09.00
(Support of YouTube playlists and videos)
Update for SlideshowFx version 6.09.03
(Support of local videos)
Update for SlideshowFx version 6.10.00
(SlideshowFx Editors button added)
Update for SlideshowFx version 6.10.01
(Support of Instagram hashtag added)
Change in Google+ App configuration for support of YouTube.
Update for SlideshowFx version 6.10.03
(Support of Flickr hashtag added)
Update for SlideshowFx version 6.11.00
(Support of Google+/Picasa hashtag added)
Description of manual install
Page 67
19
June 20th, 2015
20
June 22nd, 2015
Update for SlideshowFx version 6.13.02
(Support background music / Upgrade from Trial to Pro version).
Old Picasa Oauth 1.0 removed (no more supported by Google).
21
June 23rd, 2015
Add tips related to Admin Tool use with SlideshowFx API.
22
July 12th, 2015
23
August 1st, 2015
24
August 30th, 2015
25
October 18th, 2015
26
December 30th, 2015
Update for SlideshowFx version 6.14.00
(New justified layout).
Update for SlideshowFx version 6.15.00
(Widgetkit Integration)
Update for SlideshowFx version 6.16.00
(Piwigo Integration)
Update for SlideshowFx version 6.18.00
(OneDrive Integration)
Link to YouTube tutorials added.
27
February 13th, 2016
28
April 2nd, 2016
SlideshowFx User Guide
Update for SlideshowFx version 6.20.00
(Enhancement of WidgetKit Integration)
List of advanced Slideshow parameters added.
Page 68

Documents pareils