Follow Button in Embedded Timeline Suddenly Too Wide in Firefox

[PlanetPOV]

The Follow button in my embedded timeline on my website suddenly isn’t displaying properly in Firefox and is causing the timeline to be pushed down out of view. In Explorer and Safari, the Follow button at the top of my timeline looks normal but in Firefox, the button includes our Twitter handle so it is much larger and the number of followers also appears.

Here’s a link to an image comparing the two different views, on Explorer and Firefox:

Image of Follow Buttons in Explorer and Firefox

Due to this much wider header in Firefox, the tweets end up being pushed down almost completely out of view, just blank space in most of the embed. All was fine since we embedded it over a year ago until this week, don’t know if Twitter changed code or if it was something else.

Appreciate any suggestions on fixing this problem!

[benward]

Hi! Can you actually provide a link to the page in question please? The screenshot you include does show a Follow Button widget, but the timeline widget doesn’t include such a widget—the follow button within is just a regular link, not a nested frame or anything so complex. It may be that you’re using a custom implementation somehow.

I’d obviously still like to understand what’s caused the change, but if you’re seeing the follow button widget in that position, it may not be our standard TFW tool.

Ben

[PlanetPOV]

Hi Ben,

Thanks for your response! The embedded timeline is incorporated into our theme and appears on our homepage and every page on our site, you can see it at http://planetpov.com in the right column.

When the page is viewed in IE or Safari, the embedded Twitter widget displays properly but when I view the same page in Firefox (latest version, 33.0) the Follow button is altered, appears as shown in my post and forces the timeline down and out of view.

I am using the standard Twitter widget/embed tool at your site, using the code generated by that tool on my site. That embed code had been working normally for more than a year until this week.

When the widget loads, it displays the timeline for a split second before the header with the too-big Follow button and follower count appears then the time line is shoved down and replaced by blank space.

Hope this is helpful. Appreciate the assistance!

[benward]

Hi there,

I can reproduce this in Firefox, which is crazy because we haven’t had follow-button widgets served inside of Timelines for many months. Looking at your source it appears that you’re running some kind of Cloudflare caching/build step for your JavaScript. This is likely causing old, incompatible code to run against the timeline data. To fix this, you should update your template to reference platform.twitter.com/widgets.js directly.

Please let me know if that resolves the issue. Thanks!

Ben

[PlanetPOV]

Hi Ben,

Not sure where that reference should be placed, in the Twitter widget code? In any case, can this be resolved within the widget code?

Thanks!

[PlanetPOV]

Hey Ben,

Followed your lead and investigated Cloudflare, finding the issue. Apparently, their “Rocket Loader” Java loading function is triggering the problem. Once disabled, the problem is resolved.

Thanks for pointing me in the right direction!

[niall]