Infinite Scroll footer not centered, more…

Hello cthery11,

Thank you for the appreciation and for the detail report on the issue. I’ll do my best to try and answer your queries.

1. This may be outside your control, but the footer that appears with Jetpack’s Infinite Scroll enabled is left-justified, whereas I have the rest of the site centered

.
Not tested this functionality – now its been reported its on the TODO list and will be more thorough in my testing to see what can be done to resolve this

2. The “remove white space” function cuts off the tops of featured images on my iPhone.

Had no issues on S3 and HTC – no access to iPhone. Sounds like an iPhone related issue so will have to get a friend to test so I can see bug first hand and hopefully look in to how it can be fixed.

3. The category and author pages with thumbnails are a jumbled mess on my iPhone. The posts without featured images look fine.

Same as 2 above.

4. Activating the Custom CSS module in Jetpack makes the top navigation options white instead of black – so I’ve disabled it.

Plugin has not color controls so not sure why that would happen. Are you using the fourteen colors plugin and is/was there any custom CSS entered?

5. The search button doesn’t always work in Chrome on my Mac, but it seems to be working all the time in Safari, so maybe it’s just me.

Not had any issues on a PC and no access to a Mac – this is another testing job for my friend so that we can see what needs to be done to address that.

Again, really fantastic work! I’m considering redesigning my other site with the same theme and your plugin.

Awesome – that is what we strive for as developers ??

Thanks so much for your quick reply, and for looking into these issues. #1 is the biggest concern right now, since it happens across all browsers. Maybe if I just figure out how to hide the footer, that would be just as good!

As for #4, yes I’m using the Fourteen Colors plugin, so Jetpack Custom CSS must be overriding that for the background color but not the text color.

Hello ctheory11,

Here’s what I think is the workaround for #1 – add the following CSS code to a custom css plugin if not using Jetpack’s CSS module…You may need to adjust the values depending on what your other settings are!

#infinite-footer {
	left: 82px;
	max-width: 1260px;
}

I’ve not been able to replicate #4 with both Jetpack CSS module on and Fourteen Colors active so not sure why that happened.

Let me know how the above CSS works out for you and I’ll get back to you with the rest as soon as I can.

Regards,
Zulf

Thanks again for your help Zulf!

Turns out there was already some code entered in Jetpack Custom CSS that was causing the problem! Sorry about that. Totally my bad! #4 is solved. ??

As for #1, here are my Fourteen Extended settings:

TwentyFourteen General Options
Overall Site Max Width 938
Overall Content Max Width 938
Overall Content Max Height 572

TwentyFourteen Content Options
Remove white space above content
Remove content separator
Content Max Width 474
Remove Widget Title Top Border

I changed the max width in your code to 938, but the bar still slides around as I resize the browser window. I tweaked the “left” setting, but no matter where I set it, the bar moves as I resize the window, whereas the rest of the content doesn’t.

I’ll keep messing around!

I’m thinking that you might need to set different size/left setting on per break point media query – not tested it yet but could be worth a shot?

I would totally try that if I knew what those words meant! ??

I tried setting max-width to 938, and then 500, and didn’t see any difference. Adjusting the left setting obviously makes a difference, but the placement depends upon the browser window size.

If there’s no other way, I’d be happy just deleting the footer, and I’m sure I can figure out how to do that by googling!

If you read the footer section here, it says the theme will pass on the width of the footer so it fits perfectly in your design:

https://jetpack.me/support/infinite-scroll/

So I guess there must be a way for you to override Twenty Fourteen sending the default values, where the footer appears on the left.

Maybe? ??

The values are coming from Jetpack and I don’t think Twenty Fourteen is doing anything with infinity scroll at all. Let me dig around to see if I can find a working solution.

Will get back to you soon.

Zulf.

Sounds good! Thanks again Zulf.

Any news Zulf?

I’ve since used some custom code to get rid of the credit on the right side of the infinite footer, but couldn’t figure out how to get rid of the footer altogether, or center it with the content.

I’m guessing if there’s no way to fix it within your plugin, maybe I just need to tweak jetpack/modules/infinite-scroll/infinity.css. And if I knew anything about CSS, I totally would! ??

I think I’m just going to disable infinite scroll. No big deal!

Thanks again for your help! I’m going to create a third blog using your plugin.

Sorry about that ctheory11, I’ve not been able to get to work well on my end either – there are too many permutations to fiddle around with.

I’m thinking the only solution is a child theme but haven’t had the time to really employ it there yet.

Zulf

That’s okay! If you ever figure it out, let me know, but it shouldn’t be high on your priority list.

I have another potential issue, but I want to test a bit more to see if I can’t figure it out. You may see another thread from me soon!