Use custom icons

Hi @aviarts,
thanks for posting your issue.

I tried to replicate the bug on my own but with no luck.
Here the steps I followed:

1) Changed the gif I found in /public/img/ – I just changed the background color.
2) Unchecked the “Use SVG” option in admin.

I see my gif loaded instead of the default one.

The code you mention:

I then set the plug-in to debug mode and did some checking in the jquery.swipebox.js file and found that plugin.settings.useSVG is true at line 172 eventhough the Use SVG icons check box. is unchecked. (The value for useSVG is 0 in easySwipeBox_lightbox option in wp database)

// jquery.swipebox.js
build: function()
…
alert(plugin.settings.useSVG); // returns true even though use SVG is unchecked
if ( supportSVG && plugin.settings.useSVG === true )

This is the javascript core default:
if you alert the plugin.settings.useSVGwill always show true.
The settings are overwritten later in /public/js/jquery.init.js using the values stored in the database.

Could you please copy and paste here the content of easySwipeBox_localize_init_var?
You find it in the HTML of every page of your website.

Could you also copy and paste the value stored in your database?

Thank you!

thanks for your help and prompt response.

This is what I see when Use SVG Icons is “unchecked”

Here is the database option value:
easySwipeBox_lightbox

a:9:{s:6:”useCSS”;b:1;s:6:”useSVG”;b:0;s:18:”removeBarsOnMobile”;b:1;s:23:”hideCloseButtonOnMobile”;b:0;s:13:”hideBarsDelay”;i:3000;s:13:”videoMaxWidth”;i:1140;s:10:”vimeoColor”;s:7:”#cccccc”;s:9:”loopAtEnd”;b:1;s:14:”autoplayVideos”;b:0;}

Here is the value of easySwipeBox_localize_init_var as it appears in the HTML

var easySwipeBox_localize_init_var = {“lightbox”:{“useCSS”:true,”useSVG”:false,”removeBarsOnMobile”:true,”hideCloseButtonOnMobile”:false,”hideBarsDelay”:3000,”videoMaxWidth”:1140,”vimeoColor”:”cccccc”,”loopAtEnd”:true,”autoplayVideos”:false},”autodetect”:{“autodetectImage”:false,”autodetectVideo”:false,”autodetectExclude”:”.no-swipebox”}};

Here is what I see when Use SVG Icons is checked:

a:9:{s:6:”useCSS”;b:1;s:6:”useSVG”;b:1;s:18:”removeBarsOnMobile”;b:1;s:23:”hideCloseButtonOnMobile”;b:0;s:13:”hideBarsDelay”;i:3000;s:13:”videoMaxWidth”;i:1140;s:10:”vimeoColor”;s:7:”#cccccc”;s:9:”loopAtEnd”;b:1;s:14:”autoplayVideos”;b:0;}

var easySwipeBox_localize_init_var = {“lightbox”:{“useCSS”:true,”useSVG”:true,”removeBarsOnMobile”:true,”hideCloseButtonOnMobile”:false,”hideBarsDelay”:3000,”videoMaxWidth”:1140,”vimeoColor”:”cccccc”,”loopAtEnd”:true,”autoplayVideos”:false},”autodetect”:{“autodetectImage”:false,”autodetectVideo”:false,”autodetectExclude”:”.no-swipebox”}};

So, it looks like the init.js script is getting the value from the database correctly.

However, I still only get the SVG image regardless of checking or unchecking the Use SVG box. Any other debugging suggestions?

Thanks @aviarts,
the values in the database look right.
I know it sounds stupid but could you try to empty the browser cache?

Please let me know.