Envira Gallery Documentation

Documentation, Reference Materials and Tutorials for Envira Gallery

Debugging Envira

Share This Post!

Are you experiencing issues? We are here to help! This documentation shows vital steps and known issues that will get you up and running without ever submitting a support ticket.

We’re always working to improve Envira’s compatibility with other products, but there are a lot of plugins and themes out there. Due to the various customizations that every website has, there is no way to shelter Envira Gallery from conflicts completely. Here are the ones we know about and how to resolve them.

  1. Getting Started
  2. Known Issues – Admin
  3. Known Issues – Frontend
  4. Debugging

Before submitting a support ticket, you can complete the following debugging steps yourself to identify the cause of the issue and resolve it:

  1. Backup: Always make a backup of your site before debugging, in case you accidentally delete or remove something that you shouldn’t!  This is good practice for any WordPress web site. Learn how to backup your site.
  2. Enable Debugging: Enable debugging for your site to view any PHP errors output when reproducing the issue can help quickly identify the source of the problem. Learn how to enable debugging.
  3. Theme or Plugin Conflict: Checking for a possible theme or plugin conflict is a standard part of the debugging process and should be performed if your experiencing unexpected or limited functionality of Envira. Learn how to check for a theme or plugin conflict.
  4. Browser Debugging: You can use your browser to check for javascript errors that might indicate the specific cause of the issue you’re experiencing. Learn how to browser debug.
  5. Mobile Compatibility: Envira only supports the last two versions of iOS for both iPhone and iPad devices.

If after completing the above you’re unable to identify or resolve the issue, please proceed to our Getting Support guide.


Some errors are specific, and we’ve already got steps you can take to resolve them below.

Using Google Chrome’s Console tab, check if there’s an error stating:

Uncaught SyntaxError: Unexpected token <

Resolution

Ask your web host to run your web site on at least PHP 5.3 (note: WordPress recommends using at least PHP 5.6+)


Admin: Settings Menu Isn’t Available

If you’re using the X Theme, you’ll need to follow their documentation for enabling the Settings menu item to be visible before you can verify your Envira Gallery license key and access the Addons menu screen.

Resolution

Follow the X Theme documentation at https://community.theme.co/kb/integrated-plugins-envira-gallery/ (Under the Bundled Version section).

To enable the Settings menu, you’ll need to add the following line of code in your theme or child theme’s functions.php file:

function x_envira_gallery_remove_license_functionality() { return true; }

It could also be that you have not activated the Paid version of Envira but you are still running the Lite version. Please follow these guidelines for upgrading from Envira Lite to the Paid version of the plugin.


Admin: Addons Menu Isn’t Available

In order for the Addons menu to be present, you need to have verified your Envira license on the site.

Resolution

  1. Head to the Settings page and verify your Envira license.
  2. A new tab called Addons will be available, and you can now use that screen to manage your Envira Addons.

Admin: How to Verify Your License

We have just the doc for you!

Resolution

Click here to learn how to verify your Envira license.


Admin: Available Envira Update Not Reflected in the Site Updates Area.

Unfortunately, things happen sometimes. This is caused by WordPress not looking for the update when we release it.

Resolution

After logging into WordPress, navigate to Dashboard » Updates. Simply refresh the Updates page a couple of times, and you should see the update. Refreshing the Updates page causes WordPress to check for updates, and Envira will be added into those updates if there is indeed an update to the plugin (or Addons).


Admin: Error set_time_limit

In order to ensure the best loading and processing of images, we adjust your server’s timeout settings. Some hosts restrict this setting which can result in the following error:

Warning: set_time_limit(): Cannot set max execution time limit due to system policy...

Resolution

In order to resolve this error, please contact your host to enable the modifying of set_time_limit. Once this is enabled on your server, the error will no longer display.



Frontend: Cropping enabled, images not being cropped.

This will happen if you’re using JetPack’s Photon module and Media Settings which loads the original, full-size, image instead of the image cropped to the specified dimensions.

Resolution

Disable the Photon module and Media Settings for JetPack.


Frontend: Lightbox is enabled, but images don’t open in lightbox view.

This happens if the Link To field for the image is set to None or Attachment Page when adding from the Media Library. It should be set to Media File in order to auto-populate the URL field for these images in the gallery and trigger the images in lightbox. You can see our Creating

Resolution

To correct the issue for any images already added to galleries where they’re not loading in lightbox view:

  1. In the gallery edit screen, select the blue pencil at the top of the image thumbnail.
  2. This will open the Edit Item screen, where you can see the URL field.
  3. If this field is empty, select the Media File button to automatically populate the URL field with the URL of the image file.
  4. Select the Save Metadata button at the bottom of this screen before navigating to the next item or closing the Edit Item screen.
  5. Update your gallery and check that this resolves the issue.

Using Salient Theme?
If you’re using the Salient Theme, also confirm that Animated Page Transitions are disabled in the Salient » Page Transitions screen.


Frontend: Gallery images opening in two lightboxes on same page.

This will happen if another lightbox script is being loaded by a third-party plugin or your active theme.

