Issues with javascript in Nick Cates "Forward" theme - PLEASE help?

Classic General
1

Hi everyone,

I’m using Nick Cates’ fabulous “Forward” theme to build our new website. I absolutely love it, but there seem to be some issue with getting javascript to work properly with the theme. I have contacted Nick Cates about it and got some kind and helpful responses, but what they suggested didn’t work and they’re really slow in answering emails so I thought I could ask here if anyone had any ideas.

(Oh and before I go on please note that I’m a newbie and not at all javascript savvy, so please keep that in mind if you have any ideas for me - detailed steps much appreciated)

So I’m trying to incorporate a few things on the site by the help of some copy-pasted javascript, but nothing happens when I publish the page. I tried the code with another theme (the Reason theme from the same designer), and then it works fine so that’s what lead me to conclude there must be some issue with the theme.

The page that I have trouble with (work in progress published for testing purposes only):
http://www.bedandbooks.no/nysidetesting/booking/

As you can see the functionality that I want on the above page is working fine with the Reason theme on this test page (never mind the layout):
http://www.bedandbooks.no/nysidetesting/test/

The code is exactly the same for both pages:
Pasted in the <head> tags:

 <script src='https://sky-eu1.clock-software.com/js/iframe_integration.js'></script>

Pasted in an html stack on the page:

<script>clock_pms_iframe({ height: '2000px',  width: '100%', seamless: 'seamless', frameborder: '0', src: 'https://sky-eu1.clock-software.com/6263/2604/wbe/products/new' })</script>

What could be going on?
I have a script in the footer of the page too, from TripAdvisor, and the helpful guy at Nick Cates design suggested this might be the issue, if I understood him correctly: “This is probably because jQuery is called in the footer of Forward, and your custom code is being inserted via the top part of the page. You can try calling jQuery again, before your custom code - and this should work.”

Upon request (as I’m a newbie I had no clue how to “call jQuery again”) he then kindly provided me with this line of code to put in the first line of the <head>:

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

I tried that but it didn’t change anything.
I also tried taking away the script in the footer, but there was no difference.

There is also trouble with other pieces of script on the site, fex are all the scripts from TripAdvisor (copy-pasted into a html stack) on this page looking really funny and not at all informative: About --> Testimonials (sorry the lack of a direct link, was not allowed to post more than 2 links?!)

Does anyone have any idea what could be going on here? I’m getting quite desperate so any suggestions are heartly welcomed.

I’m using RapidWeaver 6.3.1 and the latest version of Forward. Stacks of course, and some plugins. OSX 10.10.4.

Please note that the links provided to my site are test pages (work in progress) and not yet publicly available so never mind incomplete things and broken links.

Huge thanks in advance for any help that can make this work with the theme!

-Silje

2

Silje,

The order in which you instantiate JQuery can be all important.

Without following the specifics you give, I’d suggest removing all calls to any other JQuery routines than the one you want.

One at a time. If what you want continues to work, you can be pretty sure that there’s a conflict.

Sadly. Good luck!

3

Thank you so much for your kind input, Mark - much appreciated.

As far as I know, this is the only call to jQuery that’s there - I did try removing the script in the footer and having just the one script that I really needed but it didn’t make any difference. (Unless there’s something else going on with the theme that is beyond my knowledge?)

Aaron at Nick Cates design is being very helpful though - he has found that the script simply doesn’t work with the Forward theme (and many other NCD themes), along with some others from Yuzool and ThemeFlood. So then let’s just hope that he is able to come up with a solution so I’ll be able to keep the theme with the functionality that we need - I wish I could just abondon these scripts altogether but sadly they’re absolutely crucial for our business.

I’ll keep you posted what happens in case there are others out there with the same problem. And in the meantime if anyone else has any ideas they’re of course much appreciated!

4

Please do; and good luck. This will surely improve the usability of all Themes for everyone.

5

Hi everyone,

Here is an update to this issue:

About the booking scripts not working (the first links in my first post):
I’ve asked around everywhere I could to get some help with this, and a very clever guy I know helped me to look into the code for the page. He found something crucial: What was inserted in the <head> tags in my RapidWeaver file was NOT showing up in the published head tags on the page, but instead somewhere at the bottom of the page. Of course this explains everything: the script in the <head> tags was simply not rendered before the code in the html on the page but after it, and hence the script would not function at all on the page.

So, in conclusion, there seems to be something very weird going on as to how the site code, and specifically that in the <head> tags, is generated with the theme to the published version of the pages.

I have written to Nick Cates Design to let them know this.
It’s weird to me that they as a developer didn’t spot this issue right away on my publised pages in the first place, as it was the first thing my savvy friend noticed. But I guess you can easily overlook crucial things if you are busy.

My very clever friend helped me with some code that transformed the script code into a simple iframe code, and I was able to add the functionality that I needed for that page that way instead (avoiding heaving to deal with code in the <head> tags).

So while I managed to get this to work with this iframe-work-around, I hope the issue gets sorted out by the developer so that others don’t run into the same problem.

(Or, if this turns out to be due to some other kind of bug going on in my personal RapidWeaver project and not related to the theme, that someone could give me an idea of what may be causing it. It’s really weird to me that the code in the <head> tags is not generated properly when publishing the site. Has anyone else experienced this?)

About the TripAdvisor scripts:
The answer from NCD was simply that the TripAdvisor widgets “are unfortunately not compatible” with the theme. They sent me some helpful suggestions for workarounds (using images instead of scripts, etc), and while this is unfortunate and not at all optimal I’m sure I can make it work somehow.

However, I’m not entirely convinced that this “incompatibility” really is the case. My code savvy friend suggested that the error might be that some style sheet is not rendered correctly or may be misplaced, just as the code in the <head> tags showing up on the bottom of the page instead of the top. He thought that the funny outcome of the scripts on the page was simply due to the fact that the browser wasn’t told how to correctly display them.

While I’m by no means anywhere near an expert here, I have to say I find the explanation from my friend more convincing that the simple statement from NCD that the theme is simply not “compatible”. A script is a script is a script, no? And if you just get the code on the published page right, the script should be working regardless of which theme you are using? No?

If anyone clever around here has any ideas on this or would care to look into the code and the style sheets referenced on the page to see if it has anything to do with it, I would be super happy for any input or advice. The link to the page is: http://www.bedandbooks.no/nysidetesting/about/testimonials/

Thanks in advance for any help or advice.
Worst case I’ll go with the image workarounds and see if I can get the scripts to work later on.

6

Have you tried sourcing the JQuery library from Google, instead?

7

I have exactly the same issue which is a shame as my client has all 5* reviews and it would be nice to show them. Any solutions forthcoming?

8

Here’s a workaround using an iframe stack (there are several - I’m using the one bundled with Blueball’s freestacks set). It’s obviously not s good but it is a live window to the review page. I will probably play with this a bit but here’s the first test: www.thewillowscanterbury.co.uk

9

I discovered a serious issue using the iframe workaround - view thread here: Google indexing irrelevant URLs as 404's