1. Start
  2. Quick Start Guide
  3. Installing the Plugin Via FTP
  4. Configuring the plugin
  5. Settings: General
    1. 1. Mode & CSS Selectors
    2. 2. General Settings
    3. 3. Social Gallery Pages
    4. 4. Earn 30% Commision
  6. Settings: Style
    1. 1. Social Gallery Theme
    2. 2. Margins and Navigation
    3. 3. Social Header
    4. 4. Show Image Title as Description
    5. 5. Picture Bar
    6. 6. Lightbox Background
    7. 7.  CSS 3 Animation  Effects
  7. Settings: Social
    1. 1. Share Buttons
    2. 2. Include Scripts
  8. Settings: Comments
    1. 1. Comments Settings: Facebook
    2. 2.  Comment Settings: Disqus
  9. Settings: Adverts
  10. Upgrading Social Gallery
  11. CSS Selector Examples
  12. Anatomy of Social Gallery
  13. Further Help & Support
    1. Support:
    2. Useful Links:
    3. News, Updates and Improvements:
  14. Change Log
  15. Compatible Plugins & Themes
Social Gallery Plugin

Social Gallery Lite

The Free Ultimate Social Lightbox for Wordpress


Thanks for downloading the Lite (free) version of Social Gallery Pro, if you like the plugin please do rate it on WordPress.org or buy the full version at SocialGalleryPlugin.com.

Thanks for using Social Gallery Lite!

Quick Start Guide


This Quick Start Guide will walk you through the basics of the Social Gallery Wordpress Plugin. By the end of this guide you will have Social Gallery installed and your post images should be showing up in Social Gallery style.

Tip: If you need to take a closer look at any of the images in this quick start guide, you can click on them to see the full size version!

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

1. Log into your WordPress blog admin area

Log in to WordPress

