So I've read this thread
http://www.gravityhelp.com/forums/topic/add-a-file-upload-progress-bar#post-6584
And put the codes in the right places I believe (page.php in my template and header.php), but nothing is happening. Any help is appreciated.
page is http://www.personalizedshowercurtains.com/shop/design-your-personalized-shower-curtain/
Thanks,
Jake
I see the script in the head of your page, but I don't see the CSS. Can you tell me what stylesheet you added the CSS to? Please provide the URL so we can check the file.
page.php
http://www.personalizedshowercurtains.com/wp-content/themes/theron-lite/page.php
Thanks,
Jake
I can't see the source of a PHP page (try loading that page in a browser to see what I mean). Are you saying you added the CSS directly to the page template? Can you post that page template in its entirety at pastebin.com or pastie.org, because I don't see that CSS in the source of the page where your form is rendered. Maybe your product page uses a different page template?
There's something strange going on then. I viewed the source of this page:
http://www.personalizedshowercurtains.com/shop/design-your-personalized-shower-curtain/
But I could not find any of that CSS you said was pasted in the template. Take a look at the source yourself and let me know if I am missing something. The CSS is not in the rendered page, which would be one reason this would not work. The script is present, but the CSS is not. If it's there, and I just missed it for some reason, let me know which line number it's present on, in the source of this page: http://www.personalizedshowercurtains.com/shop/design-your-personalized-shower-curtain/
Ok maybe I added it in the wrong place. I've added it to the "shop" page and the specific product page within the wordpress editor. I've also added it to the page.php template, and none of these seem to work. Where exactly am I supposed to add it?
The CSS should be added to your current theme's stylesheet. You could add it to this file:
http://www.personalizedshowercurtains.com/wp-content/themes/theron-lite/style.css
Thanks for being so patient with me. I've added it to style.css, but it still isn't displaying. Is the issue since I'm using this with woocommerce?
I suppose it could be. Can you try using the form without WooCommerce and see if the fakeprogress indicator shows up?
I see the CSS now in the source, in a couple places (I think.) So that's a step in the right direction.
I put this on hold for the last 3 months for school, but the sites starting to generate organic traffic now and I really need to get this working. Picking up where we left off, I tested it without woo commerce and still no progress bar so that isn't the issue. Any other suggestions for me?
Near the end of the page source code is this
<button type="submit" class="single_add_to_cart_button button alt">Add to cart</button>
Would that change the code at all since the submit button is an add to cart button?
Ok so I've tested it on this page without woocommerce
http://www.personalizedshowercurtains.com/test-form-page/
and the fake progress bar will appear AFTER the file is finished uploading and remain indefinitely. So I seem to have two issues. One is getting the loading bar to appear immediately on click instead of after the file is done uploading, and the other is to get it to work on the page using woo commerce. Any help is appreciated.
The result described in the above post is only achieved when the form is using the ajax uploader. I read in one of these posts that this method won't work with the ajax option, but when I turn off the ajax option then there is no fake progress bar at all. So far using the ajax option is the only time I've seen the fake progress bar appear at all, but it appears after the next page has already loaded. Please help.
I tested your form as is right now, and I got the fake progress indicator. This is with Firefox on Windows 7. There was a 3 second delay before the window showed, but that is built into the script. Screenshot http://minus.com/lXzY51hP089ti
My image was 6.91MB and 4800x3600px. Maybe the upload made it to you?
I would turn off AJAX for that form and we can test again. Maybe jQuery is not being loaded by your theme, and when AJAX is off for the form, maybe Gravity Forms doesn't load jQuery either.
That's interesting that you got the loading bar on the form page, because when I run it the progress bar doesn't appear until the next page is loaded. Either way I've disabled ajax and now there is no progress bar at all (I'm using windows 8 and firefox). The link is still the same..
http://www.personalizedshowercurtains.com/test-form-page/
If the issue is that jQuery isn't loaded is there a way I can make it load?
