Menu
This is quite strange. Any ideas?
I should also note that it works fine on our developer's local machine, just not in the live site.
867
The problem is almost certainly an issue with Turbolinks
The typical definition of a Turbolinks problem is that if it only happens when you click links (IE "not upon refresh"), it will be caused by Turboinks. I explain why in a minute, but first, let's look at what the issue is:
Error
I clicked the footer links, and the page did turn blank
Interestingly, it showed me that the <body> element of the page had been removed:
This is almost certainly a Turbolinks error now (as I'll explain below). So what's causing it?
There could be a number of causes - but one that stuck out was the fact you've included a <script> tag directly in your <body> element:
I believe this could likely be the problem. Either this, or having not ended your </body> tag correctly, will cause Turbolinks to mess up. The way to resolve this will be to make your Javascript unobtrusive, allowing you to ensure you have all your tags in order
So here's how I'd fix it:
--
Fix
Firstly, put your Javascript into your asset pipeline:
#app/assets/javascripts/application.js
//Pikwik
var pikwik = function() {
var pkBaseURL = (("https:" == document.location.protocol) ? "https://statsbox.info/" : "http://statsbox.info/");
document.write(unescape("%3Cscript src='" + pkBaseURL + "piwik.js' type='text/javascript'%3E%3C/script%3E"));
try {
var piwikTracker = Piwik.getTracker(pkBaseURL + "piwik.php", 25);
piwikTracker.trackPageView();
piwikTracker.enableLinkTracking();
} catch( err ) {}
};
$(document).on("page:load ready", pikwik);
Apologies for mixing JQuery & JS - I felt it right to emphasize the fact you need to keep it to only loading at the start of a request. Looking at the PikWik code itself, it would appear that it will append a script tag to your page - meaning that if you want it to work with Turbolinks, that has to be done at the very start of the page load process
This will be in conjunction with you ensuring you have the </body> tag closed correctly
Turbolinks
To give you an idea as to why Turbolinks has a problem, you'll want to consider how it works:
Turbolinks makes following links in your web application faster. Instead of letting the browser recompile the JavaScript and CSS between each page change, it keeps the current page instance alive and replaces only the body and the title in the head. Think CGI vs persistent process.
This basically means that every time you load a page with Turbolinks, it will only load the <body> tag of the new page, leaving the <head> intact.
The problem with this is that if you have any dynamic scripting inside any of the <body> tags you wish to load, it's going to cause a conflict. This is what I think has happened here - which you can address with the above recommendation
148
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
