I checked the site on my iPad iOS 8.1.3 and the scroll trigger items are a no show in portrait and landscape (with refresh). The standard metric template has them displayed, with no scroll IX of course, but the show up as static. I wonder if some portion of the detection for iOS that disables scroll IX is missing. I am guessing that webflow has them default to their final display state / position when iOS is detected.
Not sure what to look for exactly, but I can take a look in the safari web inspector and compare the two if you can offer some guidance as to what I need to look for.
Hmm, I wonder if some of the meta information accounts for this. I haven’t had time to thoroughly review webflow.js but I put the following back so the head content is as close to an exact copy as possible.
Unfortunately it still leaves the scroll IX elements as a no-show on iOS. I read that <meta name="viewport" content="width=device-width, initial-scale=1">
is important to fixing other issues with display on mobile devices. It is in a post from @callmevlad about attempting to resolve issues with fixed background images iOS. I can hunt for the thread if it is helpful. It talks a bit about iOS issues and some of the reasoning.
apologies if any of this is noise - I don’t know much, but apparently like to talk about it…
Yes but I’m looking at the exported html and that’s not there but the metric.webflow.com version apparently does not produce these results and I would expect the export to be identical.
So, switching back to the included jquery and webflow.js, placing them back in the footer as fixed references, I’m curious if we STILL have an issue with iOS?
If this proves to be the problem we will need to find out why and how to adapt correctly to the noConflict mode of WP’s built in jQuery library w/ webflow.js. Maybe there is a specific API call to re-instantiate the $ object. Maybe I’m just over-thinking/over-complicating something very simple and a new set of eyes can help =)
Still not displaying on iOS (emptied cache & history). Also tried on a separate port of the safari browser to confirm.
I will do a quick export of the metric template and post on my server just to be sure that there is no difference between hosted and exported. Would hate to be chasing a ghost and Webflow is obviously rehashing and tweaking a ton of stuff.
Hi pingram3541 - thanks so much for the video tutorial. I was following along and unfortunately got stuck in the areas where you edited/added to the code. My screen was not clear enough to see what you entered so I could copy. Do you have a supplemental document that you can share with the edited code to help me complete your walkthrough?
hey pingram3541!
thank you so so much for the second video! this finally helped me get my javascript interactions working on wordpress!
everything works now but on every page load i get an error message saying “Oops! This page has improperly configured forms. Please contact your website administrator to fix this issue.”… The message only appears when incuding jQuery above the webflow.js script. If I take that out, it disappears.
Can you explain to me where this error is coming from? I don’ find anything…
You can private message me a link to your site so I can take a look. Sounds like another plugin conflict maybe? Did you try disabling all unnecessary plugins first to see if the problem goes away? Oh and where are you seeing this message, directly in the front end page content or in the js console?
The origination of the alert ts found in webflow.js on line 575. I don’t recall where exactly it’s located but when you have a webflow webform that is now exported on a different domain, there is some fine tuning I believe in the code that needs to include new form configuration. I found this that might help http://forum.webflow.com/t/oops-popup-after-site-export-form-slider-issues/3573
In the mean time, you could edit line 575 and simply disable the alert by putting two forward slashes at the beginning of the line (//alert…). Then re-enable without the slashes later when you’re ready to tackle the form config (alert…). Keep in mind, this also means as of current, when someone completes your webform, it will also most likely generate an arror/alert and very likely not work.
As long as you know some basic html css it isn’t very difficult. There are a word full of wysiwyg plugins such as designmodo’s qards, visual composer, beaver builder among others. Best of luck!
This is outdated. As of a few weeks ago Webflow updated to JQuery 2.2.0, whereas Wordpress remains with JQuery 1.11.3 with their current release of 4.4.2.
Obviously, with plugins and WP dependent on v1.11.3 and Webflow dependent on 2.2.0 there’s bound to be issues with replacing one version for the other, either way.
Also, Webflow changed the way it begins its variables, so adding var $ = window.jQuery doesn’t fix conflicts as stated.
I’m not sure what the solution is, but maybe someone else will have an answer.
I write here to thank you for this tutorial you have shared. I have watched about 1/3 of it, with a bit difficult to see the php source code on my 11" laptop, so will continue at home with bigger screen however, can transfer some parts of my webflow site to wordpress website. Thx a lot!
As @Drunkard100 points out, the webflow jquery version is 2+ while the latest WordPress version (currently 4.5) is 1.12.2.
One approach may be to replace the core WP version by simply using the wp_dequeue_script( ‘jquery’ ) method via your theme or child-theme’s functions.php and then immediately add wp_enqueue_script( ‘jquery’, ‘path-to-your-webflow-version’ ).