Error with spacing on front page when feat img at 100%

hi C.
I visited your site, and have a suggestion for you. You could only allow 4 posts to be displayed in homepage…

Could you explain us how you managed to have featured images at 100% working?
I think many users would love to know about that..

thks

Hi incontrol,

That would be a work-around, but I actually want the thing to work properly, and need to display more posts on the front page!

For the images to be full size, look in your style.css for any reference to this:
article.post .featured-img

(style.css can be found in Appearance – Editor)

There will be a few references, and you should change the css to:

article.post .featured-img {
	height:100%;
        }

Hi there!

thanks for the tip… I tried to but I’m not good enough to find a solution!
That is a great theme and it would be awesome to fond out how we could do that.

I’ll try to ask a friend who works on WP and will let you guys know whenever I have a solution..
++

This page: https://isotope.metafizzy.co/docs/help.html says

Unloaded media files like images and @font-face fonts can throw off layout and cause item elements to overlap one another. Ideally, Isotope layouts should be initialized after all inner content has loaded.

It has some suggestions about how to get around the problem, but I’m not sure where to insert the code… ??

Still haven’t cracked this…

Does anyone know if I can use the getimagesize() function? This should determine the size of any given image file and return the dimensions, but how would I go about using that function (if it is suitable)?

Hi crispyfried,
Its basically an Isotope issue. But here are few things you can do to fix this:
First Method
1. Go to the script.js file at lib/js/
2. Add this line just after jQuery(document).ready(function() { at the top of the page:
jQuery(window).resize();

This will just trigger the window resize function as soon as your page is ready. However if you want to trigger window resize function after few seconds, use this code:
setTimeout(function(){jQuery(window).resize()},5000);

Here 5000 is time in milliseconds. ( And this looks cool ?? )

Second Method
1. Go to line 102 under jQuery isotope in script.js
2. change jQuery(function(){ to ‘$(window).load(function(){‘
This will initialize Isotope inside $(window).load() instead of $(document).ready(). This will trigger Isotope after all the media on the page has loaded.

Hope this helps.
Sampression Team