Category Archives: jQuery

11.18.12
by

Integrating PayPal and Google Forms

As I told a co-worker 20+ years ago, there is no better way to learn how to do something than having a problem to solve.  I need to solve a problem.  My WordPress Google Form plugin originally came from a project to help our Middle School Athletics Booster Club.  It solved the problem at hand but over time I’ve added more features to it, not because the Booster Club needed them but because people asked or they were interesting problems I was compelled to solve.

Our Booster Club now wants to have an Online Shop and after playing with a couple of eCommerce plugins, I’ve decided to go with WooCommerce.  The only thing really missing is the ability to sell a Booster Club Membership.  Our membership process isn’t easily handled by any of the eCommerce plugins I’ve looked at.  WooCommerce has a paid for add-on module that looks promising but I am reluctant to buy something without trying it first.

I’d really like to inject a PayPal “pay” button into WordPress Google Form and simply use it for our membership registration but doing so isn’t simple.  PayPal makes the Payment API look very simple in their documentation but from what I’ve read, it isn’t quite so simple.

With as much mucking around with the DOM I’ve done to Google Forms usiing jQuery I don’t think it would be too hard to insert a PayPal button in place of the Submit.  Handling all of the handshaking isn’t quite as simple though.  There doesn’t appear to be an easy solution but that is what makes for a good problem.  I’ll keep noodling on it, there has to be something I can.

11.14.12
by

WordPress Google Form v0.46-beta available

This afternoon I made a beta version of WordPress Google Form v0.46 available for download from this site. I have not posted this version to the WordPress plugin repository yet as I’d like to get some additional testing done on it before doing so.

There are a could of significant new features and a few bug fixes in this version.

  1. Columns!  You can now have your form rendered in columns.  To have a two column form, add the attribute columns=’2′ to your short code.
  2. When enabled, the simple math CAPTCHA will now appear above the Submit button instead of below it.
  3. Some minor CSS updates to support the new column feature.

Download the beta release and please let me know if you run into any issues.  You can see an example of multi-column support on my Multi-Column Test Bed Form.

Google Forms Beta (8582 downloads )
11.14.12
by

Adding columns to a WordPress Google Form?

I’ve received a few queries as to how a Google Form could be styled such that the form would appear to have columns.  I’ve looked at the HTML and CSS that Google provides and if it can be done in CSS, it is beyond my current CSS skill set!

That said, I think it is an interesting question and I had looked at solutions using jQuery a few months ago.  I saw one jQuery plugin in particular that looked promising but didn’t have much time to really dig into it at the time.

I received another request for columns today so I took a look at the problem again to see how hard it would be.  Here is one of my example forms split into two columns to give an idea of what this might look like:

I am using the jQuery Columnizer plugin to automatically split the form into columns in conjunction with some other jQuery to manipulate the form and add some additional DIVs which will make additional styling easier.

I am generally pleased with how it came out.  I am going to play with it a little more before releasing an update but wanted to provide a preview in case anyone had an suggestions or questions.

10.30.12
by

WordPress Google Form v0.45 now available

This afternoon I released v0.45 of my WordPress Google Form plugin.  After validating the changes I made in the beta with a user who was dealing with a polluted jQuery script, it looks like moving the jQuery script into the WordPress footer action is the right answer.

You can find the update in the WordPress Plugin Repository or as an update on your WordPress Dashboard.

10.29.12
by

WordPress Google Form v0.45-beta available

I’ve made a subtle but potentially significant change to WordPress Google Form that I am looking for some people to try out.  The plugin generates a jQuery script on the fly to perform a number of actions depending on the shortcode attributes present and their setting.

Historically the jQuery script has been output as part of the form code but I’ve seen a number of cases lately where another plugin or in some cases, the theme, is manipulating the page content which ends up affecting the jQuery script.

