Advertisement

Creating Nifty Petitions Inside Your Posts

by

WordPress is a great multi-purpose platform. You can create many websites with many different purposes: a corporate website, a photography showcase, a news portal, a restaurant website with interactive menus... Oh, and blogs, of course. You can blog with WordPress. Forgot about that.

Strangely, non-profit organizations tend to overlook this flexibility and take advantage of it. In this tutorial, we're going to show how to create a simple petition script to demonstrate how an organization can benefit from WordPress.


What Are We Building, Exactly?

I'm a huge fan of shortcodes (as you can see from my previous posts), so we're going to make a bunch of shortcodes and some helpful functions for the shortcodes to use. We're going to get all of these together in a file called petition.php and use it as a WordPress plugin.


Helper Functions

Since we're going to use them inside our shortcodes, I thought it would be better to create and explain them first.

A Basic E-Mail Validating Function

If you're using PHP5 on your server, we're going to use the built-in e-mail validators for our function:

And if you're using something ancient like PHP4, you can use a different function which makes use of regular expressions:

Please Note: You can't use both!

The Function to Submit the Entries

We could create and use a different database table to contain the petitions' submissions but I don't think that it's a good practice. And hey, what's wrong with custom fields?

As you can read from the code;

  • We took the $name, $email and $date variables into the function (from the shortcode which we'll get to in a minute)
  • Put the three variables together by creating an array and serializing it
  • And saved the data as a custom field named 'petition_submission'

Simple, right? Now we can get to the kinda-hard part.

The Function to Fetch the Submissions

We can now save the submissions but how will we get them and do stuff with them? Here's how:

Remember when I said it's going to be kinda-hard? I lied:

  • We assigned the values of the post metas with the 'petition_submission' key to an array variable
  • Then we got $number (5 by default) of submissions from the end of the array (notice the -1)
  • And we returned the reversed list of that sliced array to order it newest to oldest

Extra: CSS Selectors to Use

We'll be using some CSS selectors in the code, so put them in your style.css file of your theme:

Feel free to edit the default values of the properties :)


Shortcodes

We completed the helper functions and the CSS code. Now, let's get to the fun part - the shortcodes!

We could do with just one big shortcode to attach the form, list the entries and show the number of submissions but... why kill all the fun? Besides, separate shortcodes for these three elements would liberate us to use them wherever we want in our content.

Did I tell you how I love shortcodes?

The Shortcode for the Petition Form

This function is a long one, so I'm going to explain the code inside the code, with PHP comments:

I tried to be as clear as I can be but if you believe that I left something out, feel free to ask me by commenting on this post!

The Shortcode for the List of Submissions

The "latest entries" part is the proof that people are joining your cause, so we have to list at least some number of submissions.

This is not a short function either, so I'll explain the code with comments again:

Again, feel free to ask anything you want to ask by commenting on this post.

The Shortcode for the Petition Count

This is a really small function, just to get how many entries are submitted:

As you can see, it just throws the custom fields to an array and counts it and return the number.


Conclusion

I should emphasize that this is a very simple example to show organizations can benefit from WordPress by utilizing scripts like these. If you can think of an improvement for this script (or tutorial), please share your thoughts in the comments below. Thanks for reading!

Advertisement