robmeerwijk

All problems solved!

1) avoid overlapping items by means of the method imagesloaded in scripts.js

jQuery( document ).ready( function( $ ) {
     infinite_count = 0;
     // Triggers re-layout on infinite scroll
     $( document.body ).on( 'post-load', function () {
		infinite_count = infinite_count + 1;
		var $container = $('#dynamic-grid');
		var $selector = $('#infinite-view-' + infinite_count);
		var $elements = $selector.find('.hentry');
		$elements.hide();
		jQuery('#dynamic-grid').masonry({isAnimated: false});

		$container.imagesLoaded( function() {
		   $container.masonry('reload');
		});

		$elements.show();
	});
});

2 Random pagination in the url can be avoided by setting wrapper to false in functions.php

add_theme_support( 'infinite-scroll', array(
    'container' 	=> 'dynamic-grid',
    'footer' 		=> true,
    'type'        	=> 'scroll',
    'posts_per_page' 	=> 6,
    'wrapper' 		=> false
) );

And switching the footer and navigation links of in css

/* Hides navigation links and site footer when infinite scroll is active */
.infinite-scroll #nav-below,
.infinite-scroll.neverending #colophon {
	display: none;
}

/*Shows the footer again in case all posts have been loaded
.infinity-end.neverending #colophon {
	display: block;
}*/
/* Don't show the footer again in case all posts have been loaded */
.infinity-end.neverending #colophon {
	display: none;
}

/* Inifnite Scroll - Spinner */
.infinite-loader {
	color: #000;
	position: fixed;
	left: 50%;
	top: 50%;
}

And the last one. Now that I have infinite scroll, I would like to get rid of the previous messages button at the bottom of the page.

And another one. Jetpack seems to randomly assign pagenumbers resuling in strange behaviour when using the back button after reading a post. Anyone who can help here?

Thanks, I still have another problem. Sometimes jQuery has rearranged the posts before the picture is fully loaded, resulting in overlaying items. Anyone knows a solution for that?

I changed the following files after installing jetpack:

In functions.php I added the following at the bottom:

add_theme_support( 'infinite-scroll', array(
    'container' => 'dynamic-grid',
    'footer' => 'page',
    'type'           => 'scroll',
    'posts_per_page' => 9
) );

and in scripts.js I added at the bottom

jQuery( document ).ready( function( $ ) {
    // Triggers re-layout on infinite scroll
    $( document.body ).on( 'post-load', function () {
   	$( '#dynamic-grid' ).masonry( 'reload' );
        jQuery('#dynamic-grid').masonry({isAnimated: false});
	});
});

It is not perfect but it helps somewhat. I hope SriniG kan improve it! I have tried several themes but for my purposes, Emphaino is simply the best.

I forgot to include examples, sorry!

https://www.meerwijk.dk/rutte-of-roemer/

Here the caption is 70% while the picture is smaller. I added 2 lines to the custom css file:

/*
Welcome to Custom CSS!

CSS (Cascading Style Sheets) is a kind of code that tells the browser how
to render a web page. You may delete these comments and get started with
your customizations.

By default, your stylesheet will be loaded after the theme stylesheets,
which means that your rules can take precedence and override the theme CSS
rules. Just write here what you want to change, you don't need to copy all
your theme's stylesheet content.
*/
.wp-caption {
	min-width: 70%;
	text-align: center;
}

Problem solved!

It had a site effect that all pictures were scaled to 70% in all my blogs. That was not what I wanted. It overruled the settings. The min-width parameter set to 70% means that smaller images stay small, but the caption is suddenly 70%.

I am still stuck with mis-aligned pictures…

Regards,

Rob

I had the exact same problem in Chrome.

I added:

.wp-caption {
	min-width: 70%;
	text-align: center;
}

and now all is fine. Thanks!

https://www.meerwijk.dk

Yeah right, page source code stops right after de juiz div. No wonder you get into problems then ??

I have removed the plugin and all is well now!

Sorry guys, it was another problem. I noticed that there was no end </html> tag and wp-supercache was not working either. It turned out that the latest update of juiz last tweet caused the trouble.

So I have removed juiz and all is well now! It was no problem on the other theme because they had oder sidebars and Juiz was not showing up there!

Best regards,

Rob Meerwijk