What is Social Tabs
Social Tabs is developed by JoomlaUX to bring you a helpful & effective solution in connecting, updating information directly from different social pages to your website. Social Tabs brings you a brand new & fresh experience in presenting updates from popular social pages. Your site’s visitors won’t waste their time to browse another tab so they can view, get updates & interact (like, follow, share, etc) with your social pages. With Social Tabs, all these activities can be done directly on your site. More importantly, the display & arrangement of Social Tabs on your site is totally sophisticated, logic and not space-consuming. Social Tabs is exactly your right choice to replace the current & mainstream social buttons which are less efficient & not flexible.
Definitions, Abbreviations and Acronyms
|
|
|
1 | Joomla | The most popular Open Source Content Management System, written by PHP. |
2 | Facebook social network | |
3 | Facebook Likebox | Facebook like |
4 | Facebook Recommendation | Facebook recommendation |
5 | Twitter social network | |
6 | Google+ | Google+ social network |
7 | Pinterest social network | |
8 | RSS Feed | RSS Feed social network |
9 | Youtube | Youtube social network |
10 | LinkedIn social network | |
11 | Instagram social network | |
12 | Vimeo | Vimeo social network |
13 | Flickr | Flickr social network |
14 | Stumbleupon | Stumbleupon social network |
15 | Tumblr | Tumblr social network |
16 | Delicious | Delicious social network |
17 | Digg | Digg social network |
18 | Last.fm | Last.fm social network |
19 | Dribbble | Dribbble social network |
20 | deviantART | deviantART social network |
Social Tabs has several system requirements as follow:
You have to ensure that your system has already installed, XML and Zlib-Support built into your PHP.
PHP should be compiled with support for https (openSSL) and cURL.
PHP Safe Mode should be turned off.
This module can run well on major browsers such as: Internet Explorer (version 10+), Firefox, Chrome, Opera 9+, and Safari. JavaScript must be activated.
After purchasing our product, you’ll see the download link at Social Tabs product page:
http://www.joomlaux.com/download.html
Note: If there is any problem, please contact us at: http://www.joomlaux.com/support/contact-us.html
Package
After download the extension you will received an installation package named:
Module |
mod_jux_social_tabs.zip |
Module Installation
Go to Administrator site => “Extension” => “Extension Manager” in the Top Menu.
In “Upload Package File” block, please Upload & Install our extensions:
Figure 1: Tab module
Display Type |
Sliding Tabs: the social tabs display as a slider. |
Floating Module |
Choose Floating or not, You can make it always on the top, middle or bottom of the Brower. If not, it'll display as a normal module in a module position. ( NOTE: Only show when choose Sliding Tabs type) |
Display Location |
The social tabs will display at the chosen location and with an align number in pixcel.(NOTE: Only show when choose Sliding Tabs type) |
Close Tab By |
Click Anywhere: hide social tabs by clicking anywhere on webpage. |
Load Open |
Yes: Social Tabs automatically open at the first time when they're loaded. No: keep hiding until user clicks on a tab.(NOTE: Only show when choose Sliding Tabs type). |
Default Tab Index |
Default will be focused by default |
Width(px) |
Width of Social Content box |
Height(px) |
Height of Social Content box |
Offset |
Offset is the space between our Social Content box and outside box |
Content Rotate Time |
Interval time before rotate social data |
Content Rotate Direction |
Direction to rotate Social dât (Up/Down) |
Enable jQuery |
On/Off jQuery loader. Turn it off if your site already have jQuery loaded. |
Enable noConflic |
On/Off noConflict. Turn it on to prevent conflict with Joomla's Mootools. |
Figure 2: Configure of Facebook
Facebook ID |
Facebook ID is the name represent your account |
Title |
Title of this tab. Leave it blank for not include title |
Follow Button |
Text of the Follow Button. If rmpty the follow button will be omitted |
Limit |
Maximum number of result |
Step 1:please go to your Facebook page. example:https://www.facebook.com/Joomlaux
Step 2: copy facebook name as image below:
Figure 4: Configure of Facebook likebox
Facebook Account |
Your facebook account |
Show Stream |
Select Yes to show your facebook stream |
Show Header |
Select Yes to show "find us on facebook" header |
limit |
Maximum number of result |
Figure 17: Configuration of Twitter
Twitter ID |
Your Twitter's Username |
Consumer Key |
Consumer Key Twitter |
Consumer Secret |
Consumer Secret Twitter |
Access Token |
Access Token Twitter |
Access Token Secret |
Access Token Secret Twitter |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Show Avatar |
Show Twitter User Avatar in each Tweet. |
Include Retweets |
Include native Retweets in your displayed Timeline. |
Include Replies |
Include Replies in your displayed Timeline. |
Limit |
Maximum number of result |
Step 1: Go to Twitter Apps (http://dev.twitter.com/apps) and follow steps below:
Step2: Create new application
Step 3: Fill application form
Step 4: Agree and submit the form
Step 5: Use Keys to setup your twitter
Figure 4: Configuration of Google+
Google+ ID |
Google+ ID is the number represent your account. |
Google+ API Key |
Your Google+ API Key |
Title |
Title of this Tab. Leave it blank for not included Title |
Follow Button |
Text of the Follow Button. If empty the follow button will be omited |
Limit |
Maximum number of result |
Your Google+ ID for your profiles is the long string of numbers present in the URL of our profile. Here’s a screenshot:
The Google + feed requires an API key. Fortunately creating your own google API key is fairly quick and easy:
Figure 5: Configuration of Pinterest
Pinterest ID |
Enter your pinterest name |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your pinterest site and copy pinterest name as image below:
Example:
Figure 6: Configuration of RSS Feed
RSS Link |
Link to your RSS |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Figure 7: Configuration of youtube
Channel ID |
Selected Channel ID to display |
User ID |
Your youtube Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Subcribe Button |
Show or Hide Your youtube Subscribe button |
Limit |
Maximum number of result |
Please go to your youtube, login and check account advanced Click here
You will see infomation as image below:
Figure 8: Configuration of Linkedln
Linkedln ID |
Linkedln user public profile URL(NOTE: only support for company) |
Please go to: https://www.linkedin.com and login, you can find company,that want,after copy linkedln name as image below:
Example:
Figure 9: Configuration of Instagram
Instagram ID |
Instagram ID is the numeric represents your account. Please read our document if you don't know how to find it. |
Access Token |
Access Token for Instagram API |
Title |
Title of this Tab. Leave it blank for not included Title. |
Limit |
Maximum number of result. |
Instagram ID is the numeric represents your account. If you don’t know how to get it, please do these steps:
1. Go to this link .
Please click "Generate Access token" as image below:
2. Input your username and password. You’ll get your access_token:
After when you access your instagram, You get access_tokken user ID as image below:
Figure 10: Configuration of Vimeo
Vimeo ID |
Your Vimeo Username. |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your Vimeo site and copy Vimeo name as image below:
Example:
Figure 11: Configuration of Flickr
Flickr ID |
Flickr ID is the string of letters represents your account. Please read our document if you don't know how to find it. |
Title |
Title of this Tab. Leave it blank for not includes Title |
Limit |
Maximum number of result |
Flickr ID is the ID represents your account. It has the format: xxxxx@N0x. If you don’t know how to get it, please do these steps:
Figure 12: Configuration of Stumbleupon
Stumbleupon ID |
Your Stumbleupon Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your Stumbleupon site and copy Stumbleupon name as image below:
Example:
Figure 13: Configuration of Tumblr
Tumblr ID |
Your Tumblr Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your Tumblr site and copy Tumblr name as image below:
Example:
Figure 14: Configuration of Delicious
Delicious ID |
Your Delicious Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your Delicious site and copy Delicious name as image below:
Example:
Figure 15: Configuration of Last.fm
Last.fm ID |
Your Last.fm Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Limit |
Maximum number of result |
Please go to your Last.fm site and copy Last.fm name as image below:
Example:
Figure 16: Configuration of Dribbble
Dribbble ID |
Your Dribbble Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your Dribbble site and copy Dribbble name as image below:
Example:
Figure 17: Configuration of deviantART
deviantART ID |
Your deviantART Username |
Title |
Title of this Tab. Leave it blank for not includes Title |
Follow Button |
Text of the follow Button. If empty the follow button will be omitted |
Limit |
Maximum number of result |
Please go to your deviantART site and copy deviantART name as image below:
Example:
You must choose :
Floating Module => Yes (Floating in Webpage)
Floating Module => Yes (Floating in Webpage)
Floating Module => Yes (Floating in Webpage)
Floating Module => Yes (Floating in Webpage)
Floating Module => Yes (Floating in Webpage)
Floating Module => Yes (Floating in Webpage)
Display Type => Static Tabs
The Tabs will display as static box in the Position of Joomla template that it is placed.