Resolution

Disable the lightbox being loaded by a third-party plugin or active theme on your site.


Frontend: Lightbox settings not being applied.

This will happen if another lightbox script is opening the images instead of the Envira Gallery lightbox.

Resolution

Disable the lightbox being loaded by a third-party plugin or active theme on your site.


Frontend: Lightbox thumbnails are black or missing

There could be a delay on the server with creation of the thumbnails. A few other reasons could be server related as well.

Resolution

  1. Check with your hosting company that you have Imagick library installed on your server. Envira uses this library to create the image sizes for you on the fly.
  2. If you’re using a CDN to serve your images, check the plugin you’re using to facilitate this to ensure it’s isn’t deleting images from the Media Library after they’re uploaded to your CDN.
  3. Check the file permissions on the images are set to 644 (can also be set to 755) so that Envira has the correct permissions to create these image sizes for you.  If you need assistance on how to check file permissions, take a look at this article from our friends at WPBeginner.

Frontend: [Object object] has no method ‘enviratope’ or [Object object] has no method ‘envirabox’.

This error comes from an issue with loading the Envira script on the page, likely due to a previous script that has loaded in a bug. Check to see if any errors have occurred before it so you can isolate and deal with the bug.

Resolution

  1. Check to see if there are any other errors in the browser before this one and see if it is indicative of another plugin or theme you are using.
  2. Check for a plugin or theme conflict. If this resolves the issue contact the support of the buggy plugin or theme to resolve the issue.
  3. Clear out your browser cache (especially if the error appears after upgrading Envira). Make you clear it out from the beginning of time in Chrome to ensure that no invalid cache responses remain.

Frontend: Envira Doesn’t Load on the Page

This is due likely to a JS error caused by your theme or a third party plugin.

Resolution

  1. Make sure that there is only one copy of jQuery being loaded on your site. If more than one copy of jQuery is being loaded, it will overwrite previous jQuery objects and discard anything attached to the previous. It will also slow down your site, so you should remove it anyway.
  2. Check your Chrome console for errors. There is likely a JS syntax or parsing error somewhere on the page. Try to resolve the issue by figuring out what script is causing the issue and where it is loaded from (either your theme or another plugin).
  3. Make sure that your theme has this somewhere in the footer.php file (typically located just before the </body> tag):
wp_footer();

Frontend: Loading Icon Gets Stuck and Gallery Doesn’t Appear

This means that there was an error loading the Envira script.

  1. Clear out your browser cache. It could be serving an invalid cache file. Make sure to clear it out to the earliest date possible (from the beginning of time in Chrome). Also, flush your plugin and CDN caches if applicable.
  2. Check for a plugin or theme conflict. If this resolves the issue contact the support of the buggy plugin or theme to resolve the issue.

Frontend: Pinterest Buttons Not Showing When Enabled

If you have the WordPress SEO by Yoast plugin installed and activated, it may be necessary to enter the Meta Description field for your galleries before the Pinterest buttons will load properly on the front-end.


Frontend: Why Aren’t My Image Sizes Changing?

There can be a few different reasons for not immediately seeing the change to your image size in the gallery.
Resolution

  • the images you have uploaded to the gallery are large in size
  • your gallery contains a lot of images that are large in size
  • your server is running slow for any reason
  • this could be the result of cookies or caching

Frontend: Why Aren’t My Image Links Working on Mobile?

Please make sure you have checked the Enable Lightbox on the Mobile tab of the gallery. If this is not checked, links will not be output to the page on mobile.

Enable the lightbox on the mobile tab to ensure your images still link on mobile


Debugging: How Do I Back-up My Site Before Debugging?

If you’re unsure how to properly back-up your site please read through
How to Backup & Restore Your WordPress Site with UpdraftPlus
to get started.


Debugging: How Do I Enable Debugging?

A: Add the following to your wp-config.php file:

ini_set('log_errors', 'On');
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', false );

Unsure of how to do this? Read How to Edit wp-config.php File in WordPress for more info.
If any errors subsequently occur when using Envira Gallery, they’ll be logged to wp-content/debug.log. If you find this file, send it through as part of your support request – it can be useful to help fix more technical issues.


Debugging: How Do I Check For A Plugin or Theme Conflict?

A: To check for a plugin or theme conflict please follow these steps:

  1. Disable all other plugins.
  2. Activate the Twenty-Sixteen theme.
  3. Check if the issue you’re experiencing is resolved.
  4. If this resolves the issue, reactivate the theme and each plugin individually and check after each activation if the issue is reproduced again to identify the specific conflict.

Debugging: How Do I Debug In The Browser?

A: When debugging issues or bugs that are visible on the site to any visitor, we also recommend using Google Chrome. When in Google Chrome, do the following:

  1. Visit the webpage where the error is occurring.
  2. Right-click on the page and select the Inspect Element option from the screen popup.
  3. Once the debugging window has appeared, click on the Console tab to the right.
  4. Make a note of any red errors that appear, and include them in your support request.

Now that you’ve covered our debugging guide, it’s time to check out our Getting Support guide.


Share This Post!