Once you have your membership types setup you may want to allow potential members to signup for membership via an online form.
With CiviPlus this is easy to do using the powerful "Webforms" module.
Features supported by Webforms
Membership signup on behalf of yourself.
Membership signup on behalf of someone else, for example a gift membership.
Membership signup on behalf of an organisation including specifying other important contacts.
Signup with credit card payment, Direct Debit payments (annual, quarterly or monthly), or option to issue an invoice for later payment.
Allow users to select the type of membership they would like or have the form specify the type of membership using conditions.
Allow users to purchase "add-on's" such as a magazine subscription or optional journal.
Automatically create a user account for your member in the CiviPlus portal when they sign up.
You can find some introductory details on how to create a webform on this page: https://guide.civi.plus/en/articles/9974650-creating-a-simple-webform-in-civiplus
Creating a basic Membership Signup Form:
Create a New Webform:
In your portal navigate to Content → Add Content → Webform
Alternatively, find “Add new webform” from the Webforms page (
admin/structure/webform).
Title your form
Provide a clear name, e.g. “Membership Signup Form.”Save
Click Save to create the new Webform. You will be taken to the form’s Build or Edit page.
Enable CiviCRM Processing on the Webform
Go to the Webform’s CiviCRM tab
Within your new Webform, you should see a “CiviCRM” tab or sub-tab (depending on your version).
- Click on CiviCRM to configure the integration.Enable CiviCRM for this Webform
Check “Enable CiviCRM Processing” (or a similarly worded box).
This step tells the Webform that you will be using CiviCRM fields and actions.
Save Configuration
Scroll down to the bottom and click Save.
Add Contact and Membership Fields
Next, you will add the fields necessary for capturing membership signup information.
Go to the CiviCRM tab → “Add CiviCRM Element”
You should see a list of possible CiviCRM-enabled elements, such as “Contact,” “Membership,” “Contribution,” etc.Add and configure Contact fields
Usually, you will want the user’s name and email address at minimum.
Click “Add CiviCRM Contact” and select the contact type: typically “Individual.”
Configure which contact fields (First Name, Last Name, Email) you want to capture.
Add a CiviCRM Membership element
Check “Membership” to enable membership information on this form.
This will allow you to set the membership type, membership status, and other membership-related options.
Configure Membership settings
Membership Type: Select the membership type (or types) that a user can sign up for (e.g., “General Membership,” “Student Membership,” etc.).
You can select "User Select" to give the user the option to select a membership type themselves.
Save
Always remember to click “Save” or “Save components” when you finish adding your fields.
Add Payment (Contribution) Fields
To allow credit card payments, you’ll need to add and configure Contribution fields in the Webform.
Within the CiviCRM tab, click “Add CiviCRM Element” again
Select “Contribution”
This will provide you options to configure financial details.
Configure Contribution settings
Financial Type: Choose the relevant financial type (e.g., “Membership Fee” or “Donation” if you are combining membership with a contribution).
Payment Processor: Select the payment processors you would like to offer, for example Stripe, GoCardless, or "User Select" if the user can select.
Amount: If membership fees are fixed, you can set a static amount. If they vary by membership type, ensure the membership type(s) and their corresponding fees are configured correctly in CiviCRM, and then you do not need to enable any fees field.
Contribution Page Configuration
Select the contribution page you will be using to process this transaction.
Save
Save the configuration again.
Adjust Field Layout (Optional)
You may want to rearrange how the membership and payment fields appear:
Go to the “Webform” tab of your webform and then > Components.
Drag and Drop Fields to reorder them, or place them in different fieldsets/sections.
Rename Field Labels so they make sense to your end users (e.g., “Your Membership Type” instead of “Membership 1”).
Select Options for any user select fields so that the options you would like the user to see are exposed.
Test the Form
Before making the form public, test it end-to-end to ensure that memberships are being correctly recorded in CiviCRM and that payment is processed.
Preview the Webform
From the “Webform” or “CiviCRM” tab, click View.
Fill out the form with test data, and enter credit card details (test credentials from your payment processor if available).
Check results
After submitting, log in to CiviCRM and check:
Contacts: Was the contact record created or updated?
Membership: Is there a new membership record with correct membership type and start date?
Contribution: Did it create a contribution tied to the contact?
Payment: Did the payment process successfully via your payment processor?
Make adjustments if needed
If you spot any misconfiguration, return to the Webform’s CiviCRM settings to correct membership fees, types, or payment processor settings.