2. Once logged in click "Plugins" on the left hand menu (if you don't have a "plugins" option you will have to ask a blog administrator to do this and the following steps!)

Click "Plugins"

3. Once on the "Plugins" page click the "Add New" button in the top middle of the page:

4. On the next page "Install Plugins", click the "Upload" link as indicated by the red arrow in this screenshot:

Click Upload

5. On the next page you will be asked to "Choose File" - Click this button and here you must select the SocialGallery .zip you have downloaded from Code Canyon, once you have selected that .zip file Click "Install Now":

6. The next page will be entitled "Installing Plugin From Uploaded File: SocialGallery.zip" on this page click "Activate Plugin":

7. Once you have clicked "Activate plugin" you will see a screen similar to the next image, with a yellow "Plugin Activated" message and a new menu item "Social Gallery" (as highlighted with the two red arrows.)

8. Congratulations, Social Gallery is now installed! 

9. Click Social Gallery from the left hand menu, which will load the Social Gallery Lite Install Wizard which will guide you through the required steps to set up Social Gallery.

9.1 - Install Wizard: 1. Your Social Gallery

This first step in the wizard requires you to enter your and email and the choice to get email updates when there's updates. Clicking next step takes you on to the next step.

9.2. Install Wizard: 2. Social Gallery Selectors

This second step tells Social Gallery which images you want it to load for. You can choose from a number of preset modes or you can specify a specific CSS selector. As advised on the page, its often best to start with a preset mode - and only use a Custom CSS selector if your themes customisations cause issues. Click Next Step.

 

9.3. Install Wizard: 3. Social Gallery Pages

Only available in the Full Version.

Read more about Social Gallery Pages.

9.4. Install Wizard: 3. Complete

That's it! Congratulations, you now have Social Gallery Lite installed! You'll now see the final install wizard screen which looks like the following image.

You can leave Social Gallery right here and in 90% of cases it'll all just work. Some custom themes & blog setups require a little more config, we recommend you follow step 9.5 below as a minimum to get yourself started. Remember - if you hit any problems please do come over and join in on the forum!

Note: Support forum is only for users who have purchased a copy of Social Gallery Pro.

9.5. Add your own header image

The best part about Social Gallery is its customisation options. You can find all of these (50+) settings under "Settings" from within Social Gallery. Lets set our own header image shall we?

9.5.a. Load Settings by clicking "Social Gallery --> Settings" from the left hand menu

9.5.b. Click "Style" from the left hand menu, then the "Upload Image" button (as highlighted below with a red arrow.)

9.5.c.  A normal WordPress image upload window will appear as in the next image, select your logo from your computer by dropping it on the dashed rectangle area or clicking "Select Files" and finding your logo file.

9.5.d. This will upload your image and you will be presented with a dialog like the following, scroll down to the bottom and click "Insert into Post"

9.5.e. This will take you back to the config screen and populate the logo URL into the box. All you need to do now is scroll to the bottom of the page and click "Save Config"

That's it for our Quick Start guide! If you have followed all of these steps Social Gallery is now installed, you can start enjoying greater visitor engagement with your blog post images! 

If you wish to further tweak this plugin please see the other sections in this help guide which will guide you through the options available.

Thanks for using Social Gallery!

Installing the Plugin Via FTP


It’s very quick and easy to install the Social Gallery Wordpress Plugin, simply follow these 4 steps:

1.     Unzip your download and put the “SocialGalleryLite” folder somewhere memorable

2.     Upload the “SocialGalleryLite” folder into your Wordpress plugins folder

3.     Once fully uploaded you will see the Social Gallery Lite plugin on your plugin’s screen, click “Activate” under its title.

4.     After activating Social Gallery Lite a new menu item will be added to your side bar. Clicking “Social Gallery” from your side bar will let you configure the plugin.

5.     That's it. You can now follow the wizard and then you're good to go!

If you have any problems installing our plugin please do read this great guide from Wordpress or alternatively read our Quick Start Guide

Configuring the plugin


The Social Gallery Lite Plugin starts working as soon as you have installed it, for a lot of users no configuration will ever be necessary. However if you want to turn off or on specific parts of the plugin or tweak it you have several options.

Before we look at each of the options please take a look at this key, it explains the names we will use to refer to each part of the Social Gallery viewer.

Social Gallery Key:

Social Gallery Plugin Key

The options are discussed in more detail below, all of the following options are available for tweaking on the “Social Gallery” admin page, accessible by clicking Social Gallery from the admin screen:

 

For your ease the settings are split  up into sections, each section has a corresponding help guide. Please click through the help guides using the navigation to the left. You will find more resources on Social Gallery Plugin.com and in the forums [pro users only.]

Social Gallery v2.0 Settings

Settings: General


Social Gallery: Settings: General

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

1. Mode & CSS Selectors

The first option on the configuration screen lets you choose which images Social Gallery should work on (images which when clicked should load into Social Gallery.) Here you have several options:

 

Which Images to use Social Gallery Plugin for

“All Content Images” matches any image wrapped inside a link in your post. That is any linked image inside a WordPress content wrapper, if you have a custom theme this option may or may not work, if it does not try one of the other modes which are more adapted for multi-theme compatibility.

"Post Images" - This setting activates Social Gallery for any linked image within a WordPress post. As with the previous option this will work if your theme has a standardised WordPress selector.

"Page Images" - This setting activates Social Gallery for any linked image within a WordPress page. As with the previous option this will work if your theme has a standardised WordPress selector.

"Compatibility Mode" - Designed to integrate with over 100 of the most popular custom WordPress themes, Social Galleries Compatibility Mode adapts to apply Social Gallery to the linked images within your posts and pages. If the other options do not work you can use this mode to enable Social Gallery.

"Gallery Compatibility Mode" - Only available in the Full Version.

"Justified Image Grid" - Only available in the Full Version.

"NextGen Compatibility Mode" - Only available in the Full Version.

"NextGen Thumbnails" - Only available in the Full Version.

"NextGen Widget Only" - Only available in the Full Version.

"NextGen Gallery Overview" - Only available in the Full Version.

“Specific CSS Selector” – Choosing this option allows you to specify a specific CSS selector to apply Social Gallery too. If you only want a specific image or number of images to work with Social Gallery then this setting lets you specify these. An example of use would be if you had a specific gallery you wanted to enable the Social Gallery Plugin for then you could assign each linked image with the class “socialGalleryThis”, adding that class to this option would then enable Social Gallery for this class only.

 

 

A linked image HTML in this example:

A Linked Image HTML Example

…the corresponding option in the Social Gallery Configuration:

Adding a CSS selector Example

 

You can read more about this later in this document under “Anatomy of Social Gallery

 

 

"Disclude CSS Selector" - Only available in the Full Version.

2. General Settings

There are a number of general settings here, covering several aspects of Social Gallery. For most users the default selections will work fine.

"Facebook Admin ID's CSV" - Entering your Facebook ID(s) in this box will allow you administration rights over the comments put against your images.

"Include Swipe Gestures" - Only available in the Full Version.

"Fullscreen Mode" - Only available in the Full Version.

"Always Fullscreen Mode" - Only available in the Full Version.

"Enlarge Images By" - Social Gallery can allow your images to be enlarged by a factor, this setting defines the maximum enlargement allowed. This does not affect the way Social Gallery frames images, simply by what factor it will enlarge them if there is space to.

"Fallback URL Type" - Only available in the Full Version.

"Share my options" - Only available in the Full Version.

Only available in the Full Version.

4. Earn 30% Commision

Only available in the Full Version.

Settings: Style


Social Gallery: Settings: Style

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

Only available in the Full Version.
 

2. Margins and Navigation

"Gallery Margin" - This setting allows you to set the minimum margin between the Social Gallery viewer and the edge of the users screen.

"Show Previous/Next Navigation" - This switch enables/disables the visual navigation icons and navigation features of Social Gallery.

3. Social Header

 

Un-ticking “Show Social Header” hides the header.

The drop down allows you to select:

· Site Img & Link – this is the default, showing a small logo, the blog name and the blog bi-line underneath it.

· Site Link – this allows you to show just the blog name at the top of the sidebar.

· Custom HTML – this setting shows another text box and allows you to specify your own html to be shown in the header of the sidebar. *Note adding your own HTML may affect the way the plugin appears; please do check your changes after adding.

 

4. Show Image Title as Description

 

"Show Image Title as Description" - This tick box allows you to control whether or not the image title is shown as a “Picture Description”. For example, if this box is ticked (default) and the following image HTML was in a post:

Post HTML example

…the description shown against the image would be “Your Image Title”. Note that if you are using Social Gallery with Justified Image Grid, this setting is overriden. 

 

5. Picture Bar


"Show Picture Bar" - This switch enables/disables the visibility of the bar at the bottom of the images seen in Social Gallery.

"Picture Bar Title" - Only available in the Full Version.

"Show Image Download Link" - Only available in the Full Version.

 

6. Lightbox Background

 

Here you can set the background colour with any HTML HEX colour. You can generate the code for this here. The default for this plugin is black (000000.)

You can also set the opacity of the background. You can use any value between 0 and 1. 0 = transparent, 1 = non-transparent. The default for this plugin is 0.8.

 

 

7.  CSS 3 Animation  Effects

Only available in the Full Version.

Settings: Social


Social Gallery: Settings: Social

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

1. Share Buttons

 

Note: Social Gallery Lite only has the Facebook options from the above

Social Gallery Pro:

Social Gallery now ships with the capacity to share your images via Facebook, Twitter, Pinterest, Stumble Upon, Google Plus, Linked In & Tumblr. You can enable/disable each of these share buttons on this screen.

As of v2.0 it's not possible to re-arrange these buttons, this however has already been put in as a feature request and will be available for voting on in the forums.

2. Include Scripts

Note: Social Gallery Lite only has the option of including/discluding the facebook script here.

If you un-tick any of these while leaving the corresponding previous option ticked, you will need to include the appropriate script yourself (e.g. if you un-tick Facebook JavaScript here but you want to include Facebook like/send buttons or Facebook comments then you will need to have the Facebook connect JavaScript included elsewhere in your theme/blog.)

If you already have Facebook like/tweet/pin buttons on your website you may need to uncheck these. Otherwise you will not need to change anything here.

Settings: Comments


Social Gallery: Settings: Comments

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

 

1. Comments Settings: Facebook

To set up Social Gallery to use Facebook Comments (recommended) simply make sure the first switch is enabled. As it stands Social Gallery will now work. 

To get administration / moderation rights over your comments you can choose to enter a Facebook App ID here, or otherwise you can also enter your personal Facebook ID under General Settings.

 

2.  Comment Settings: Disqus

Only available in the Full Version.

Settings: Adverts


Social Gallery: Settings: Adverts

 

Note: Social Gallery Lite does not come with all the benefits of the full version, some of these options may not be enabled in Social Gallery Lite. To get all of the 50+ options Get Social Gallery Pro.

Using Adsense with Social Gallery

Only Social Gallery Pro is compatible with Adsense read about it here.

CSS Selector Examples


If you want to use the Social Gallery plugin with specific images then you may want to specify a CSS selector (as in B.1. of this guide.) The following show some examples of this feature in action:

 

A specific link class: “.socialGalleryThis”

A single image (by ID): “#socialGalleryThis”

All linked images within a classed object:  “.yourClass a:has(img)”

Further Help & Support


Support:

Note: No support available for Social Gallery Lite, this free plugin comes without any support guaranteed.

For Social Gallery Pro users support is available in the Social Gallery support forums, please do post any problems/questions you have there.

 

News, Updates and Improvements:

You can also read more about the plugin and subscribe to the updates newsletter @ SocialGalleryPlugin.com

Please do not hesitate to get in touch and tell us what you think of the plugin, we are always looking to improve our plugins and will take any improvement ideas you have into serious consideration.

 

 

Thanks again for using Social Gallery Lite.

Change Log


Here you will find changes between versions of the Social Gallery Lite plugin.


v2.0 - 12/01/2013 - Original Release


 

Compatible Plugins & Themes


Here you will find a growing list of plugins and themes which work with Social Gallery. Some of these will be themes and plugins that the Social Gallery community has recommended for use with Social Gallery, others will be ones thoroughly tested with Social Gallery. Please note that 99.9% of themes will work with Social Gallery, this list is simply tested themes and plugins.

 

Justified Image Grid v1.2 - This fantastic gallery is very popular for good reason. As of V1.4 Social Gallery has full integration with Justified Image Grid.

Justified Image Grid Works with Social Gallery v1.4 +

NextGen Gallery - Probably the most popular gallery plugin, NextGen offers a lot out of the box. As of V1.4 Social Gallery has a good chunk of integration with NextGen.

Compatible Themes

Sprout Magazine Theme v1.1

Sprout Magazine Theme for WordPress - Works with Social Gallery