DWUser.com
Empowering Web Creativity
Support Center - EasyRotator for WordPress
EasyRotator KnowledgeBase – Images Don't Appear
Sometimes one or more of the photos in your rotator may fail to load, leaving a blank empty space. There are several common causes for this problem; fortunately, they are easy to correct in all cases. We recommend that you check for each problem in order.
Possible issue #1: Photos aren't uploaded
If you're using EasyRotator for Dreamweaver / Standalone (not the WordPress plugin), missing photos usually indicate that you haven't uploaded all of the images that are used in the rotator. Double-check that all photo files have been uploaded.
Possible issue #2: Photo file names contain special characters
Photos also may not appear if there are special characters in the image file names or folder names. Check to make sure that there aren't any of the following special characters in the image file names or the names of the folders that hold those images:
- Ampersands &
- Quotes " or '
- Parentheses ( )
- Hashes #
All of these characters can cause problems with many server configurations and should be avoided. If any of these characters are present, rename your files and/or folders, re-add the photos to the rotator and upload again.
Possible issue #3: Rotator is initially hidden (e.g. in a Spry Tabbed or Collapsible Panel set)
When a rotator is initially hidden (most often, within a tab set), you need to call the er_resetPositions();
JavaScript function when it is revealed. If you're using Spry Tabbed Panels, add the following code just before the closing </body>
tag:
<script type="text/javascript"> er_$144('ul.TabbedPanelsTabGroup li').click(function(){ setTimeout(er_resetPositions, 1); }); </script>
If you're using Spry Collapsible Panels, add the following code just before the closing </body>
tag:
<script type="text/javascript"> er_$144('div.CollapsiblePanel>div.CollapsiblePanelTab').click(function(){ setTimeout(er_resetPositions, 1); }); </script>
If you're using Spry Accordion Panels, add the following code just before the closing </body>
tag:
<script type="text/javascript"> er_$144('div.AccordionPanelTab').click(function(){ setTimeout(er_resetPositions, 1); }); </script>
If you're using jQuery UI Tabs, add the following code just before the closing </body>
tag:
<script type="text/javascript"> er_$144('ul.ui-tabs-nav>li>a').click(function(){ setTimeout(er_resetPositions, 100); }); </script>
If you are using a library other than Spry or jQuery UI and are unsure of what code is needed for your specific situation, contact support using the link below and be sure to include the URL of the page with the problem.
Possible issue #4: SSL viewing in Chrome
In recent versions of Google Chrome, non-secure content won't be loaded by default when a page is viewed over SSL (as indicated by an https://
URL). If you are using the Dreamweaver Extension version of EasyRotator and are viewing your page using https://
, this can cause the rotator to appear as a blank space in the page. To fix this issue, follow these directions to enable SSL compatibility.
Note that this issue doesn't apply to EasyRotator for WordPress, as SSL compatibility is built-in.
Possible issue #5: JavaScript errors
This problem is evidenced by an entirely blank space appearing where the rotator should appear. It occurs when scripts in your page have errors or compatibility issues. To check for these errors and correct them, open your page in Google Chrome and open the JavaScript Console (via View > Developer > JavaScript Console); any errors will be listed in red in that panel. If any errors appear, correct them and reload your page.
Note: Certain scripts that use the Prototype JavaScript library may cause problems, due to the way Prototype modifies and overwrites some of the built-in JavaScript objects.
Possible issue #6: Structural errors when viewing in IE 8 or older
If a rotator only fails to load in Internet Explorer version 8 or older (but does appear properly in other browsers), the problem may relate to structural errors in the coding of your page. To check for this, run your page through the W3C validator and check for major errors such as unclosed tags.
Possible issue #7: File permissions
If the above suggestions don't solve your problem, also double-check that your images folder is accessible from the web. You can do this by typing the URL to one of your photos into your browser. If a "403 Forbidden" error is returned, you need to update permissions on the photo folder to allow web viewing.
Still having trouble?
If none of the above problems seem to be the issue, please contact support using the link below; be sure to include the URL of the page with the problem.
We're Here to Help!
If you have any questions about this article or about using EasyRotator, please let us know by opening a support ticket below.