Google Plus Photo And Youtube Video Gallery Plugin with jQuery

Google Plus Photo And Youtube Video Gallery Plugin with jQuery
File Size: 51.5 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

An easy-to-use jQuery plugin used to display your Google Plus photos or Youtube videos in a fully loaded, responsive content gallery.

See also:

How to use it:

1. Load jQuery library and the exceptioPhotoGallery.js script in the document.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>	
<script src="exceptioGoogleGallery.js"></script>	

2. Create an empty container to place the Google Plus photo gallery.

<div class="test"></div>

3. Call the plugin on the container you just created and insert your Google Plus user ID.

$('.test').exceptioGoogleGallery({

'galleryUserId' : 'Your Google ID'

});

4. Available options to customize your Google Plus photo gallery.

$('.test').exceptioGoogleGallery({

// youtube or photo  
type : 'photo', 

// gallery width
galleryWidth : '100%', 

// if you wish to add additional class in wrapper
wrapClass : null, 

// shows message if no content found
emptyMessage : 'No Content Found', 

// album/youtube title to hide eg. ["x","y","z"]
hideContent : [], 

// your google id
galleryUserId : 'your google id', 

// google console api key
galleryUserApiKey : '', 

photoCommentsCSS : {'margin':'0 auto','width':'60%','text-align':'left'},
photoViewMainDivNextText : 'Next',
photoViewMainDivNextClass : '',
photoViewMainDivPrevText : 'Prev',
photoViewMainDivPrevClass : '',

// root gallery text
albumRootText: 'Exceptio Google Gallery', 

// album breadcrumb css
albumBreadcrumbCSS: {},

// album breadcrumb arrow
albumBreadcrumbArrow: '<span> &lt;= </span>', 

// album breadcrumb span css
albumBreadcrumbSpanCSS: {'color':'#000','cursor':'pointer'}, 

albumTitleCSS: '',

// album background color
backgroundAlbum: 'rgb(0,0,0)',

// album hover background color
backgroundAlbumHover: 'rgba(0,0,0,0.9)', 

// gallery background color
backgroundGallery: 'rgb(0,0,0)', 

// item popup background color
backgroundPopup: 'rgba(0,0,0,0.6)', 

// photo preview close text
photoPreviewCloseText : 'Close&nbsp;&nbsp;&nbsp;',

// you can define number of album load in first place
hideMoreThen : 0, 
hideMoreThenBack : 0,

// you can define imagepath with name
loadingImage : 'loader.gif', 

// text for load more options
loadMoreText : 'Load More..', 

//text for load less options
loadLessText : 'Load Less..', 

// css for load more options
loadMoreCSS : {'cursor':'pointer'}, 

// exec before Gallery Show
onGalleryEnter : function(){}, 

//exec after Photo Show
onGalleryPhoto : function(){} 

});

Changelog:

2018-10-01

  • Added hide content option

2015-05-21

  • fix window resize albums are duplicated

2015-04-20

  • fix youtube for firefox

2015-04-16

  • height fix for youtube

2015-04-05

  • changed channelId to playlistId

2015-04-04

  • small fix

2015-03-31

  • load more fix

2015-03-03

  • small fix

2015-03-02

  • fix thumb for youtube

2015-01-16

  • Added breadcrumb, added new config in options
  • Added breadcrumb arrow customize options
  • Update exceptioGoogleGallery.min.js

2015-01-14

  • Fix v-align for image

2015-01-09

  • update

2015-01-07

  • Fixed bugs.

2015-01-06

  • Tweak styles.

2015-01-05

  • fixed bugs

This awesome jQuery plugin is developed by azcpavel. For more Advanced Usages, please check the demo page or visit the official website.