jaimecapra

I’m still seeing this issue (last checked on iPad), which has forced me to set my Threshold really high (>=2400) and caused other issues.

I just found a comment on another lazy load thread

To get this to work on iPad all you should need to do is change :
addEventListener(‘scroll’,processScroll);
to :
addEventListener(‘touchmove’,processScroll);

Perhaps iPod/iPad need to be triggered by a different event, and this is the cause of the issue?

I’ve gotten the Bounce Rates for all the other OS/Browser combinations down. iOS & Safari are still giving me problems, and I think it’s related to this issue.

Since iOS + Safari represents a significant portion of my traffic, I’m probably going to have to disable this plugin if I can’t find a workaround.

Some reading on the internet turned up a lot of bugs with iOS 7 Safari that could be affecting Lazy Load. Is anyone else having any problems with this combination?

I figured it out.

I created a new single-post.php template for my Genesis child theme.

The template includes this code to add pagination links above the content for every page except the first one (0), and below the content for all pages. Setting the $priority argument to 2 puts the links before the content, and 11 puts them after.

if ($page != 0){
	/* don't add links to the first page */
	add_action( 'genesis_entry_content', 'genesis_do_post_content_nav', 2 );
	add_action( 'genesis_post_content', 'genesis_do_post_content_nav', 2 );
}

add_action( 'genesis_entry_content', 'genesis_do_post_content_nav', 11 );
add_action( 'genesis_post_content', 'genesis_do_post_content_nav', 11 );

At the moment I’m using Async JS and CSS for CSS. In addition to minification and file combination, it has options to include the CSS the normal way, inline in the header or footer, or deferring CSS loading using javascript.

The method that showed the best Page Speed results for me was to include CSS inline in the footer. My Genesis based CSS was so large it caused too much blocking in the header. To prevent a flash of unstyled text I put some CSS inline in the header to set the background color and push the text off the page during loading. <style rel='stylesheet'type='text/css'/>html{margin:-9999px;} body{background-color:#1E2F2C;}</style> I wish I could give credit to the guy who gave me that idea but I don’t have the link anymore.

For JS minification only I’m using Better WordPress Minify. I hacked the PHP to add “async” to all the scripts (https://www.ads-software.com/support/topic/asynchro-loading-for-script?replies=12). Apparently the async option will be included in the next plugin version.

It has options to move the scripts between the header and footer, minify but include them separately, or to not minify them at all. Because I hacked the code to add async, the last two options give me the flexibility to load scripts blocking or asynchronously. Since jQuery an many other scripts are already minified, having BWP-Minify ignore them just removed “asynch” with no file size penalty. This gave me a lot of flexibility to optimize JS loading.

Thanks @tippy!

Thanks to your help I found the zombie configuration. The issue was that I assumed the entire W3TC install would be in one subfolder and didn’t look hard enough. I found the file with the bad path at /wp-content/w3tc-config/master.php.

Using those instructions in https://journalxtra.com/websiteadvice/wordpress/uninstall-w3-total-cache-proper/ I was able to clean it out completely. When I opened it again the Recently an error occurred while creating the CSS / JS minify cache: File "xxxxx/wp-content/themes/js/somefile.js" doesn't exist. issue was gone. I think I corrupted the configuration by having multiple W3TC plugin windows open at once when clearing caches and optimizing the configuration.

Before I did anything else, I checked Minify. The problem persisted that the CSS and JS files were minified and added in the correct spots on the page, but the references to the original files weren’t removed. Now the HTML Minify is completely non-functional too. I disabled the Minify part and am using two different plugins for CSS and JS to duplicate the functionality of W3TC > Minfy.

Thanks again for your help @tippy!

Fantastic plugin Manos. Thanks for all of your great work!

I have the same concern. PageScroll2Id is a great plugin, but links to other pages that include the reference rel=”m_PageScroll2id” don’t work at all. This problem complicates site-wide application of PageScroll with CSS, integration into site-wide menus, pagination of posts, and other site maintenance.

For example, say you have two identical pages page1.html and page2.html. On page1.html, the link <a href="page1/#someid" rel="m_PageScroll2id"> will work great. However, the link <a href="page2/#someid" rel="m_PageScroll2id"> will not do anything.

This post describes modifications to jQuery ScrollTo coding to support this functionality:
https://stackoverflow.com/questions/9652944/jquery-page-scroll-to-different-page

There’s also a demo of the code working: https://vostrel.cz/so/9652944/page.html

This addition would make this plugin about perfect.

I made a hack to add async to all of the HTML script insertions. Note that this will add async to ALL of them, which may break your page.

• Deactivate Better WP Minify Plugin. Otherwise the file may be flagged as “inactive” and the update will not take effect.
• Find file class-bwp-minify.php in the editor
• Find function function get_minify_tag($string, $type, $media = '')
• Find line $return = "<script type='text/javascript' src='" . $this->get_minify_src($string) . "'></script>\n";
• Add “async” to that line: $return = "<script async type='text/javascript' src='" . $this->get_minify_src($string) . "'></script>\n";
• Reactivate the plugin.
• Make sure your site didn’t break.

I’m having the same issue. The warning I’m getting is Recently an error occurred while creating the CSS / JS minify cache: File "xxxxx/wp-content/themes/js/somefile.js" doesn't exist. If you notice, the name of my (genesis child) theme is missing from the path. The files that give me the warning have never existed in this location.

Even before this error started, JS and CSS files were minifying and combining; but the old calls to the individual JS and CSS files weren’t getting removed.

So far I’ve tried:

• Removing the plugin and re-installing. This changed the name of the file that was giving me the error. However, the theme was still missing from the path.
• I tried Import Configuration on the re-installed plugin.
• I tried doing a Restore Default Settings config reset. Somehow the previous JS and CSS file settings were still remembered after Restore Default Settings.
• I did a file text search on the entire plugin directory for the bad path and didn’t find it.
• I found the configuration file (../cache/config/master.php)and could not find any bad paths inside.
• I removed the plugin and the deleted the plugin directory which held the configuration file.
• With the plugin removed I also searched the site database for the bad path but didn’t find it there either.
• When I re-installed W3TC, somehow the previous settings were remembered even though I deleted all of the files.
• I disabled JS and CSS Minify in W3TC. Even with only HTML Minify enabled, I still get the error to the JS file above.

I’m having the same issue, as well as the Recently an error occurred while creating the CSS / JS minify cache: File “xxxxxxx.js” doesn’t exist issue (the file never existed).

Hey Tobias,
I see what you mean. Centering the tablepress-xx_wrapper <div> would be cleaner.

Unfortunately your snippet is not working for me though.

I got the tablepress-123_wrapper <div> to autofit to width by adding
` display: inline-block;’
But I couldn’t get that wrapper div to center on the page.

I went back to my version and enabled all of the JS controls like search and pagination. They all display, they’re just wider than the table. It looks fine in my example.

Thanks for the quick reply!
Cheers,
Jaime

Hello Tobias,
Thanks for the great plugin!

I was having the same issue but I found a solution.

The Custom CSS margin property wasn’t working to center the tables, although the width property worked:

.tablepress-id-N {
    width: auto;
    margin: 0 auto 1em!important;
}

Then I saw that this code was overriding the above Custom CSS margin property.

dataTables_wrapper .tablepress {
    clear: both;
    margin: 0!important;
}

So, this addition to your Custom CSS made it work great:

.dataTables_wrapper .tablepress-id-N {
    width: auto;
    margin: 0 auto 1em!important;
}

Thanks again!
Cheers, Jaime