Adding a lead generation form to your Moodle 5 site is a simple and effective way to collect inquiries, promote your offerings, and grow your audience. Whether you’re running an online course, a professional training program, or a higher education platform, a dedicated lead form page helps turn visitors into potential learners or customers.

In this tutorial, we’ll show you how to create a custom lead generation form page for offering a free brochure download of a learning program using our ready-made HTML template, along with Moodle’s Static Pages and Contact Form plugins. You can easily tailor the HTML content and lead gen form to suit your specific use case, such as offering a free brochure, eBook, or prospectus to encourage prospective learners to submit their details.

No design work is needed if you’re using one of our premium Moodle 5 themes. The form template is ready to use and fully styled for Lumo, Edutor, and Maker. If you’re using Moodle’s Boost theme or another Boost-based theme, you’ll need to apply your own CSS styling to match your site design.

Step 1 – Install the Required Plugins

You’ll need to install two free Moodle plugins to follow this tutorial:

• Static Pages – allows you to upload and display custom HTML pages
• Contact Form – adds a working contact form to your static page

To install:

1. Download the plugin ZIP files
2. Upload the extracted folders to your Moodle site’s /local/ directory
3. Complete the installation via the Moodle admin panel

Step 2 – Set the Contact Form Recipient Email

Before the form can send submissions, you need to set the email address that will receive the messages.

Go to:
Site administration > Server > Support contact

In the Support email field, enter the email address where you want form submissions to be sent.

Step 3 – Upload and Add the Page to Your Moodle Site

We’ve created a free responsive HTML lead form template that works out of the box with our Moodle 5 themes.

Once your content is ready, follow the steps below to upload and publish the page:

1. Go to:
   Site administration > Plugins > Local plugins > Static Pages > Documents
2. Upload your customized HTML file
3. Once uploaded, you’ll see the new file listed under List of static pages
4. Copy the page URL
5. Add the link to your Moodle site’s custom menu or footer so learners can find it easily

How to Customize

To edit the content of the template:

• Open the HTML file using a text editor such as:
  • Notepad (Windows)
  • TextEdit (Mac)
  • VS Code or Sublime Text (free code editors)
• Replace all placeholder text, form fields, links, and images with your own content
• Important: Keep all HTML tags and class names unchanged to preserve the layout and styling
• Keep the following form code unchanged for the form to function correctly with the Moodle contact form plugin:
  

  <div class="form-code-holder">
      <input type="hidden" id="sesskey" name="sesskey" value="">
      <script>document.getElementById('sesskey').value = M.cfg.sesskey;</script>
      <input type="hidden" id="referrer" name="referrer" value="">
      <script>document.getElementById('referrer').value = document.location.href;</script>
  </div>
  

• For advanced customization options, refer to the Moodle Contact Form Plugin Documentation.
• Save the file with the .html extension

Why Add a Lead Generation Form to Your Moodle Site?

A lead generation page helps you:

• Collect course interest or inquiries from potential learners
• Capture contact details for future follow-up
• Promote specific courses, webinars, or programs
• Streamline your marketing and sales process

Instead of relying on external landing pages, you can keep everything on your Moodle site, fully branded and easy to manage.

Optimized for Our Moodle 5 Themes (Lumo, Edutor & Maker)

This lead form template is fully styled and tested with all of our premium Moodle 5 themes:

• Lumo – modern, professional design ideal for corporate training and continuing education
• Edutor – academic-focused theme designed for schools and universities
• Maker – clean and flexible layout perfect for online course creators and training companies

Key features:

• Built with Bootstrap 5
• Fully responsive and mobile-friendly
• Works perfectly with the Static Pages and Contact Form plugins
• Easy to customize using theme settings

See a working example in our Lumo theme demo.

Final Thoughts

Adding a lead generation form page to your Moodle 5 site is an easy way to improve engagement and grow your audience.With our free HTML template and step-by-step guide, you can set up a custom lead form that looks great and functions smoothly, with no need to start from scratch.

Download the free template and try it out on your site today.

Looking to take your Moodle site to the next level?
Explore our Moodle 5 themes to find the perfect match for your project.