-
AuthorPosts
-
March 28, 2014 at 3:04 am #244169
Any idea why Enfold with NexGen Gallery isn’t fading out the background unless the browser is resized in Chrome and Opera? Firefox and Safari seem good?
Pretty jarring with the caption not knocking out from the background behind it.
March 28, 2014 at 4:58 pm #244465Hey kork!
Can you post the link to your website so we can take a look?
Regards,
YigitMarch 28, 2014 at 5:35 pm #244488Can I send a link via email rather than having the URL in the forums?
March 28, 2014 at 5:50 pm #244494Hi!
You can make your post private by checking “Set as private reply (Only you and moderators will see the content of this post)” above Submit button
Regards,
YigitMarch 28, 2014 at 7:12 pm #244535This reply has been marked as private.March 28, 2014 at 7:28 pm #244540Looks like the issue exists with the main enfold theme as well…
http://kriesi.at/themes/enfold/shortcodes/gallery/
I click on the thumbnail and it shows the background… Close it and open it again and no background fade.
- This reply was modified 10 years, 8 months ago by kork.
March 29, 2014 at 7:46 am #244701Hi!
Thank you for the link. Unfortunately, the theme is not using the NextGen Gallery plugin. It is using the prettyPhoto lightbox plugin by default. If you want to add the NextGen Gallery and disable the default lightbox plugin, edit js > avia.js. Find this code on line 60:
//activates the prettyphoto lightbox $(container).avia_activate_lightbox({callback:'avia_lightbox_callback'});
Replace it with:
//activates the prettyphoto lightbox //$(container).avia_activate_lightbox({callback:'avia_lightbox_callback'});
Install the NextGen Gallery. You might encounter few incompatibility issues with the plugin so we suggest that you hire a freelance developer to fix them. For further customization, please visit Werkpress.
Best regards,
IsmaelMarch 29, 2014 at 2:18 pm #244761Hi Ismael. I appears that it has nothing to do with the Nexgen gallery.
It exhibits the exact same problem on the demo Enfold website at http://kriesi.at/themes/enfold/shortcodes/gallery/
I click on the thumbnail and it fades… Close it and open it again and no background fade.
Additionally, would there be a way to disable PrettyPhoto through the functions.php file? I’m using a child theme and don’t want to modify avia.js in case of future updates to the parent.
March 30, 2014 at 8:57 am #244990Hi!
Thank you for the info. If you’re talking about the black overlay background when you click on a thumbnail then I can see it on my end properly fading in and out. On what browser and OS are you testing this? I tested mine on Chrome Windows 8 and I think Firefox will function the same. If you want to modify avia.js on the child theme, add this on the child theme’s functions.php:
/* * Register frontend javascripts: */ if(!is_admin()) { add_action('wp_enqueue_scripts', 'avia_register_child_frontend_scripts', 100); } function avia_register_child_frontend_scripts() { $child_theme_url = get_stylesheet_directory_uri(); //register js wp_register_script( 'avia-default-child', $child_theme_url.'/js/avia.js', array('jquery'), 1, false ); wp_enqueue_script( 'avia-default-child' ); }
Create a js folder with avia.js file on it. I hope that helps.
Best regards,
IsmaelMarch 30, 2014 at 9:26 pm #245197Hi Ismael,
Chrome and Opera on Mac OSX Mavericks shows the issue. FF and Safari both work fine. On the default Enfold theme mentioned above, it’s only the second time the modal box is open and closed. It doesn’t do it initially.
March 31, 2014 at 1:02 am #245250Hmmm, Also, the above code in the function.php file didn’t work either. I did take the avia.js file and put it in the child themes js folder.
April 2, 2014 at 9:55 am #246439Hi!
The code Ismael posted will not replace the default avia.js file but it just loads a custom avia.js file in addition to the default file. If you want to replace the default avia.js file with a custom version insert this code:
if(!is_admin()) add_action('wp_enqueue_scripts', 'avia_register_child_frontend_scripts', 100); function avia_register_child_frontend_scripts() { $child_theme_url = get_stylesheet_directory_uri(); wp_dequeue_script('avia-default'); //register js wp_register_script( 'avia-default-child', $child_theme_url.'/js/avia.js', array('jquery'), 1, true); wp_enqueue_script( 'avia-default-child' ); }
into your child theme functions,php file and then place the custom avia.js file into your child theme folder (url path must be wp-content/themes/enfold-child/js/avia.js ).
Cheers!
PeterApril 2, 2014 at 2:09 pm #246529Hi Peter,
Sorry, I’m confused. Ideally, I don’t want to replace the default avia.js file in its entirety for a single line of commented out code. I’d rather just use Ismael’s solution if it’s just going to append the single line of code.
That said, my child theme folder is not named as the default. Is that why the modifications are not taking effect? How would I go about this keeping the child theme folder the same if that’s the case?
April 4, 2014 at 1:33 pm #247439Hey!
Unfortunately you must overwrite the entire file if you don’t want to modify the original avia.js of the parent theme. Otherwise the theme will still execute the code line of the parent theme avia.js and you won’t notice any difference. The child theme name is not important and won’t affect the custom avia.js.
Best regards,
PeterApril 8, 2014 at 12:38 am #248547Hi Peter,
If I remove the line of code from the main theme avia.js file then it functions as I expect. However, following Ismael’s code does not seem to work. my child theme folder is not called “enfold-child” but it’s called “wgr-child”
Does the naming of the child theme matter?
April 8, 2014 at 8:02 am #248673Hey!
Please use the code I posted here: https://kriesi.at/support/topic/nextgen-gallery-with-enfold-background-fade-with-chrome-not-working/#post-246439 instead of Ismaels code. The child theme name doesn’t matter.
Best regards,
PeterApril 12, 2014 at 2:24 pm #250526Worked perfect, thanks Peter!
April 14, 2014 at 9:31 am #250959Hey!
Great :)
Cheers!
Peter -
AuthorPosts
- You must be logged in to reply to this topic.