Gravity Forms + Events Calendar Submissions

UPDATE: Events Calendar Pro is out and the community events plugin is on it’s way. To make the below method work with Events Calendar Pro 2.0 or above you’ll need to use this code in your functions file:

add_action('save_post', 'save_tec_event_meta_from_gravity', 11, 2);
    function save_tec_event_meta_from_gravity($postId, $post) {
        if( class_exists('TribeEvents') ) {
            // only continue if it's an event post
            if ( $post->post_type != TribeEvents::POSTTYPE || defined('DOING_AJAX') ) {
                return;
            }
            // don't do anything on autosave or auto-draft either or massupdates
            if ( wp_is_post_autosave( $postId ) || $post->post_status  'auto-draft' || isset($_GET['bulk_edit']) || $_REQUEST['action']  'inline-save' ) {
                return;
            }
            if( class_exists('TribeEventsAPI') ) {
                TribeEventsAPI::saveEventMeta($postId, $_POST, $post);
            }
        }
    }

This tutorial demonstrates how to use Gravity Forms to submit events to Events Calendar Pro from the public facing side of a WordPress theme.

Events Calendar Pro Gravity Forms Integration

First you’ll need the Gravity Forms plugin ($39) and the Events Calendar Pro plugin installed. These are both premium plugins and well worth the price. You should also install the Gravity Forms + Custom Post Types plugin to connect Gravity Forms submissions with Events.

Now that you have the above 3 plugins installed you should create a new Form.

  1. In the admin panel click on Forms > New Form
  2. Title this form and under Form Settings > Advanced change the button text to something like “Submit Event”
  3. Use the Post Fields panel to add Title and Body fields to the form.
    Post Fields
  4. Under the Title field you have created go to Advanced and check the “Save As Custom Post Type” box (this was added by the Gravity Forms + Custom Post Types plugin) and choose Events from the drop-down list.
  5. Use the Advanced Fields panel to add 1 Date and 2 Time fields (for start and end time)
    Advanced Fields
    It’s important to create the fields in this order to match the functions we will be adding later in this tutorial. The Date should be the 3rd field, the Start Time the 4th field and the End Time the 5th field.

Your form should now look like this:
Step 1

Now you can add extra fields to be used by Events Calendar Pro. Available fields:
_EventVenue, _EventPhone, _EventAllDay, _EventCost, _EventAddress, _EventCity, _EventZip, _EventState (use format like AZ), _EventCountry (use format like United States), _EventOrganizerID, _EventVenueID, _EventAllDay, _EventStartDate, _EventEndDate, _EventShowMapLink, _EventShowMap

The Venue Custom Post type uses: _VenueVenue, _VenueCountry, _VenueAddress, _VenueCity, _VenueStateProvince, _VenueZip, _VenuePhone

The Organizer Custom Post type uses: _OrganizerOrganizer, _OrganizerEmail, _OrganizerWebsite, _OrganizerPhone

For example here is how you would add an Event Venue to the form:

  • Under the Post Fields panel choose Custom Field
  • Edit this custom field and label it something like Event Venue
  • Under “Custom Field Name” choose New and enter _EventVenue
    Event Venue Custom Field
  • You can add more custom fields as needed

You should now save the form and go to Forms > Edit Forms to see a list of the Gravity Forms you’ve created. Be sure to note the Id of this Submit Event form. If this is the first form you’ve created the Id will be “1″.

Next you need to add some code to the functions.php for of the active theme. (Special thanks to Sam DeVore for this code!)

// Format Date from gravity forms to events plugin
add_action("gform_pre_submission", "format_event_date");
 
function format_event_date($form){
    $formId = 1;  // this is the gravity forms id
    $dateFormId = 3; // this is the form element that contains the date  of the form 'mm/dd/yyyy'  $_POST['input_3']
    $startTimeFormId = 4; // form element for the start time  $_POST['input_4'][0] - for hour, $_POST['input_4'][1] - for minute, $_POST['input_4'][2] - for meridian
    $endTimeFormId = 5; // form element for the start time  $_POST['input_5'][0] - for hour, $_POST['input_5'][1] - for minute, $_POST['input_5'][2] - for meridian
 
    if($form["id"] != $formId){
        return;
    }
    $date = date_parse($_POST['input_'. $dateFormId]); // break the date into an array
 
    // sql format the result
    $dateString = $date['year'] . '-' . str_pad($date['month'], 2, "0", STR_PAD_LEFT) . '-' . str_pad($date['day'], 2, "0", STR_PAD_LEFT);
 
    // get the start/end times
    $startTime = $_POST['input_'. $startTimeFormId];
    $endTime = $_POST['input_'. $endTimeFormId];
 
    // load the values for EventsCalendarPro
    $_POST['EventStartDate'] = $dateString;
    $_POST['EventStartHour'] = str_pad($startTime[0], 2, "0", STR_PAD_LEFT);
    $_POST['EventStartMinute'] = str_pad($startTime[1], 2, "0", STR_PAD_LEFT);
    $_POST['EventStartMeridian'] = $startTime[2];
 
    $_POST['EventEndDate'] = $dateString;
    $_POST['EventEndHour'] = str_pad($endTime[0], 2, "0", STR_PAD_LEFT);
    $_POST['EventEndMinute'] = str_pad($endTime[1], 2, "0", STR_PAD_LEFT);
    $_POST['EventEndMeridian'] = $endTime[2];
 }

