I really want to use these two plugins together to make an awesome pop-up contact form, but I am having some issues. I followed this tutorial. Everything works fine until the last few steps. The author uses the term "new page" several times and I am having difficulty figuring out if he/she means an actual new page or the page I just created. So, after looking at the images along with the tutorial, I decided that you make one page with the Contact Form 7 shortcode and then you place the rest of the HTML given in the tutorial on the page that you want the pop-up to appear on. Do I have that right? If so, then I am still getting an error: [contact-form-7 404 "Not Found"]. So, I then brought the Contact Form 7 code onto my contact page and now the form is appearing directly on the page without the pop-up. Not what I wanted. I hope this all makes sense. I would appreciate anyone who could help me out with this. Thank you!
Edit: Also, here is my website, so you can see what is happening. Thanks again!
First off, are you sure that your Contact Form 7 short code is correct? I can't see any other reason for it to show the form not found. You might want to post the code you put into the page also.
I followed the steps and got this result, so I think you are missing something on the form itself since everything else is working:
I know it is, at the very least, working somewhat because the contact form appears on my Contact page (just not as a pop-up). But when I try to use the "Contact Us" button, I get the error I listed previously. Could there be something wrong with my jQuery? That is the only thing I can think of at the moment.
Edit: I know I sometimes have problems with plugins and jQuery because of the theme I am using, but someone on these forums suggested I download the WordPress plugin called All-in-One SEO Pack and ever since I did that, I have had no problems...until now. So, I am not quite sure what is going on. And I know Easy FancyBox is working properly because it opens my curriculum vitae just fine in a pop-up using Adobe Acrobat.
How are you bringing jQuery into Wordpress?? Are you using the <?php wp_enqueue_script("jquery"); ?> method? Or are you literally bringing it in? As far as I understand it, the enqueue method will always bring in the version that Wordpress itself updates with every release, so it should be fairly safe.
I am using a blank theme that Chris Coyier made a while back (like, over a year-and-a-half ago). I am not sure how I am calling it. How do I find out?
Edit:@JoshWhite, could you give me a step-by-step of how you achieved the pop-up contact form? I just used the most recent Starkers blank theme template, which should have an updated jQuery, and I still get the same error when I follow the previously mentioned tutorial. Thank you for bearing with me.
Also, I just found a WordPress Plugin called jQuery Updater. It brought my jQuery version up to 1.8.2. And the pop-up contact form is still not working.
Maybe the name of the form was changed from "Contact form 1" to something else? The message you're getting is a standard Contact Form 7 error that appears when the "name" value is incorrect.
What do you see when you put that particular shortcode in the contents of a (test) post (and not in a popup)? Same error?
Thank you, @Senff. You indirectly solved the problem. I went back to the tutorial to see what shortcode he used and then I looked at my own shortcode that was being produced by Contact Form 7. It was different. In the tutorial, the shortcode produced was [contact-form 1 "Contact form 1"] and my shortcode was [contact-form-7 id="87" title="Contact form 1"]. So I took the HTML that the author of the tutorial said to use:
And pasted it directly in my Contact page. Notice anything different between my shortcode and the code for the contact form being called? Yep, it was calling the pop-up in the old manner of doing it. So, I simply replaced [contact-form 1 "Contact form 1"] with [contact-form-7 id="87" title="Contact form 1"] and everything works fine. Fan-freakin'-tastic!
Right -- the tutorial might have been old enough to use an older version of CF-7, which would explain the differences.
However, in one of your posts above you pasted the shortcode you said you used on the Contact page (that doesnt open in a popup), so it was easy for us to assume you used the same (correct) code for the popup.
I really want to use these two plugins together to make an awesome pop-up contact form, but I am having some issues. I followed this tutorial. Everything works fine until the last few steps. The author uses the term "new page" several times and I am having difficulty figuring out if he/she means an actual new page or the page I just created. So, after looking at the images along with the tutorial, I decided that you make one page with the Contact Form 7 shortcode and then you place the rest of the HTML given in the tutorial on the page that you want the pop-up to appear on. Do I have that right? If so, then I am still getting an error:
[contact-form-7 404 "Not Found"]. So, I then brought the Contact Form 7 code onto my contact page and now the form is appearing directly on the page without the pop-up. Not what I wanted. I hope this all makes sense. I would appreciate anyone who could help me out with this. Thank you!Edit: Also, here is my website, so you can see what is happening. Thanks again!
First off, are you sure that your Contact Form 7 short code is correct? I can't see any other reason for it to show the form not found. You might want to post the code you put into the page also.
I followed the steps and got this result, so I think you are missing something on the form itself since everything else is working:
Here is the Contact Form 7 shortcode I am using:
I know it is, at the very least, working somewhat because the contact form appears on my Contact page (just not as a pop-up). But when I try to use the "Contact Us" button, I get the error I listed previously. Could there be something wrong with my jQuery? That is the only thing I can think of at the moment.
Edit: I know I sometimes have problems with plugins and jQuery because of the theme I am using, but someone on these forums suggested I download the WordPress plugin called All-in-One SEO Pack and ever since I did that, I have had no problems...until now. So, I am not quite sure what is going on. And I know Easy FancyBox is working properly because it opens my curriculum vitae just fine in a pop-up using Adobe Acrobat.
Yes, it's an old version of jQuery - 1.4.4, in the example JoshWhite gave he's running 1.8.3. That is most likely the issue.
How would I go about updating my jQuery? I know absolutely nothing about this topic or JavaScript.
Edit: Also, this is for a WordPress website. So, however I update jQuery for WordPress. Thank you in advance!
How are you bringing jQuery into Wordpress?? Are you using the <?php wp_enqueue_script("jquery"); ?> method? Or are you literally bringing it in? As far as I understand it, the enqueue method will always bring in the version that Wordpress itself updates with every release, so it should be fairly safe.
I am using a blank theme that Chris Coyier made a while back (like, over a year-and-a-half ago). I am not sure how I am calling it. How do I find out?
Edit: @JoshWhite, could you give me a step-by-step of how you achieved the pop-up contact form? I just used the most recent Starkers blank theme template, which should have an updated jQuery, and I still get the same error when I follow the previously mentioned tutorial. Thank you for bearing with me.
Also, I just found a WordPress Plugin called jQuery Updater. It brought my jQuery version up to 1.8.2. And the pop-up contact form is still not working.
Maybe the name of the form was changed from "Contact form 1" to something else? The message you're getting is a standard Contact Form 7 error that appears when the "name" value is incorrect.
What do you see when you put that particular shortcode in the contents of a (test) post (and not in a popup)? Same error?
Thank you, @Senff. You indirectly solved the problem. I went back to the tutorial to see what shortcode he used and then I looked at my own shortcode that was being produced by Contact Form 7. It was different. In the tutorial, the shortcode produced was
[contact-form 1 "Contact form 1"]and my shortcode was[contact-form-7 id="87" title="Contact form 1"]. So I took the HTML that the author of the tutorial said to use:And pasted it directly in my Contact page. Notice anything different between my shortcode and the code for the contact form being called? Yep, it was calling the pop-up in the old manner of doing it. So, I simply replaced
[contact-form 1 "Contact form 1"]with[contact-form-7 id="87" title="Contact form 1"]and everything works fine. Fan-freakin'-tastic!Right -- the tutorial might have been old enough to use an older version of CF-7, which would explain the differences.
However, in one of your posts above you pasted the shortcode you said you used on the Contact page (that doesnt open in a popup), so it was easy for us to assume you used the same (correct) code for the popup.
Anyway, glad it's solved.