In one case I looked at this weekend something, I am still not sure what, is injecting paragraph elements into the HTML after it detects a closing DIV tag.  For the most part this isn’t a big deal except, there are closing DIV tags in the jQuery script as part of the CAPTCHA functionality.  The CAPTCHA functionality injects a DIV which holds a second DIV and some other input elements and labels.  What ever is injecting the P elements into the HTML after every closing DIV is causing my script to have syntax errors when the page loads.

To solve this problem I have moved to loading of the jQuery script into the WordPress footer action.  In my testing making this change  has zero effect on the functionality but I’d like some other people to test it and provide me feedback.

Google Forms Beta (8582 downloads )
10.26.12
by

WordPress Google Form v0.44 now available

This morning I released v0.44 of WordPress Google Form.  This is a minor update which addresses a problem reported in the WordPress Plugin Support Forum.  This update fixes the problem where the settings which are on by default, cannot be turned off.  You can find the update in the WordPress Plugin Repository or as an update on your WordPress Dashboard.

10.25.12
by

WordPress Google Form v0.43 now available

This evening I released v0.43 of my WordPress Google Form plugin.  This update addresses a couple of bugs and fixes a few more issues with the optional CSS prefix.  It also addresses a potentially serious problem when using Debug Mode with PHP version prior to 5.3.

  • Reimplemented shortcode attribute br=’on’ usinq jQuery instead of preg_replace().
  • Reimplemented shortcode attribute legal=’off’ usinq jQuery instead of preg_replace().
  • Fixed DEBUG mode so it will work with PHP 5.2 (which doesn’t support anonymous functions).
  • Fixed CSS prefix bugs which prevented CSS prefix from being applied to all Google CSS classes.
10.24.12
by

WordPress Google Form v0.42 now available

This morning I released v0.42 of my WordPress Google Form plugin. This version fixes a number of minor bugs, one major bug, and adds some new functionality. Of particular note is the ability to add a CAPTCHA to your Google Form to help reduce SPAM form submissions.

  • Added simple math based CAPTCHA support.
  • Reintroduced jQuery Validation for checking required fields.
  • Improved support for multiple forms on one page.
  • Fixed several bugs where CSS prefix, when used, was not output in some places.
  • Moved Debug control to its own tab on the settings page.
  • Added new Debug options to facilitate chasing down HTTP API issues.
  • Fixed bug where the CSS prefix, when used, was not being applied properly to elements which had more than one class. Only the first class was properly prefixed.

You can find the update in the WordPress Plugin Repository or as an Update on your WordPress Dashboard.

10.19.12
by

WordPress Google Form v0.41-beta available

This afternoon I made a beta version of WordPress Google Form v0.41 available for download from this site. I have not posted this version to the WordPress plugin repository yet as I’d like to get some additional testing done on it before doing so.

There are a could of significant new features and a few bug fixes in this version.

  1. Simple CAPTCHA!  You can now add a  simple math based CAPTCHA to a Google Form to help prevent SPAM form submissions.
  2. Improved support for multiple forms on one page.
  3. The return of jQuery validation for required fields.  This validation is optional but since I used the same jQuery plugin to implement the CAPTCHA solution, I figured I may as well make it available for required field validation again.  It works the same way it did in the initial plugin implementation until is was removed with the support for multi-page forms.
  4. New Debug options on a separate Settings tab.
  5. Several more bug fixes, notably for custom CSS prefixes.

Download the beta release and please let me know if you run into any issues.  You can see an example of the CAPTCHA and new Validation options on my Test Bed Form.

Google Forms Beta (8582 downloads )
10.19.12
by

CAPTCHA is working!

I work much better in the early morning than I do at night.  Always have.  Last night I was working on CAPTCHA support for WordPress Google Form and for the life of me, couldn’t figure what was causing a jQuery syntax error.  Granted, working on my laptop in my truck in the dark while at my daughter’s soccer practice isn’t the ideal work location but that was my situation when I had some cycles to look at it.

This morning I looked at it again, made one minor change and the syntax error was obvious.  Syntax error fixed and my CAPTCHA solution appears to be working.  I am going to clean up some debug code and then post a beta release for testing.  Hopefully I will have this formally released in the next day or two.