Important Notes:

  1. Make sure to put the above function code inside php tags.
  2. $formId = 1 needs to match your forms Id #
  3. $dateFormId = 3 needs to match the Date form ID. It will be 3 if you followed the instructions above. Alternatively you may need to find this by Viewing Source on the form page.
  4. $startTimeFormId = 4 needs to match the Start Time form ID.
  5. $endTimeFormId = 5 needs to match the End Time form ID.

The last step is to add this new Gravity Form to the page where you’d like visitors to submit events. By default events will be submitted as Drafts and may be approved and edited by an admin.

Visitors to your site may now submit events which will be added to Events Calendar Pro and may be easily published to your Calendar.

57 Responses to “Gravity Forms + Events Calendar Submissions”

  1. Chris Abernethy wrote on May 4th, 2011 at 12:08 pm:

    Awesome tutorial, I implemented this today for a client and it works perfectly.

  2. @charlyjl wrote on May 4th, 2011 at 3:28 pm:

    This is great! Looking forward to testing it, in the very near future! Thank you

  3. @HomelessBrian wrote on May 5th, 2011 at 4:04 pm:

    Thank you soooo much for this! Do i gather we would need to add more code to the functions php to add more info the the event details. I would like to add Venue, Address, City, Postal Code, Phone, and cost, but i am clueless as to how to add them to the code.

  4. Tim Bowen wrote on May 5th, 2011 at 7:04 pm:

    There's no need to add more functions code, you just need to add those fields to the Gravity Form custom field area. You can follow the "_Venue" example in the tutorial and just change "_Venue" to another custom field.

  5. @HomelessBrian wrote on May 6th, 2011 at 7:06 am:

    Awesome! Thanks. Sorry for my confusion. I got it working now. I know this is slightly off topic but I was wondering if you could point me in the right direction…. I'm looking to add tweet this and facebook this buttons to the bottoms of each event. Any chance you might know where to look?

  6. Jake wrote on May 6th, 2011 at 1:38 pm:

    This tutorial is great. I had no idea it was so simple (well it is now that you figured out the functions.php code). Nice!

  7. Tim Bowen wrote on May 9th, 2011 at 4:21 pm:

    You can find Twitter buttons here: http://twitter.com/about/resources/tweetbutton and Facebook buttons here: http://developers.facebook.com/docs/reference/plu

  8. @HomelessBrian wrote on May 10th, 2011 at 4:10 pm:

    One more question. Is there a way to allow selection of event category via the gravity form?

  9. Tim Bowen wrote on May 11th, 2011 at 3:22 pm:

    I haven't figured out a way to do this, but I'm sure it's possible if you add a function to the functions.php file.

  10. valerama wrote on May 11th, 2011 at 7:11 pm:

    I can't wait to get this going! Great tutorial. Gravity Forms is one of the best investments I've made in my web design business.

  11. arora wrote on May 11th, 2011 at 10:51 pm:

    thanks for the great tutorial. My organiser Email id is not showing. Can you please show me a path.

  12. orangegatemedia wrote on May 11th, 2011 at 11:34 pm:

    Hey! thanks a lot for getting this tut up. Really helped in bringing these two great plugins together. Quick question. Everything appears to be working but all the fields that begin with Organizer. Any thoughts as to what might be causing these fields to not pass through to the events? Thanks for your help!

  13. Tim Bowen wrote on May 12th, 2011 at 8:59 am:

    Venues and Organizers require some further hacking in the functions file to get them working. This can get pretty complicated so you'll need an experience WordPress developer to help you get it working.

  14. Tim Bowen wrote on May 12th, 2011 at 9:00 am:

    You'll need to do some more hacks to the functions.php file to get Organizers to work correctly. The best place to start is to look in the MySQL database and see which fields are being created. You can then emulate these with custom fields on the Gravity Forms and let the functions file process them as needed.

  15. Dave wrote on May 18th, 2011 at 1:20 pm:

    Has anyone figured how to get the _Orgaziner fields to save in the database and show in the admin area? Please post a reply here, thanks.

  16. Todd wrote on May 23rd, 2011 at 2:57 pm:

    Great tutorial! I know the date conversion has been a tricky point up to now.

    I've been using "The Events Calendar" and have been searching for Gravity Forms integration. Any more thoughts on doing a tutorial for that?

    Thanks!

  17. Tim Bowen wrote on May 24th, 2011 at 12:04 pm:

    Todd, I don't think I understand your questions because this tutorial does show how to integrate "The Events Calendar" with Gravity Forms. Perhaps there's another Events Calendar with the same name that you're inquiring about?

  18. Todd wrote on May 24th, 2011 at 5:54 pm:

    Sorry i wasn't clear. I'm using the free version on several (10+) sites. You mentioned that this tutorial may work with the free version if modified slightly.

  19. @ryan4021 wrote on May 25th, 2011 at 6:43 am:

    He's most likely referring to The Events Calendar, which really works the same way, it's just a matter of defining the custom field values and matching them up within Gravity Forms I believe.

  20. Todd wrote on May 25th, 2011 at 7:36 am:

    I should have been clearer, sorry. I'm using the free version of The Events Calendar on several sites. You mentioned that this tutorial _may_ work with the free version if modified slightly.

  21. Lance wrote on May 28th, 2011 at 11:27 pm:

    here is my question. Is it possible to have the submission form default the newly submitted event as publish rather than draft? I have made my page only visible to administrators when they log in. They see it as a menu choice in the primary navigation. Thus, I am confident that if they are adding an event submission it should be live when they add it. Thanks for looking at this.

  22. Matthew Kettlewell wrote on June 3rd, 2011 at 6:05 am:

    I've nearly got a solution working for CForms, … I'm instead utilizing the $sp_ecp object and calling the AddMetaEvent() method…

    I'm a bit stumped at the moment, and thought you might be able to help me figure out why the call is returning before it's complete… The _POST and $post data appear correct, but something is kicking it out …

    If you have a few moments to spare, can post some code…

    Great job on the Gravato integration, not sure I would have known how to start with CForms without your start.

    Matt

  23. Tim Bowen wrote on June 14th, 2011 at 3:38 pm:

    Lance, yes you simply need to choose the "Publish" option inside the Gravity Forms area. You'll see this if you edit the "Title" or "Body" fields.

  24. Bob Randklev wrote on June 30th, 2011 at 12:43 pm:

    We have venues working great but Organizers are the problem.

    When we submit an event the entries are doubled and the organizer info isn't saved.

    It's like the custom field name has an error or something?

  25. yahv wrote on July 15th, 2011 at 2:38 am:

    Hi, I already have gravity running through headway theme, and I am wondering if adding this code could "break" my site…

  26. Janet Barclay wrote on July 26th, 2011 at 7:29 am:

    For those of us who don't "speak" PHP, can you please clarify where in the functions.php file this code should be added, and if any opening or closing tags are needed?

  27. David Holland wrote on July 29th, 2011 at 5:11 pm:

    Excellent tutorial but one question… Does anyone have any thought about how to incorporate all of the pre-existing Venues as a drop-down choice?

  28. Ft Worth Web Design wrote on August 1st, 2011 at 1:23 pm:

    @Janet I put the code at the bottom of my functions.php and everything worked except the organizer not adding as mentioned above. Like everyone else I am waiting on a solution for that. I will keep trying and update you if I get a easy fix today.

  29. Ft Worth Web Design wrote on August 1st, 2011 at 1:43 pm:

    I actually was missing "_OrganizerWebsite" custom field from my gravityform. I added it in which gave me the full compliment of _Organizer* fields which are

    _OrganizerOrganizer, _OrganizerEmail, _OrganizerWebsite, _OrganizerPhone

    Still I have the same issue. No venue and no organizer information is stored in Event Calendar Pro.

    If someone else finds the answer then I am subscribing to these comments.

    I guess I can try to poke around with the example function and see if I can force it to but maybe I can just deal with some missing information but console myself that at least all the data is safely locked away in my gravityforms entries.

  30. Kailith wrote on August 1st, 2011 at 1:47 pm:

    I tried to put the code into my functions.php and it killed my entire site. I think it might have something to do with the step that says "add php tags," but I don't know what that means or where to put them. Some help would be appreciated : )

  31. Janet Barclay wrote on August 3rd, 2011 at 10:33 am:

    I tried pasting it at the end of my functions.php file and it broke my site too. :( Any other suggestions?

  32. stacey wrote on August 8th, 2011 at 2:22 pm:

    You don't need to do that– add a "dropdown" type post field element to your form, empty out all the choices, and under "Advanced" select "Populate with a Taxonomy" and look for "Event Categories." (assuming you've defined Event Categories). Works for me, anyway…

  33. stacey wrote on August 9th, 2011 at 11:11 am:

    I'm very close to getting the organizer information to show up. I have it working on the front-end, but am not getting it to populate the Organizer meta box in admin.

    Venues works fine if you use the legacy _Event prefixed tags for venue information. There is no similar legacy information for Organizers, however, so some tweaks need to be made.

    To get it working in the front end: NOTE: This is Not Idea (read: sort of a hack), because you'll need to make these changes again if you ever update Events Calendar Pro, but for the moment, it gets me by.

    Changes are to template-tags.php.

    change this line (line 314 in Events Calendar Pro 1.3.2):

    return esc_html(getEventMeta( sp_has_organizer(), '_OrganizerOrganizer', true ));

    to:

    return esc_html((sp_has_organizer( $postId )) ? getEventMeta( sp_has_organizer( $postId ), '_OrganizerOrganizer', true ) : getEventMeta( $postId, '_OrganizerOrganizer', true ));

    And repeat that format for the lines needed for _OrganizerEmail etc. It shows up on the front-end fine.

    Now, if you look at wp_posts and wp_postmeta, and can figure out how to hack this to pull the data info admin, I'd give you a million bucks, or at least my endless gratitude….

  34. Janet Barclay wrote on August 10th, 2011 at 8:14 am:

    I switched to another theme and was able to edit the functions.php file as instructed, but I'm having trouble with the start and end times. They show up correctly in the form Entries but in the draft post as 12:00 am to 11:00 pm. What might I be doing wrong?

  35. David wrote on August 21st, 2011 at 3:49 pm:

    Yikes. Did all this, but not seeing anything in my event drafts or pending… and the submitted events also not being stored in form entries. I'm using the Arras Theme, and also have the most recent version of WordPress. Wouldn't be so concerned, except that I paid for Gravity Forms especially for this purpose (and based on this post). Help! (also, Facebook login here isn't working.

  36. David Markland wrote on August 21st, 2011 at 4:13 pm:

    Wait… no, Facebook works, and it appears that the form is showing up under forms. However, instead of appearing under "events," its showing up under draft "posts." I've nuked the php code from the site for now to see if anyone else has had the problem and perhaps found a solution…

  37. Jessica wrote on August 23rd, 2011 at 1:01 pm:

    Hi there! Brilliant tutorial. However, the events are not showing up on my grid. Any reason why that might be happening? They are approved posts so it isn't that.

  38. Jessica wrote on August 23rd, 2011 at 1:17 pm:

    I know why it's working – the submissions are going in as posts and not as events – how do I fix this? Thank you!

  39. José Antonio wrote on August 28th, 2011 at 12:44 am:

    Hi,

    i just follow all this steps but i dont see the form.

    where i see it ??

    thanks

  40. Jeff wrote on August 29th, 2011 at 11:15 am:

    How do I get the submitted custom field information to appear on the ECP event page? When a user fills out the form, they information they submit is visible on the entries page, but not on the events page.

  41. Jeremy Ferguson wrote on September 7th, 2011 at 11:40 am:

    After digging into this a little, I've found that the issue here is that Organizers and Venues are actually their own post type. So in order to use the custom fields that go with organizer and venue a second post will also need to be created. The hitch is that gravity forms will only let you create one post per form, so either this will need to be handled on the backend with a filter or by a second form entirely.

    For my current project we've decided to just scrap the organizers and use the old venue setup for now until we see what version 2.0 looks like which is supposed to include this functionality anyway.

  42. Jonathan G. wrote on October 6th, 2011 at 3:09 pm:

    This is an awesome article. Nice work Tim.

    Unfortunately, the custom fields for venue and organizer don't seem to work with the current version of Events Calendar Pro.

    Is there another way to make this work?

  43. Jonathan G. wrote on October 7th, 2011 at 12:06 pm:

    I now have everything working with both organizers and venues and wanted to share the code with you all to hopefully help some people out. Please note that for organizers and venues I added the fields in Gravity Forms as standard and advanced fields. I didn't use any custom field form elements since Events Calendar Pro doesn't use those anymore. You can find all the code I did at http://support.makedesignnotwar.com/discussion/co….

  44. Christina wrote on October 13th, 2011 at 12:27 pm:

    Are there any plans to update this for the new Pro version? I've followed the steps but persisting the date and times no longer seem to work. I know they will be including this as a future add-on, but I have one project that I can't hold off on.

  45. Patricio wrote on November 2nd, 2011 at 9:12 am:

    Can't use Pro, do you have a date for Community Events Plugin? or can this be made to work with the free Events Calendar?

  46. Blake wrote on November 8th, 2011 at 4:54 am:

    All works well, but it doesn't automatically import the venue name or anything when I Set it up too. Paid a lot of money for this and figured it would be easier to set up.

  47. Blake wrote on November 11th, 2011 at 5:05 am:

    Is there an updated version of this anywhere? All seems to work great, but I really need to have Event Name and Event Venue, etc to post. I can't figure out how, I've tried some many tutorials and none seem to work.

  48. markus wrote on November 13th, 2011 at 1:43 pm:

    Hey Christina,

    i have got the same problem… i need the functions very urgent. Have you just a solution?

  49. Meghan wrote on November 19th, 2011 at 9:14 pm:

    Hi there…I'm hoping to find a solution to this also. Set everything up and the event is submitted, but only the title, description and dates show up. Everything else comes up blank.

    Blake, have you been able to find a solution?

  50. fred wrote on December 21st, 2011 at 7:08 pm:

    Thanks for this tip. Is it possible to a user to add 10 or 15 events ?

  51. Aaron wrote on December 21st, 2011 at 9:34 pm:

    I did everything in that post except for adding the top section code because this line is highlighting an error and breaking the site:
    Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING in /var/www/wp-content/themes/themename/functions.php on line 475

    if ( wp_is_post_autosave( $postId ) || $post->post_status ‘auto-draft’ || isset($_GET['bulk_edit']) || $_REQUEST['action'] ‘inline-save’ ) {

    please advise.

  52. @c0wfunk wrote on January 4th, 2012 at 11:47 am:

    http://tri.be/support/forums/topic/integration-wi… has a thread on making this all work in the 2.0 paradigm.

  53. SmartRedFox wrote on February 10th, 2012 at 10:04 am:

    For people who are running into errors after setting up the above: The code at the tip of the page seems to be missing some characters.

    The full code can be seen on the plugin developers site here: http://tri.be/event-submissions-using-gravity-for

    When copying and pasting code from that site I found that a lot of characters have been double-encoded. which basically means it will also kill your site. I've pasted a cleaned up version here: http://pastebin.com/jeGDx21v

    I hope this helps.

  54. @shaunw wrote on April 30th, 2012 at 1:25 pm:

    Using the snippit at the top to "… make the below method work with Events Calendar Pro 2.0 or above …" prevents me from being able to update existing events.

    Using…
    the-events-calendar.2.0.5
    events-calendar-pro.2.0.5
    gravityforms_1.6.3.3.4
    gravity-forms-custom-post-types.3.0.1

  55. Kyle wrote on June 28th, 2012 at 5:27 pm:

    Hey, I saw this recently and had a question about a modification involving gravity forms new feature involving field calculations.

    Would it be possible to have the endtime adjust to create predetermined blocks of time using a drop down or something similar? I.e. A user selects a time block from the drop down of, say, 2, 4, or 6 hours and then selects the start time, with the end time calculated based on whether the user chose 2, 4 or 6? This would really add to the versatility of these two together–you could then sell blocks of time and have them schedule at appropriate start times, and charge accordingly for each block.

  56. James wrote on July 11th, 2012 at 8:33 am:

    I was getting the same error. I'm using the free version of the calender plugin, so I'm assuming that you are as well since we're getting the same error. I just deleted part of it and it works fine for me.

    add_action('save_post', 'save_tec_event_meta_from_gravity', 11, 2);
    function save_tec_event_meta_from_gravity($postId, $post) {
    if( class_exists('TribeEvents') ) {
    // only continue if it's an event post
    if ( $post->post_type != TribeEvents::POSTTYPE || defined('DOING_AJAX') ) {
    return;
    }

    if( class_exists('TribeEventsAPI') ) {
    TribeEventsAPI::saveEventMeta($postId, $_POST, $post);
    }
    }
    }

    Good luck.

  57. Alex wrote on December 29th, 2012 at 11:01 pm:

    hi there appears to be a mistake in this line:

    <pre> if ( wp_is_post_autosave( $postId ) || $post->post_status 'auto-draft' || isset($_GET['bulk_edit']) || $_REQUEST['action'] 'inline-save' ) {
    </pre>

    according to dreamweaver, cant see it myself. Could you help.

    Cheers

Leave a Comment