Discussion on Flow Gallery - HTML5 Multimedia Gallery


cosmocoder supports this item


166 comments found.

Hi. I had some problems with an other code that use php_exif in PHP extensions…. Do your code use this extensions?


The gallery uses PHP’s exif implementation to pull exif info.

is it possible disable it?

You only have to enable the exif feature if you need to pull exif data from photos, which is disabled by default.

I implemented a simple web application with html page and copied all the contents e-g js/css/images /icons/media/media elements/fonts/bootstrap-lib that was provided with the plugin and it worked properly. But when I copied all the contents into SharePoint web application with Windows authentication,I noticed that HTML page is also unable to load. The page keeps on showing the loader, However I also changed the approach and instead of providing the ConfigUrl I provided the contents from config-albums.json directly into ConfigData parameter.again the simple web application worked properly but SharePoint application failed.

Kindly provide me needful help

I need a link to your page to inspect the problem.

Dear Cosmocoder Team, I need to use the ConfigData in order to load my albums, but couldn’t find any example for this. Will you please help me out how can I pass JavaScript object in ConfigData. Sharing my simple Json with you.

{ “albums”: [{ “title”: “album2”, “items”: [{ “type”: “photo”, “category”: “Category One”, “thumbnail”: “http://Localhost/PhotoVideoGallery/album2/_t/Hydrangeas_jpg.jpg”, “source”: “http://Localhost/PhotoVideoGallery/album2/Hydrangeas.jpg”, “title”: “Hydrangeas EN”, “description”: ””, }, { “type”: “photo”, “category”: “Category One”, “thumbnail”: “http://Localhost/PhotoVideoGallery/album2/_t/img-magazine-banner_png.jpg”, “source”: “http://Localhost/PhotoVideoGallery/album2/img-magazine-banner.png”, “title”: “img-magazine-banner”, “description”: ””, }, { “type”: “photo”, “category”: “Category One”, “thumbnail”: “http://Localhost/PhotoVideoGallery/album2/_t/img-user_png.jpg”, “source”: “http://Localhost/PhotoVideoGallery/album2/img-user.png”, “title”: “img-user1”, “description”: ””, }, ] }, { “title”: “album”, “items”: [{ “type”: “photo”, “category”: “Category One”, “thumbnail”: “http://Localhost/PhotoVideoGallery/album/_t/Desert_jpg.jpg”, “source”: “http://Localhost/PhotoVideoGallery/album/Desert.jpg”, “title”: “Desert EN”, “description”: ””, }, { “type”: “audio”, “thumbnail”: ”/_layouts/images/icgen.gif”, “mp3”: “http://Localhost/PhotoVideoGallery/album/hangout_dingtone.m4a.mp3”, “ogg”: “http://Localhost/PhotoVideoGallery/album/hangout_dingtone.m4a.ogg”, “title”: “hangout_dingtone.m4a”, “description”: “hangout_dingtone.m4a” }, { “type”: “video”, “thumbnail”: ” http://Localhost/PhotoVideoGallery/album/2935_1396/Preview%20Images/2935_1396_mp4.png", “mp4”: “http://Localhost/PhotoVideoGallery/album/2935_1396/2935_1396.mp4”, “ogv”: “http://Localhost/PhotoVideoGallery/album/2935_1396/2935_1396.ogv”, “webm”: “http://Localhost/PhotoVideoGallery/album/2935_1396/2935_1396.webm”, “title”: “2935_1396”, “description”: “description”, }, ] }, ] }

Please don’t dump a large chunk of code in the comments section. Contact me through my profile page message box for such cases.

The structure of the javascript object has to be in the exact form as the json. If you are not familiar with the formatting differences between json and a javascript object then just use jQuery’s $.parseJSON method to get the required js object.

Hello, I have a problem on my website with plug in. The thumbnails are not displayed, appears src=”false” in the code and I checked all settings and test on another website with the same configuration and the other web site if it works.

website which does not work: website where if it works:

Both have the same configuration.

This is the comments section for the standalone gallery. Please post your comment in the comments section of the WP plugin version of the gallery.

Hello, I have a problem on my website with plug in. The thumbnails are not displayed, appears src=”false” in the code and I checked all settings and test on another website with the same configuration and the other web site if it works.

website which does not work: website where if it works:

Both have the same configuration.

Hi! I bought “flowgallery script” and I copied it on my web server, in order to understand how to integrate it into my site . But it does not work!! So I copied the ” Demos” folder on my site hosted and still NOT WORK !! What should I do? The link is

Most of the provided demos include Youtube items so you need to provide a Youtube API key. If you don’t need Youtube items in your galleries then remove them and the gallery will work fine.

Thank you for the answer. Can you send me (a link is enough) an example of scanPhotoFolder please?

Thanks in advance!

As has been mentioned in the documentation, there is a parameter called scanPhotoFolder which when set to true enables scanning, and then you need to pass the path to the folder to the photoFolder parameter. If you still can’t get to work then I will need a link to your page.

The “php” folder provided with the package is not in the correct path. If that folder is not in the default location then you need to specify the correct path when initializing the gallery (see the documentation).

App is file but there is very important issue. Video (from youtube, vimeo) can not be played in full screen size. Could you please fix it? Or any instructions how it can be fixed?

I will investigate this.

Did you download the latest version? Because this issue is not there in the latest version.

Yes, you right, it not present in the latest version, sorry for bothering you.

Can this component function with the PHP part of the code? My project is based on Django.


Yes, it will if you disable all the plugin features that depend on php.

Hi. First of all, thanks for a great plugin! I have a problem though, on the last row of the grid I have a gap between two images, but it seems to only appear when it’s showing 6 images in the grid (6 columns).

You can see the problem here:

Also if you resize so that it uses less than 6 columns, the problem seems to disappear.

Please let me know if you need more information.


I checked out the gallery and don’t see any extra gap between the images in the last row, and everything is perfectly aligned.

Hm.. that’s odd. When I check now, everything is in order. Oh, well.. I guess I don’t have a problem after all :) Thanks.

Hi author can you email me at my personal email I’m developing a social media site and want to allow all members to be able to share their pictures in a shared album for all. Can you email me and explain the possibilities of making this happen?

Please contact me through the message box in my profile page –

How can i use external link for my video

how can i use external video link

You may need to use the QTIndexSwapper utility, mentioned in the documentation, on your video files.

bur there is no direction on how to use QTIndexSwapper

You will find the directions on the utility’s website (you just need to load the file in the app).

Thumbnails are not changing size according to the width I enter in backend. They are remaining 260px wide when I specify 350px.


btw, i purchased the plugin.

It seems that you purchased the WP plugin version of Flow Gallery.

Hi, I wanna ask is it possible to make albums to load chunks?

Yup…will it be complicated if I wish to customize the albums screen to support chunking?

Yes, it will be a bit complicated. But if you are comfortable with coding javascript then you can make an attempt.

Just realized I am using Wordpress version…for Wordpress if I wish to customize which file should I modify?

Hi, I have just purchased Flow Gallery, and have found it seems to be reliant on a JSON file to list the images. I am using a CMS (MODX) and wanted to use phpThumbOf for creating thumbnail images and the CMS for adding images, captions, links etc. I have never used JSON before, is it possible to to do what I want with Flow Gallery? And if so, can you give me any direction on this as I have no idea. I thought this was just a jQuery based plugin. Many thanks.

OK, it’s kind of working now, I found that the large thumbnail was causing the loading problem. However, the thumbnails are rendering poorly, I think because the script seems to only enlarge the thumbnails to fit rather than reduce to fit. The shortest row-height seems to be set by the thumbnail height, other rows can only be taller therefore enlarging the thumbnails, I need to work the other way around, i.e thumbnails can be reduced but not enlarged and the maximum row height is either the thumbnail height, or set as a value in the options, this will give much better quality images. Is there any way to set a maximum row height so that the thumbnails can be reduced to fit? Once again, thank you for persisting with this :) P.S. I couldn’t find what dependency was missing.

The row height will always be needed to be calculated dynamically based on available thumbnail sizes, so you cannot pass a row height yourself. Do you get the scaling issue if you use the thumbnail images provided in the demos?

Yes, as they do in your rows demo page, the piano, the bird the cello etc. Ultimately, I guess this is a limitation of how this script works, so I will be looking at alternatives that handle this better. It will work well where all the thumbnails are the same size and proportion or with columns where height isn’t an issue, which I may still do for the home page. I won’t be asking for a refund though, your support has been great and I really appreciate it, and I have learnt about json. Thank you :)

Hi! I think I have everything implemented correctly but the main-grid is not populating from the json…. I am also these errors: (anonymous function) jquery.flowgallery.min.js:5i jquery-1.12.4.min.js:2j.fireWith jquery-1.12.4.min.js:2y jquery-1.12.4.min.js:4b.onload.b.onreadystatechange @ jquery-1.12.4.min.js:4 jquery-1.12.4.min.js:2 Uncaught Error: Syntax error, unrecognized expression: a[href^=#]fa.error jquery-1.12.4.min.js:2fa.tokenize jquery-1.12.4.min.js:2fa jquery-1.12.4.min.js:2n.fn.extend.find jquery-1.12.4.min.js:2n.fn.init jquery-1.12.4.min.js:2n jquery-1.12.4.min.js:2(anonymous function) main.js:213

Please help! the link is

I see that you have not purchased this item. Did you purchase the WP Plugin version?

sorry i purchased it under a different account: seanbdevine…. i can send you the purchase code if you need

this is the account i purchased it under

Ok Im down to just these two errors but the same functionality: jquery.flowgallery.js:397 Uncaught TypeError: Cannot read property ‘0’ of undefined(anonymous function) jquery.flowgallery.js:397i jquery-1.12.4.min.js:2j.fireWith jquery-1.12.4.min.js:2y jquery-1.12.4.min.js:4b.onload.b.onreadystatechange @ jquery-1.12.4.min.js:4

You haven’t provided a Youtube API key, which is needed for pulling data for Youtube videos. See the documentation for details

FYI when i remove: if( self.options.useYoutubeThumbs ) { galleryData[i].thumbnail = ytdata.items0.snippet.thumbnails.medium.url; }

if( !item.title ) {
    galleryData[i].title = ytdata.items[0].snippet.title;
if( !item.description ) {
    galleryData[i].description = ytdata.items[0].snippet.description;

from line 397 inside jquery.flowgallery.js it seems to work to a certain degree but not sure why the conflict

I was doing a routine check up on my website and noticed that my instagram posts were no longer showing up in my flow gallery social wall. The sort button at the top isn’t there anymore either. It worked just fine two days ago and I haven’t changed a thing. Please help.

Did someone else purchase this for you? Please ask that person to post this comment.

Sorry wrong plugin. You can delete this.

Dear Sir, I have uploaded the APP into expression web 4 : when I click index.html we see the page correctly . If I clik WITH COLUMNS … this show only preloader .. for 6 of option seems work only : Custom Sorting - Show EXIF Data Thank you in advance for kind support Best Regards

If the gallery instance contains Youtube video items, then ensure that you have provided a valid Youtube API key.

Hi, I did buy this product. but when i am running the rows-nojustify.html page on local, i am getting error and it is not running. Error details on console are like below

2jquery.flowgallery.min.js:5 Uncaught TypeError: Cannot read property ‘0’ of undefined(anonymous function) jquery.flowgallery.min.js:5i jquery.min.js:2fireWith jquery.min.js:2y jquery.min.js:4b.onload.b.onreadystatechange @ jquery.min.js:4

Does your gallery have Youtube items? If it does then you need to provide a valid Youtube API key. If this does not solve the issue then I need a link to your page to inspect the problem.