Free tools are usually not the easiest to use, and this is no exception. But it is a competent system if you follow all of the steps.
I. Create the Event in the Event Manager
- Click Event Manager in the WP left sidebar menu. Events opens.
- Check to see whether the event already exists. If so, then all you have to do is check the description includes the cost, and update the Registration email/URL. Skip to step II. Create the Ninja Form.
OR
If this is a brand new event, click Add New. The Event details page opens. - Type the Event Title. This should include the month and year if this event has been done before.
For example: Domelands Campout January 2024 - Type the event details. This should give new scouts and families a clue of what this event is about. Do not assume they know anything that has ever happened before. It is helpful to include things like event cost, drive time, whether 4×4 capability is needed, restrictions, etc.
IMPORTANT: make sure the Ninja Form fees field matches the fee listed on the event. - Event Data
– Online Event – Yes or No
– Event Location – This is what you would type into Google Maps
– Event Banner – This opens the media tool; Merit Badges typically use a picture of the patch or book, try to use something free that won’t get us sued
– Video URL – We don’t use this
– Start Time – Time you expect people to be there
– End Time – Time you expect people’s rides to show up
– Organizer – We don’t use this
– Event Recurrence – We don’t use this
– Featured Listing – Select this box so it shows up in the events listing
– Listing Expiry Date – This is the day this calendar event removes itself from the events listing, usually same day as the event ends
– Zip Code – Optional, afaik it doesn’t do anything
– Event Country – We don’t use this
– Registration email/URL – This is where the registration button goes; leave this blank until later
– Start Date – Date the event starts
– End Date – Date the event ends
– Registration Deadline – Date the registration closes
– Venues – We don’t use this
– Cancelled Listing – We don’t use this
Event Sidebar
– Search Event Types – Select the box that applies to this event
Click Publish.
Click the browser back arrow to return to the Events page.
II. Create the Ninja Form
- Click Ninja Forms in the WP left sidebar menu. Ninja Forms opens.
- Check to see whether the event already exists. If so, then click the name of the existing form you want to edit. The existing form opens.
OR
Search for *Campout Registration Form 2024. Click the Gear Icon to the right of the entry in the Ninja Forms list. A menu appears under the list item.
Click Duplicate. A new form, *Campout Registration Form 2024 – copy, appears.
Click the new form title. The new form opens.
Change the name of the form. It should match the name of the Event. For example: Domelands Campout January 2024
– Click Advanced > Display Settings. The Form Title field opens on the right side of the page.
The name of the form should match the name of the Event.
Click Publish.
Click Form Fields. - Form Fields
– Event Details HTML field: “Camping fees for this event are $35. This covers food, gas for the drivers, permits (if any), etc.” Edit as needed. Ensure the two HTML field numbers match.
– fees HTML field: number for cost in whole dollars. This is used by the credit card process. IMPORTANT: make sure the Ninja Form fees field matches the fee listed on the event.
– First Name (required)
– Last Name (required)
– Email (required)
– Parent’s Email
– Phone (Required)
– Participant Type (Required): We cannot do guests anymore. All attendees must be registered
– Patrol (required)
– Seatbelts
– Any food requirements? (required)
– Other Allergies
– Payment Type (required): Credit Card or Venmo
– Register button
Click Publish. Click the X in the upper right corner. The page returns to the Ninja Forms list.
III. Create a Ninja Form Viewer
- Click NF Views Pro in the WP left sidebar menu. NF Views Pro opens.
- Check to see whether the form viewer already exists. If so, then click the name of the existing form viewer you want to edit. The existing form opens.
OR
Search for *Campout Registration Form 2024. Click near the title but not on the title. A menu appears. Click Duplicate. A new form viewer, *Campout Registration Form 2024 – copy, appears.
Click the new copy form title. The new copy form viewer opens.
Change the name of the form viewer. The name of the form viewer should match the name of the Event.
Click Save View. - Entry List Fields
– First Name
– Last Name
– Email
– Parent’s Email
– Phone
– Any food requirements?
– Other Allergies
– Seatbelts
– Patrol
– Paid - In the right sidebar menu, click View Settings.
– View Source: Select the Ninja Form that has the same name as your form viewer. This is where the viewer gets its data.
– View Type: Table
– We don’t change any other settings.
Click Save View. - Click the [/]Embed button. Click the
button to copy the nf-views id to the clipboard.
IV. Create the Page
A. Edit the Page Outside of Elementor
- Click Pages in the WP left sidebar menu. Pages opens.
- Click Add New Page. The Page details page opens.
- Add title: Type the Page title. The name of the page should match the name of the Event.
Scroll down to Ultimate Member: Content Restriction.
Select Restrict access to this post.
Change Everyone to Logged in users.
Select all of the roles.
In the right sidebar menu, Append a Ninja Form. Select the form with the same name as this event.
Click Publish. - Click the Edit with Elementor button at the top of the page. The elementor left sidebar menu opens.
B. Edit the page Within Elementor
- Insert the Table to Show Who Else is Going
– In the elementor left sidebar menu, search for Shortcode. The Shortcode widget appears in the menu. Click Shortcode. The gray box appears on the page.
– In the shortcode wiget in the left sidebar menu, paste the nf views id you copied from NF Views Pro. - Insert the Venmo QR Code Image
– In the elementor left sidebar menu, search for image. The Image widget appears in the menu. Click Image. The image box appears on the page.
– In the Image widget in the left sidebar menu, click the placeholder image. The Insert Media tool opens.
– In the Insert Media tool, click All Files and then search for Venmo. Click the QR Code with more white space around it, and then click the Select button.
– In the Image widget, change Image Resolution to Medium 300 x 300.
– In the middle of the page, click to select the image, which maeks the image box visible. Click the right side of the box and drag it to make the box align with the image and make room for a text box to the right of the image.
– At the bottom of the left sidebar menu, click Update. - Insert the Text Box Telling Everyone They Need to Pay to Go
– In the left sidebar menu, click the nine square icon in the upper right corner of the menu. The elementor left sidebar menu appears.
– In the elementor left sidebar menu, search for text. The Text Editor widget appears in the menu. Click Text Editor. The text box appears on the page.
– Copy the following text:
Don’t forget to pay when you register. Using Venmo is the easiest. Just point your phone camera at the QR Code on the left. Remember to put the name of the campout in the Venmo comments so we know which event you are paying for.
– Paste the text into the Text Editor widget in the left sidebar menu.
C. Arrange the Elements
Drag the shortcode box below the Venmo image and the Venmo text.
– At the bottom of the left sidebar menu, click Update.
– Click the browser back button to get out of Elementor and back into the page. You should see the page name and then blue Edit with Elementor button.
D. In the Page, Copy the URL
– In the upper right corner of the page, click Update.
– Copy the page URL. You can get it if you click the sidebar icon. The right sidebar menu opens. Under Page, you can find the URL. Right-click to copy the link.
– Click the browser back arrow to return to Page
V. Update the Calendar Event
Edit the Calendar Event Registration email/URL Field
– Open the Calendar Event for the campout.
– In Registration email/URL, paste the link you just copied