Integrating Fresco JS with NextGen Gallery in WordPress

Last Updated: June 27, 2020 | Reading Time: < 1 minute

I recently love Fresco because of its simplicity, it’s great as alternative to lightbox. Also, Nextgen is my favorite WordPress gallery plugin available, it has powerfull features but I don’t really like it’s bundled “lightbox” in my opinion they are bulk, heavy, and overused. How we can connect them both, Fresco and NextGen?

If you are not familiar with coding, there are few simple steps to integrate Fresco into NextGen.

First of all, download fresco js to your local, unzip it, then upload fresco to your active theme.

Get to know the URL of the fresco.min.js file and fresco.min.css file. In my case it would be something like:

For CSS

yourdomain.com/wp-content/themes/simple-me/fresco/css/fresco/fresco.css

For JS

yourdomain.com/wp-content/themes/simple-me/fresco/js/fresco/fresco.js

On your activated NextGen plugin, go to NextGen >; Other Options

Select Lighbox Effects, select “Show Advanced Settings”.

Write down the URL to CSS and JS files, below is the example. add this line to the “code” field:

class='fresco' data-fresco-group='%PRO_LIGHTBOX_GALLERY_ID%'